Responsive Mobile Design: Designing for Every Device

Create Web Designs That Work Perfectly on Any Device—Simply and Beautifully!

Billions of people access the web via smartphones, tablets, and devices of all types, using every imaginable interface and display. But they all want the same thing: the right information, right now, delivered in the most aesthetically pleasing way possible. Give them what they want with Responsive Mobile Design .

Whether you’re a developer, designer, or manager, Phil Dutson teaches you principles, techniques, and best practices for delivering a successful experience to all users on all devices.

Dutson shows how to design sites that are responsive “from the start,” while keeping development simple and flexible. Next, he delivers complete technical know-how for transforming responsive designs into responsive sites. You’ll find coverage of key issues such as integrating media content, optimizing performance, and serving Retina or high-density displays.

Throughout, he combines detailed and practical explanations with functional, easy-to-reuse code snippets.

Coverage includes

• Demonstrating why “mobile first” is still a best practice
• Fusing content, structure, and beauty to deliver experiences users love
• Using responsive images to improve speed and convey visual messages more effectively
• Using grid systems without making it feel like your design is “locked in a box”
• Mastering measurement values such as px, em, rem, and viewport units—and understanding their crucial differences
• Improving the finer details of your design with web fonts
• Retrofitting current websites to prepare them for the future
• Introducing web components into your HTML markup
• Using built-in browser development tools to streamline debugging and “in-browser” prototyping

Table of Contents

Part I Creating a Responsive Layout
Chapter 1 Content Matters
Chapter 2 Why Mobile First
Chapter 3 Working with Grids
Chapter 4 Displaying Tabular Data
Chapter 5 Working with Measurement Values
Chapter 6 Using Media Queries
Chapter 7 Typography
Chapter 8 Retrofitting an Existing Site

Part II Working with Responsive Media

Chapter 9 Responsive Images
Chapter 10 Responsive Video
Chapter 11 Image Compression

Part III Enhancing Performance
Chapter 12 Conditional JavaScript
Chapter 13 Web Components
Chapter 14 Device Detection and Server Requests
Chapter 15 Server Optimization
Chapter 16 High Performance with Development Tools