Books & Videos

Table of Contents

Chapter: Getting Started with Responsive Web Design

Exploring Responsive Web Design (RWD)

01m 57s

Understanding the Use of RWD

02m 11s

Examples of Adaptive Layouts

01m 57s

Device Breakpoints

02m 41s

Pros/Cons of RWD

02m 18s

Course Overview

01m 15s

Chapter: Building a Fluid Layout

Fluid Width Layouts

02m 3s

Working with Percent Width Layouts

02m 15s

Examples of Fluid Layouts

01m 22s

Chapter: Media Queries

Media Queries

02m 22s

Media Query Code

01m 40s

Testing a Simple Media Query

02m 2s

Best Practices for Media Queries

02m 50s

Testing Media Queries on Actual Mobile Devices

01m 59s

Chapter: Building Our First Responsive Page

Using RWD Demo Files

02m 15s

Using Sample Files

01m 56s

Chapter: HTML5 Structure for Our Site

Overview of the HTML Structure for the Demo Site

01m 29s

CSS Resets and HTML5

04m 31s

HTML for Container, Header, and Navigation

04m 51s

HTML for a four Column Content Area

02m 16s

HTML for a two Column Footer

01m 49s

Chapter: CSS for Our Site

Using Demo CSS for our Site

02m 42s

Writing the CSS for the Navigation Bar and Logo

03m 24s

Building the CSS for Navigation and its Elements

03m 15s

Tweaking the Navigation Using the Inspect Element

02m 37s

Formatting the Header

02m 9s

Styling the Columns

02m 49s

Formatting Headings and Images in the Columns

03m 16s

Formatting the Footer

03m 50s

Tweaks and Fixes to the Body Layout

03m 0s

Chapter: Adding Media Queries to Our Fluid Layout

Planning for Media Queries

02m 37s

Tablet Media Query for the Body

02m 32s

Using Media Query for the Navigation Bar and Logo

03m 18s

Using Media Query for the Navigation Bar and Logo for Devices Smaller Than the Tablet

02m 43s

Using Media Query for Columns to Reorient Horizontally

01m 55s

More on Column Queries and Footer

02m 30s

Final Tweaks for Phone-Sized Devices

02m 42s

Chapter: Advanced Features/Considerations for the Future

Advanced Features/Considerations

02m 4s

Dealing with Font Size EMs

03m 10s

Using Percent-Based Fonts and Dealing with Problems with EMs and Percent

02m 6s

Demo of EM and Percent-Based Font Sizes

02m 10s

Solution to Issues with REMs

03m 12s

Future Considerations: VM, VH, VMAX, and VMIN

03m 9s

Current Solutions to Text Size Issues and Responsive Background Images

02m 58s

Using Background Images, Adaptive Images, and Bandwidth

03m 13s

Responsive Grids

04m 55s

CSS Pre-processors

04m 17s