Contents
Chapter 1: Introduction to Responsive Design
Responsive Design vs. Device-Specific Experiences
Responsive Web Design Is Not Limited Just to Mobile
When Would You Not Use Responsive Web Design?
Examples of Responsive Web Design
Chapter 2: Testing a Responsive Site
Testing Responsive Design in the Browser
Browser Specific Testing Features
Debugging Web Sites on Devices
Chapter 3: The Power of Media Queries
An Introduction to Media Queries
Mobile First vs. Desktop First
Looking at Building a Site Mobile First
Targeting High Pixel Density Displays
Chapter 4: Using Fluid Layouts
Why Use Fluid Layouts for Responsive Design
Principles When Working with a Fluid Design
Do Not Necessitate Horizontal Scroll Bars
Think About How Your Images Look at Different Sizes
Think About the Length of Your Lines of Text
Building a Fluid Design Using a CSS Grid
Chapter 5: Frameworks in Responsive Design
Choosing Neither a Grid Nor a Framework
Prototyping a Site Using a CSS Framework
Chapter 6: Adapt an Existing Site
Adapt Existing Styles and Scripts
Refactoring the Existing Styles
Targeting the Different Breakpoints
Different Preprocessors Available
Problems of Using CSS Preprocessors
Chapter 8: Making the User Journey Responsive
Features that the Device Supports
User Testing Your Responsive Site
Chapter 9: JavaScript Across Responsive States
Different Functionality Across Responsive States
Techniques for Changing Functionality
Using Feature Detection for Advanced States
Implementing Responsive JavaScript Techniques
Chapter 10: Optimizing Your Responsive Site
Why You Should Care About Site Performance
Improving the Critical Rendering Path
Implementing Server-Side Optimization
Benefits of Server-Side Optimization
Disadvantages of Server-Side Optimization
Third-Party Server-Side Solutions