Responsive Web Design with Adobe Dreamweaver

A course by Arturo Servín
Web designer. Mexico City, Mexico.
Joined July 2016
, Web designer

Learn the basics of HTML and CSS to create a responsive website with a visual interface step by step

  • Spanish with subtitles in English
  • 97% Positive reviews (136)
  • 2684 students

Learn the basics of HTML and CSS to create a responsive website with a visual interface step by step


Spanish with subtitles in English
  • 97% Positive reviews (136)
  • 2684 students
  • Online and at your own pace
  • Audio: Spanish
  • Level: Beginner
  • 31 lessons (5h 1m)
  • Available from the app
  • Spanish, English, Portuguese, German, French, Italian, Polish, Dutch
  • Unlimited access forever
  • Certificate upon completion of the course


When designing a website, you have to think that it will be seen on a computer, but also on a smartphone or iPad. Phone use is gaining more and more weight and this places designers in a new scenario, in which they must design for various formats, thinking about the multi-screen user’s comfort.

In this course, web designer Arturo Servín—also known as Monky Lab—will teach you how to make a responsive website with Adobe Dreamweaver in a visual way, using a graphical interface with construction and writing tools, with HTML and CSS code. By fusing basic programming and design, you will gain greater control in the elaboration of any web file.

This is already the fourth course by Arturo Servín and, to make the most of this one, you can complement it with his Adobe Photoshop for Web Design course, in which you will learn the key aspects of responsive design and layout in a simple way.

About this course

Course table of contents

  • U1
    U1. Introduction
  • U2
    U2. Principles of web design
  • U3
    U3. Losing fear of Dreamweaver: building a basic web page
  • U4
    U4. Adding style to a web page
  • U5
    U5. A responsive site
  • U6
    U6. Website publishing
  • FP
    FP Final Project
View details

Arturo Servín starts the course explaining how he got started in web design and how he has been facing various technological changes and advances. He will talk about his influences and show you functional web design references.

Get to know the basic principles of web design, to then learn how to differentiate UX from UI. Arturo will also give you some advice on art direction and the construction of the site and its standards.

Learn how to use the tools Adobe Dreamweaver offers to build a website, in which you will be placing the base tags with HTML language and establishing parameters. You will experiment with placing text and images, as well as links to different kinds of files.

Complement the visual structure using CSS windows. You will learn to generate selectors and values, then to establish the box model oriented to responsive parameters and through CSS elements you will style your page: fonts, box design, position application, display, and floats; and you will apply background images, borders or lists, and classes, among other elements.

How to make your site responsive? Establish the construction parameters of the site using Media Queries for the different measures required, create a simple menu that works for both smartphones and computers, and see how to review and correct it before uploading your website.

Everything is now ready to publish! Using the FTP window of the program, you will synchronize the local folders of the site with the folders of the remote site. This way you’re able to make changes immediately on your website.

What is this course's project?

You will develop a basic one-page responsive website, with functional deliverables, both for clients and for more advanced programming teams.

Projects by course students

Who is it for?

Graphic designers who haven't made the move to web design, beginner web designers, initiated UI designers, and anyone who wants to learn how to design their responsive web page.

What you need

For this course, it is not necessary to have any previous knowledge in web design, since you will learn HTML and CSS from scratch, but completing Arturo Servín’s, Adobe Photoshop for Web Design, may be useful.

As for tools, you will need a computer with Adobe Dreamweaver CC 2019 or higher installed.


Reviews

2684 Students
136 Reviews
97% Positive ratings
  • More reviews

Arturo Servín

A course by Arturo Servín

TeacherPro
Web designer

Arturo Servín is a graphic designer specialized in web design and has been a web designer for the magazine a! Design, in addition to Community Professional for Adobe Systems for two years, and professor at different universities in Mexico, including Miami Ad School Mexico City. Guest instructor from different educational institutions, such as the Iberoamerican University, Anáhuac University Cancún campus, Tecnológico de Monterrey, Universidad de las Américas in Puebla, Universidad Autónoma de Guadalajara, among others. Founder of his own studio focused on ecommerce , web design and branding .


Contents

  • U1

    Introduction

    • Presentation
    • Influences
    • What will we do in the course?
  • U2

    Principles of web design

    • What are UX and UI?
    • Art direction
    • The advantage of standardizing
  • U3

    Losing fear of Dreamweaver: building a basic web page

    • Why use Dreamweaver?
    • Work area overview
    • Creation of work folders
    • HTML syntax using tags, attributes and values
    • General structure of a web page
    • Placing text and images
    • Links
  • U4

    Adding style to a web page

    • Linking a CSS file and its Syntax
    • Selectors and values
    • The box model and resetting a style sheet
    • Typographic styles
    • Styles for designing P1 boxes
    • Styles for the design of P2 boxes
    • Applying position, display and floats P1
    • Applying position, display and P2 floats
    • CSS decoration
  • U5

    A responsive site

    • Creating Media Queries
    • Mobile first
    • Making a responsive menu simple P1
    • Making a responsive menu simple P2
    • Using previews
    • Check and correct
  • U6

    Website publishing

    • Defining a remote site from Dreamweaver
    • Uploading the website
    • Synchronize the local site and the remote site
  • FP

    Final Project

    • Introduction to responsive web design with Adobe Dreamweaver

What to expect from a Domestika course

  • Learn at your own pace

    Enjoy learning from home without a set schedule and an easy-to-follow method. You set your own timetable.

  • Learn from the best professionals

    Learn valuable methods and techniques explained by top experts in the creative sector.

  • Meet expert instructors

    Each instructor teaches what they do best, with clear guidelines, true passion, and professional insight in every lesson.

  • Earn a certificate with every course
    New

    Get a personalized certificate signed by your teacher for every course. Share it on your portfolio, social media, or wherever you like.

  • Get front row seats

    Videos of the highest quality, so you don't miss a single detail. With unlimited access, you can watch them as many times as you need to perfect your technique.

  • Share knowledge and ideas

    Ask questions, request feedback, or offer solutions. Share your learning experience with other students in the community who are as passionate as you about creativity.

  • Connect with a global creative community

    The community is home to millions of people from around the world who are curious and passionate about exploring and expressing their creativity.

  • Watch professionally produced courses

    Domestika curates its teacher roster and produces every course in-house to ensure a high-quality online learning experience.


Frequently Asked Questions

  • Domestika's courses are online classes that provide you with the tools and skills you need for completing a specific final project. Every step of the project combines video lessons with complementary instructional material, so you can learn by doing. Domestika's courses also allow you to share your own projects with the instructor and other users, thus creating a dynamic course community.

  • The course is 100% online, so once they are published, courses start and finish whenever you want. You set the pace of the class. You can go back to review what interests you most and skip what you already know, ask questions, answer questions, share your projects, and more.

  • The courses are divided into different units, each one includes lessons, informational texts, tasks and practice exercises to carry out your project step by step, with additional complementary resources and downloads. You will also have access to an exclusive forum where you can interact with the instructor and other students, and share your work and your course project, thus creating a community around the course itself.

  • You can now redeem the course you received, just access redeeming page to enter your gift code and redeem it.

  • You'll get your personal certificate as soon as you complete the course. You can see all your certificates under the Certificates section in your profile. You can download your certificates in PDF and share the link online. Learn more about certificates

Responsive Web Design with Adobe Dreamweaver. A Web, and App Design course by Arturo Servín

Responsive Web Design with Adobe Dreamweaver

A course by Arturo Servín
Web designer. Mexico City, Mexico.
Joined July 2016
  • 97% Positive reviews (136)
  • 2684 students