Lasts things now that you’re a coder

This lesson is exclusive to members

Course contents
SECTION: 2
Building our first mobile friendly web page 21:02
SECTION: 4
Creating the content for our website 41:11
SECTION: 5
Publishing 4:59
SECTION: 6
Conclusion 4:12
SECTION: 7
Cheat sheet & shortcuts 14:54

Questions

You need to be a member to view comments.

Join today. Cancel any time.

Sign Up

Course info

13 lessons / 2 hours

Overview

Do you want to earn more as a designer? Then stop telling everyone you’re ‘a designer, not a coder!’ It’s time you stopped missing out on a huge chunk of the income surrounding web design. If you’re a freelance, it’s time you stopped having to navigate the waters of finding and working with a coder. If you’re on staff, wouldn’t you like to be worth a lot more, and paid accordingly, because you bring more value to the company?

So before you start excusing yourself as a ‘visual’ kind of person, how about using Adobe Dreamweaver 2017 to learn, develop and deploy code within your web designs. You already know a lot about Dreamweaver, so I’d like to show you how to use the other half that you sometimes ignore because it’s hidden from view.

I’m Dan, a very experienced designer and teacher. I know design and code from years of work in the trenches as a freelance. I know how to get you to do it because I’ve spent the last few years teaching people just like you, with no previous knowledge, how to code.

You’ll learn by creating a portfolio website with the layout, graphics and code you need to sell your new skills. Or, finish your own website. To real world standards.

The new Dreamweaver 2017 has been specially redesigned to make code easier to see, easier to work with, and most importantly, easier to understand. And being an Adobe Certified Expert, I know what you can do with the new tools. I know exactly how to get you up to speed with enjoyable hands-on training that shows you how to use code and Dreamweaver 2017 the way they work best. Together.

If you’re a designer working on websites, it’s time you gained the other half of the skills it takes to get your designs online and working properly – without being at the mercy of someone else.

Upskill, take control, and create a lifelong foundation in understanding and creating code. You’ll not only be better as a designer; you’ll be far more valuable to your clients or employers.

It’s time you stopped avoiding half of your potential. It’s time you made yourself more in demand. It’s time you let me teach you code, from a designer’s perspective, with Dreamweaver 2017. Contact me now, and I’ll take you from zero to hero.

What are the requirements?

  • You'll need a copy of Dreamweaver CC 2017 or above. A free trial can be download from Adobe here.

  • No previous Dreamweaver or web design experience is necessary.

What am I going to get from this course?

  • 13 lectures 2 Hours 11 minutes of content!

  • You'll learn to build a portfolio website.

  • Download exercise files & cheat sheet.

  • Create mobile, tablet & desktop versions of the website.

  • Build a responsive navigation with burger menu.

  • How to get the most from your portfolio Images.

  • How to use beautiful web fonts in your designs.

  • How to publish your website.

  • How much to charge for your work.

  • How to get paid.

  • Getting up & running your first web job.

  • Forum support from me.

  • All the techniques used by professional website designers.

  • Ways to preview your designs straight to your mobile device.

  • Professional workflows and shortcuts.

  • A wealth of other resources and websites to help your new career path.

What is the target audience?

  • YES: This course is for beginners. Aimed at people new to the world of web design. No previous Dreamweaver experience is necessary.

  • NO: This course is NOT suited to people experienced in using HTML & CSS.

Course duration 2 hours + your own study.

Daniel Scott

Daniel Scott

Founder of Bring Your Own Laptop & Chief Instructor

instructor

I discovered the world of design as an art student when I stumbled upon a lab full of green & blue iMac G3’s. My initial curiosity around using the computer to create ‘art’ developed into a full-blown passion, eventually leading me to become a digital designer and founder of Bring Your Own Laptop.

Sharing and teaching are a huge part of who I am. As a certified Adobe instructor, I've had the honor of winning multiple Adobe teaching awards at their annual MAX conference. I see Bring Your Own Laptop as the supportive community I wished for when I was first starting out and intimidated by design. Through teaching, I hope to bring others along for the ride and empower my students to bring their stories, labors of love, and art into the world.
True to my Kiwi roots, I've lived in many places, and currently, I reside in Ireland with my wife and kids.

Downloads & Exercise files

Download Exercise Files

Transcript

All right, so, to wrap up, the last things you need to do, I guess, to kind of complete a website is to create other pages. And let me just quickly briefly go into it as it is, literally we just create another page, like we did this one, and let's say we're going to start with the basis of our home page. There's our 'idex.html'. So, I would like to-- I'm just going to start with it, so I'm going to duplicate it. ‘Edit’, 'Duplicate'. There’s this one called 'Copy'. I'll rename it. 'Edit'. 'Rename'. And I’ll call this one my 'Contact-Me' page. 

Remember no spaces, just use hyphens, or underscores, so I've got this. I'll ‘double click’ it to open it. I got my 'index' page, my 'home' page, and now this 'Contact us' page. And what we're going to do in this one is, is you go in through, and start changing it depending on your design from, say, Photoshop. So, I'm going to change this to, maybe, 'Contact Me', and I'm going to get rid of that. You start styling this page. Let's have a look at it in the browser. Here it is. So, you can see, this is my 'Contact Me' page. I've got rid of that top bit. I've still got my home page. So if I switch back to this one, here he is, here's my 'home' page, and my 'Contact Us' page looks very similar. And as that goes through now, I decide on how many columns I want, what's going to go in those columns, add 'text', add 'type', probably a form in this one. 

Now, to connect the two. So, let's go to 'index', and I want to connect them up. Remember, we used hashes before, so up here, we use hash '#', so what I'm going to do is, delete the hash '#', and I'm going to call it 'Contact'. As you can see, pre-fills it in. Nice! 

So my menu now, when I click on 'Contact Me' should jump out to this one. Preview it in the browser. Great! So on my home page, I click on 'Contact Me', and it goes to my 'Contact Me' page. And, yes, that's it then. Go off, and build yourself some pages, and connect them up to this one. Now, the other things you can do is, I've got a bunch of other courses, and there is one for Photoshop. We just kind of had a mock-up at the beginning. There's a Photoshop for Web Design course that I've got. And there's also a larger course. This one here, I guess is a short one. It's a few videos here for responsive web design. I've got a long one, it's about 50 videos, and it's to do with something called Bootstrap. It's in Dreamweaver, and it's kind of a next step after this one. We kind of show you some of the same features, but it's a lot more detailed. We'll get into that one. There's a UX course, becoming a UX designer, and there's things about domain names. 

Other things you can do, if you're a trainer, and you've got enough to teach this one here, I've got teacher resources. Have a look here, on the site here, there'll be a link for teacher resources. And there's notes that you can get your hands on, and you can use these exercise files to teach one.  

And what else? Post your projects. So, you might have followed along, but switched up the images to yours. I'd love to see it. You've picked up a different font, I'd love to see it. I really like to see this sort of stuff. So links, or screenshots, anything you can. Stick in the comments. There's lots of different ways on the different sites to send me what you've done, and I'd love to see them. And, also give it a review if you've enjoyed it, if you've liked my teaching style, or if you haven't. Whack a comment in there, and give it a review, so I can make it better. 

What else? Ah, the last thing is about getting paid. And I've got a whole video series on that as well. About how to run a brief, how to make sure you get paid on time, what kind of cost you should charge, and there's a full course on that. Go check it out. Yes, check in on one of my other courses. 

Okay, my friends, we have come a long way. We have built a portfolio site. We've learned what media queries were, we've done cool responsive navigation, now it's time for you to go up and build your own site. Had a time, good people, and I will see you again in another video series.

  • Powered by Marvin
  • Terms of use
  • Privacy policy
  • © Bring your Own Laptop Ltd 2024