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
  • 98% positive reviews (175)
  • 3554 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
  • 98% positive reviews (175)
  • 3554 students
  • 31 lessons (5h 1m)
  • 39 additional resources (19 files)
  • Online and at your own pace
  • Available on the app
  • Audio: Spanish
  • Spanish, English, Portuguese, German, French, Italian, Polish, Dutch
  • Level: Beginner
  • Unlimited access forever


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.

What will you learn in this online 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 this online course 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.

Requirements and materials

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

3554 Students
175 Reviews
98% Positive ratings

Arturo Servín

A course by Arturo Servín

Teacher Plus
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 .


Content

  • U1

    Introduction

    • Influences
    • Presentation
    • 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

    • Links
    • Placing text and images
    • General structure of a web page
    • HTML syntax using tags, attributes and values
    • Work area overview
    • Creation of work folders
    • Why use Dreamweaver?
  • 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

    • Synchronize the local site and the remote site
    • Uploading the website
    • Defining a remote site from Dreamweaver
  • 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 with an easy-to-follow method. You set your own pace.

  • Learn from the best professionals

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

  • Meet expert teachers

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

  • Certificates
    Plus

    If you're a Plus or PRO member, get a custom 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 about creativity as you are.

  • 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.


FAQs

Domestika's courses are online classes that provide you with the tools and skills you need to complete a specific 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 teacher and with other students, creating a dynamic course community.

All courses are 100% online, so once they're 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 text, tasks, and practice exercises to help you carry out your project step by step, with additional complementary resources and downloads. You'll also have access to an exclusive forum where you can interact with the teacher and with other students, as well as share your work and your course project, creating a community around the course.

You can redeem the course you received by accessing the redeeming page and entering your gift code.

If you're a Plus or PRO member, when you complete a course you'll instantly get your personalized certificate. You can see all your certificates in the Certificates section of your profile. You can download your certificates as PDFs and share the link online. Learn more about certificates
Responsive Web Design with Adobe Dreamweaver. 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
  • 98% positive reviews (175)
  • 3554 students