James Williamson – Applied Responsive Design

Applied Responsive Design

By: James Williamson

Released: Mar 07, 2013

Level: Intermediate

Duration: 5h 58m

Description

Following the concepts introduced in Responsive Design Fundamentals, senior author James Williamson demonstrates the practical applications of responsive design and shows how to enrich the appearance and behavior of your website across multiple devices. First, discover how to plan your design and take advantage of CSS media queries to create multiple layouts. Then make your site navigation respond to changing screen sizes with CSS and jQuery, and display media like images and video fluidly. Plus, discover how to take advantage of mobile capabilities like touch events and HTML5 forms to enhance the experience of mobile visitors. James also shows how to effectively manage resources and optimize the performance of your site.

Topics include

Contents

Introduction 6m 42s

• Welcome 1m 6s
• Using the exercise files 1m 59s
• Exploring the finished project 3m 37s

1. Planning Responsive Designs 47m 3s

• Content planning 11m 21s
• Creating mockups 10m 38s
• Planning responsive UX 7m 24s
• Structuring page regions 6m 46s
• Structuring content for multiple devices 10m 54s

2. Building Responsive Layouts 1h 18m

• Controlling the viewport 4m 59s
• Defining default styles 11m 18s
• Determining content breakpoints 6m 49s
• Defining media queries 7m 41s
• Building the basic desktop layout 8m 5s
• Building the basic tablet layout 6m 30s
• Building the basic mobile layout 5m 3s
• Refining desktop layouts 10m 25s
• Refining tablet layouts 10m 6s
• Refining mobile layouts 7m 49s

3. Responsive Navigation 2h 0m

• Defining a responsive navigation strategy 5m 43s
• Structuring basic menus 7m 7s
• Styling basic menus 10m 29s
• Using CSS sprites in menus 7m 53s
• Structuring complex menus 9m 42s
• Using jQuery for menu behavior 9m 34s
• Responding to changes in screen size 4m 41s
• Minimizing menus for small screens 9m 31s
• Expanding submenus through touch 5m 42s
• Replacing hover styling with touch 12m 3s
• Resetting menus for large screens 7m 17s
• Preventing conflicts 5m 28s
• Providing fallbacks 5m 5s
• Dynamically replacing menus 5m 39s
• Converting menus to select elements 9m 3s
• Converting select elements to menus 5m 27s

4. Creating Responsive Media 56m 59s

• Creating fluid images 11m 10s
• Making video fluid 6m 47s
• Using CSS in place of images 9m 52s
• Image gallery overview 3m 8s
• Structuring a responsive image gallery 4m 47s
• Controlling gallery styling 11m 43s
• Adding image gallery functionality 9m 32s

5. Enhancing Sites for Mobile 16m 24s

• HTML5 form inputs 4m 30s
• Adding phone functionality 6m 16s
• Adding home screen icons 5m 38s

6. Managing Resources 28m 20s

• Modernizr and Respond.js overview 5m 32s
• Loading resources with Modernizr 10m 10s
• Conditional resource loading 8m 56s
• Testing responsive sites 3m 42s
• Conclusion 4m 10s
• Additional resources 4m 10s

About Author

James Williamson is a senior author for lynda.com and an Adobe Certified Instructor. He has many years of web, print, and digital video experience, and has been a featured speaker at Flashforward as well as a regular speaker at Adobe MAX. James also blogs (infrequently) about all things web at his site, Simple Primate, which can be found at www.simpleprimate.com.

Get Download James Williamson – Applied Responsive Design at Coursenity.com right now!

Delivery Method

– After your purchase, you’ll see a View your orders link which goes to the Downloads page. Here, you can download all the files associated with your order.
– Downloads are available once your payment is confirmed, we’ll also send you a download notification email separate from any transaction notification emails you receive from Coursenity.com.
– Since it is a digital copy, our suggestion is to download and save it to your hard drive. In case the link is broken for any reason, please contact us and we will resend the new download link.
– If you cannot find the download link, please don’t worry about that. We will update and notify you as soon as possible at 8:00 AM – 8:00 PM (UTC+8).

Thank You For Shopping With Us!