Thanks for watching Responsive Design with Dreamweaver CS6.…I sincerely appreciate you taking the course.…If you're just starting out with Dreamweaver CS6, check out Dreamweaver CS6…Essential Training, or if you'd like more info on how to use Dreamweaver to…create great layouts, see my own Layouts with CSS and Dreamweaver, both here on…the lynda.com online training library. Have a great day!…
Resume Transcript Auto-Scroll
Author
Joseph Lowery
Released
8/21/2012
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.
Topics include:
- Exploring the default Fluid Grid Layout
- Adding building block div tags
- Inserting content into a fluid grid
- Modifying the number of grid columns
- Adjusting column widths and margins
- Building media queries from scratch
- Handling orientation changes
- Applying JavaScript techniques
- Setting up server-side solutions
Skill Level Intermediate
2h 6m
Duration
97,325
Views
Show More
Show Less
-
Introduction
-
Welcome56s
-
About the exercise files1m 19s
-
-
1. Understanding Responsive Web Design
-
Structuring fluid grids3m 38s
-
Understanding media queries4m 26s
-
2. Fluid Grid Layouts in Dreamweaver
-
Inserting content8m 11s
-
Targeting a phone design5m 28s
-
Balancing tablet layouts9m 35s
-
3. Expanding on a Fluid Grid Structure
-
4. Enhanced Media Queries
-
Handling orientation changes2m 23s
-
5. Flexible Images and Media
-
Core CSS manipulation6m 59s
-
-
Goodbye
-
Next steps25s
-
Show MoreShow Less
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.
Share this video
Embed this video
Video: Next steps