Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

LinkedIn Learning

Responsive Design with Dreamweaver CS6

via LinkedIn Learning

Overview

Learn how to use media queries and the Fluid Grid Layout feature in Dreamweaver to create a website that delivers different layouts to desktops, tablets, and other mobile devices.

This course illustrates two approaches to responsive web design, the new Fluid Grid Layout feature and media queries, which allow a wide spectrum of designers to reach their target audience via desktops, tablets, or other mobile devices. Author Joseph Lowery shows how to use the Fluid Grid Layout feature in Dreamweaver to create a single web site that delivers different layouts to targeted screen sizes. The course also offers a more advanced approach to responsive design by using media queries—employing the Multiscreen Preview feature and enhancing the resulting output code—as well as methods for handling mobile first priorities and adaptive images.

Syllabus

Introduction
  • Welcome
  • About the exercise files
1. Understanding Responsive Web Design
  • The foundation of responsive web design
  • Structuring fluid grids
  • Understanding media queries
2. Fluid Grid Layouts in Dreamweaver
  • Exploring the default Fluid Grid Layout
  • Adding building block div tags
  • Inserting content
  • Targeting a phone design
  • Balancing tablet layouts
3. Expanding on a Fluid Grid Structure
  • Modifying the number of grid columns
  • Adjusting column widths and margins
  • Including advanced page elements
4. Enhanced Media Queries
  • Building media queries from the ground up
  • Working with additional media queries
  • Handling orientation changes
  • Working with high-resolution displays
5. Flexible Images and Media
  • Core CSS manipulation
  • Applying JavaScript techniques
  • Setting up server-side solutions
Goodbye
  • Next steps

Taught by

Joseph Lowery

Reviews

Start your review of Responsive Design with Dreamweaver CS6

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.