Dreamweaver - Coding your first website using Dreamweaver

Name: Dreamweaver - Coding your first website using Dreamweaver
Rating: 4.4 (743 reviews)

Create a beautiful, responsive website and publish it with the newest and most useful tricks from Dreamweaver.

Created byDaniel Walter Scott

Last updated 1/2025

English

What you'll learn

Build a responsive website
Use Dreamweaver CC 2017 proficiently
Understand HTML and CSS basics
Create a mobile friendly website

Course content

6 sections • 14 lectures • 2h 11m total length

Introduction1:25
Hi, my name is Dan, and you, my creative type friend, are going to code your very first website.

Now, we're going to make this short, we'll make it super easy, and you have to think of all the extra money you're going to make with your mad, new web design coding skills.
What we'll be building and resources5:48
Hey there, in this video we're going to look at what we'll be creating throughout the site, as well as all the resources that I've got for you to help you along with this video series.

So, here's the website that we'll be building. It's a portfolio site for Creative, and, I'm happy for you to use this exact same layout for yourself, just switch out obviously, the images, and the logo.

Our first HTML & CSS web page13:46
In this lecture we create our first HTML page and practice styling in our CSS sheet. We will also touch on how to make a new site in Dreamweaver, including the folder structure for images and css etc. We'll also have a look at the best working environment for building our site.
Making your site responsive7:16
In this lecture we're going to look at how to build the base of a responsive website. Responsive websites are one of the most important part of the internet in today's age. Thankfully, we make it easy to do. We're going to introduce you to media queries and explain how too use them effectively using the 'desktop first' method.

Creating a navigation hamburger menu14:40
The hamburger menu! One of the most revolutionary buttons of our time. In this lesson we look at using a hamburger menu to hide our navigation at mobile size.
Styling our responsive navigation menu19:20
In this lecture we're going to look at how to style our awesome burger menu that we made in the previous lecture.
Real time preview on phone & tablet3:38
In this lecture we're going to look at how we can accurately preview our website's mobile view on our actual phones using Adobe's build in preview option for mobiles.

Working with typography on a website5:15
In this lecture we're going to look at fonts, where to get them, how to make sure they're fast and other things. Specifically how to use them. We will be using Google Fonts in this course.
Creating our hero box22:05
In this lecture we're going to look at creating the ever popular - Hero Box. The hero Box is one of the most popular modules of websites recently, so you should know how to make one. And you will!
Adding our image grid13:50
In this lecture we will create the image grid for our page, the grid will be responsive and resize when the browser gets smaller.

Lasts things now that you’re a coder4:11
In this lecture we'll discuss making new pages, getting paid and we'll touch on what you can do next to further your knowledge!
Dreamweaver Cheat Sheet14:53
This video is a compilation of useful shortcuts and abilities that Dreamweaver CC 2017 haves that you should be using! Check it out to improve your workflow.
Continue learning with me! Links inside.0:44

Requirements

You'll need a copy of Dreamweaver CC 2017 or above. A free 30 day trial can be download from Adobe.
Basic design knowledge will be helpful
If you're not sure if this course is right for you. Email me what you’re trying to do and check if you’re on the right track.

Description

Hi - my name is Dan and I’ll be leading you through this course on how to code responsive websites using Dreamweaver CC.

These are the skills you’ll need to become a professional web designer. You’ll learn how to make responsive websites in Dreamweaver.

We cover everything you need to build your first website. From creating your first page through to uploading your website to the internet. Creating mobile, tablet and desktop versions.

I’m a Dreamweaver Certified Instructor and an Adobe Certified Web Specialist.

With exercise files you can download and work along with me. At the end of each video I have a downloadable version of where we are in the process so you can compare your project with mine making it easy to see where you might have a problem.

I’ll be showing you how to work with Dreamweaver to easily create HTML & CSS websites. How to create mobile and tablet versions of your design and how to test your website on your phone.

I’ll be teaching you how to create navigation bars using the ever so popular 'burger menu' style.

This course is full of the foundation techniques to be a front end web developer. By completing this, you'll have an excellent insight to what it takes to take a step into the wonderful career of Web Design!

Now it’s time to upgrade your skills, get that better job and impress your clients.

Note: A piece of the course that references the website 'slicknav' is now no longer accurate as the slicknav site has been taken down, however the files needed to complete the course are a part of the exercise files so you won't be missing out on anything!

Who this course is for:

This course is for creatives who want to implement their design knowledge into the web industry
Entrepreneurs
Dreamweaver users that want to update their skills to the newest release
This course is suited for people that want to learn the basics of coding a website

Dreamweaver - Coding your first website using Dreamweaver

What you'll learn

Explore related topics

Course content

Overview2 lectures • 7min

Building our first mobile friendly web page2 lectures • 21min

Creating a navigation3 lectures • 38min

Creating the content for your website3 lectures • 41min

Publishing1 lecture • 5min

Conclusion3 lectures • 20min

Requirements

Description

Who this course is for: