Building Responsive Data Visualization for the Web

Building Responsive Data Visualization for the Web

by Bill Hinderman
Released November 2015
Publisher(s): Wiley
ISBN: 9781119067146

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Unchain your data from the desktop with responsive visualizations

Building Responsive Data Visualization for the Web is a handbook for any front-end development team needing a framework for integrating responsive web design into the current workflow. Written by a leading industry expert and design lead at Starbase Go, this book provides a wealth of information and practical guidance from the perspective of a real-world designer. You'll walk through the process of building data visualizations responsively as you learn best practices that build upon responsive web design principles, and get the hands-on practice you need with exercises, examples, and source code provided in every chapter. These strategies are designed to be implemented by teams large and small, with varying skill sets, so you can apply these concepts and skills to your project right away.

Responsive web design is the practice of building a website to suit base browser capability, then adding features that enhance the experience based on the user's device's capabilities. Applying these ideas to data produces visualizations that always look as if they were designed specifically for the device through which they are viewed. This book shows you how to incorporate these principles into your current practices, with highly practical hands-on training.

  • Examine the hard data surrounding responsive design
  • Master best practices with hands-on exercises
  • Learn data-based document manipulation using D3.js
  • Adapt your current strategies to responsive workflows

Data is growing exponentially, and the need to visualize it in any context has become crucial. Traditional visualizations allow important data to become lost when viewed on a small screen, and the web traffic speaks for itself – viewers repeatedly demonstrate their preference for responsive design. If you're ready to create more accessible, take-anywhere visualizations, Building Responsive Data Visualization for the Web is your tailor-made solution.

Table of contents

  1. Part ONE: Creating the Responsive Web
    1. Chapter 01: The Mobile Web
      1. How We Got Here
      2. The Mobile Web Today
      3. Mobile Web Design
      4. Summary
    2. Chapter 02: Responsive Web Design Tenets
      1. The Gist
      2. Adaptive vs. Responsive
      3. Desktop-First vs. Mobile-First
      4. Four Principles
      5. Seven Points of Focus
      6. Summary
    3. Chapter 03: Working with a Flexible Grid
      1. The Gist
      2. Flexible Units
      3. Using a Grid System
      4. Creating a Reusable, Flexible Grid (in Five Easy Steps)
      5. Summary
      6. Try It
    4. Chapter 04: Designing Responsive Layouts with CSS
      1. The Gist
      2. Responsive Layout Design
      3. The Reusable Responsive Grid
      4. Summary
      5. Try It
    5. Chapter 05: Enhancing with JavaScript
      1. Using JavaScript
      2. Responsive JavaScript
      3. Limber Up
      4. Summary
      5. Try It
  2. Part TWO: Creating Responsive Data Visualization
    1. Chapter 06: Data Design: An Abridged History
      1. Learning From Data
      2. The Big Pile
      3. What You Get from the Web
      4. Summary
    2. Chapter 07: Responsive Data Visualization Tenets
      1. Designing Content-First
      2. Revisiting Responsive Design Principles
      3. Seven Points of Focus
      4. Responding to Data
      5. Summary
    3. Chapter 08: Thinking Small
      1. Designing for the Smallest Canvas: No Canvas
      2. The Tiny Canvas
      3. Enhancing Efficiently
      4. Summary
    4. Chapter 09: Asset Dependence
      1. Dynamic Data
      2. Tying Visualization to Screens
      3. Summary
      4. Try It
    5. Chapter 10: Code-Driven Visualization
      1. Unknown Inputs and Outputs
      2. Using D3.js
      3. Building Responsive Data Visualization for the Web
      4. Driving Design with Data
      5. Summary
      6. Try It
    6. Chapter 11: Building the Future-Friendly Web
      1. The Future of Data Design
      2. Embracing Uncertainty
      3. Responsible Web Design
      4. Summary
  3. Part THREE: Additional Resources
    1. Appendix A: Resources
      1. Responsive Data Visualization
      2. Grids
      3. Infographic Design
      4. Responsive Design
      5. D3.js
      6. More Resources Online
  4. Titlepage
  5. Copyright
  6. Credits
  7. Dedication
  8. About the Author
  9. About the Technical Editor
  10. Acknowledgments
  11. End-User License Agreement

Product information

  • Title: Building Responsive Data Visualization for the Web
  • Author(s): Bill Hinderman
  • Release date: November 2015
  • Publisher(s): Wiley
  • ISBN: 9781119067146