Implementing Responsive Design Building sites for an anywhere, everywhere web

  • ISBN13:


  • ISBN10:


  • Edition: 1st
  • Format: Paperback
  • Copyright: 2012-07-31
  • Publisher: New Riders
  • View Upgraded Edition
  • Purchase Benefits
  • Free Shipping On Orders Over $35!
    Your order must be $35 or more to qualify for free economy shipping. Bulk sales, PO's, Marketplace items, eBooks and apparel do not qualify for this offer.
  • Get Rewarded for Ordering Your Textbooks! Enroll Now
List Price: $44.99 Save up to $1.80
  • eBook
    Add to Cart


Supplemental Materials

What is included with this book?

  • The eBook copy of this book is not guaranteed to include any supplemental materials. Typically, only the book itself is included. This is true even if the title states it includes any access cards, study guides, lab manuals, CDs, etc.


New devices and platforms emerge daily. Browsers iterate at a remarkable pace. Faced with this volatile landscape we can either struggle for control or we can embrace the inherent flexibility of the web. Responsive design is not just another techniqueit is the beginning of the maturation of a medium and a fundamental shift in the way we think about the web. Implementing Responsive Designis a practical examination of how this fundamental shift affects the way we design and build our sites. Readers will learn how to: Build responsive sites using a combination of fluid layouts, media queries, and fluid media Adopt a responsive workflow from the very start of a project Enhance content for different devices Use feature-detection and server-side enhancement to provide a richer experience

Author Biography

Tim Kadlec is a web developer living in northern Wisconsin. He carefully applies web technologies to meet the needs of clients of all sizes working across diverse industries such as publishing, manufacturing and the financial sector. He is the co-founder of Breaking Development, one of the first conferences dedicated to design and development for mobile devices using web technologies. He also writes about a variety of topics at timkadlec.com.

Table of Contents

The Anywhere, Everywhere Webp. 1
Where we went wrongp. 3
The devices are coming, the devices are comingp. 4
Display sizep. 6
Network speedsp. 6
Standards supportp. 7
Input methodp. 7
Contextp. 8
Separate sitesp. 9
Divergencep. 10
Becoming responsivep. 11
Progressive enhancementp. 14
Why another book on responsive design?p. 16
What's covered?p. 17
Who is this book for?p. 18
Code examplesp. 19
The companion sitep. 19
Fluid Layoutsp. 21
Layout optionsp. 23
Fixed-widthp. 23
Fluid layoutsp. 25
Elastic layoutsp. 26
Hybrid layoutsp. 26
Which approach is the most responsive?p. 27
Sizing fontsp. 28
Pixelsp. 28
Emsp. 29
Percentagesp. 31
Bonus round: remsp. 32
Which approach is the most responsive?p. 33
Converting from pixelsp. 34
Grid layoutsp. 36
Content-outp. 37
Setting the gridp. 38
Mixing fixed and fluid widthsp. 44
Table layouts-the right wayp. 44
Wrapping it upp. 50
Media Queriesp. 53
Viewportsp. 57
A pixel is a pixel, unless it isn'tp. 58
Viewport tag and propertiesp. 59
Media query structurep. 65
Media typesp. 65
Media expressionsp. 67
Logical keywordsp. 67
Rulesp. 72
Embedded versus externalp. 73
Media query orderp. 74
Desktop downp. 74
Mobile upp. 75
Create your core experiencep. 76
Determining breakpointsp. 78
Follow the contentp. 79
Enhancing for larger screensp. 83
Using ems for more flexible media queriesp. 85
Navigationp. 87
Togglingp. 88
Supporting Internet Explorerp. 92
Wrapping it upp. 93
Responsive Mediap. 95
What's the problem?p. 96
Performancep. 97
Selectively serving images to mobilep. 99
JavaScriptp. 100
Introducing matchMediap. 104
Responsive image strategiesp. 105
Fighting the browserp. 105
Resignationp. 106
Going to the serverp. 106
Responsive image optionsp. 106
Sencha.io Srcp. 106
Adaptive Imagesp. 107
Wait, what's the answer here?p. 111
Background imagesp. 111
While we're at itp. 113
High-resolution displaysp. 115
SVGp. 116
Other fixed-width assetsp. 118
Videop. 118
Advertisingp. 122
Wrapping it upp. 125
Planningp. 127
Choosing to be responsivep. 128
Considerationsp. 129
Performancep. 129
Contextp. 130
Content negotiationp. 130
Time investmentp. 130
Supportp. 131
Advertisingp. 132
Conclusionp. 132
Consider your analyticsp. 133
Skewed site analyticsp. 134
Which stats matterp. 135
Skewed market share statisticsp. 139
Consider your contentp. 139
Content auditp. 140
Page tablesp. 143
Consider where you're goingp. 144
Optimized for some, accessible to manyp. 144
Consider the cross-device experiencep. 145
Prepare your test bedp. 147
Actual devicesp. 148
Emulatorsp. 150
Third-party servicesp. 152
Wrapping it upp. 152
Design Workflowp. 153
Your mileage may varyp. 154
An interactive mediump. 155
Collaborationp. 155
Thinking in systemsp. 160
Thinking mobile firstp. 160
Mobile is explodingp. 161
Mobile forces you to focusp. 162
Mobile extends your capabilitiesp. 164
The toolsp. 165
Wireframesp. 165
Mock-upsp. 168
Style guidesp. 173
Wrapping it upp. 178
Responsive Contentp. 179
Starting with the contentp. 180
Content typesp. 181
Purposep. 182
Creationp. 182
Structurep. 182
What content to display, and whenp. 184
Removing contentp. 184
Enhancing contentp. 186
When should content order change?p. 191
Structure, againp. 192
Where we need to gop. 194
Code soupp. 194
Baby stepsp. 195
Building an APIp. 196
Wrapping it upp. 197
Ressp. 199
User agent detectionp. 201
Anatomy of a user agent stringp. 202
What can you do with user agent detection?p. 203
Feature detectionp. 204
Modernizrp. 204
Going to the serverp. 205
Combining user agent detection and feature detectionp. 207
RESS: The best of both worldsp. 208
Troubled watersp. 209
Installing WURFLp. 213
Configurationp. 214
Detecting capabilitiesp. 216
Making callsp. 221
Optimizing for touchp. 223
Wrapping it upp. 226
Responsive Experiencesp. 227
A system of sensorsp. 228
Networkp. 230
What can we do?p. 231
Contextp. 234
Classifying contextp. 236
Observe and researchp. 237
Capabilitiesp. 238
HTML5 input typesp. 238
APIsp. 241
Wrapping it upp. 253
Looking Forwardp. 255
Photo Creditsp. 259
Indexp. 260
About the Technical Editorp. 271
About the Authorp. 271
Table of Contents provided by Ingram. All Rights Reserved.

Rewards Program

Write a Review