With the advent of responsive techniques, design patterns and off-the-shelf components, responsive Web design has become more than a technique — but rather a new mindset that requires us all to rethink and extend our practices. Responsive design is also about performance, server-side components, content strategy and conditional loading.
With this eBook, you will learn how to go from non-responsive layouts to optimized responsive mobile experiences. We're happy to present techniques to help you overcome outdated practices and set new defaults in your workflow — a new responsive design workflow.
TABLE OF CONTENTS
- How Much Has The Web Really Changed?
- Looking Beyond Common Media Query Breakpoints
- Logical Breakpoints For Your Responsive Design
- Preparing Websites For The Unexpected
- How To Maintain Hierarchy Through Content Choreography
- Towards A Retina Web
- Building A Better Responsive Website
- How To Make Your Websites Faster On Mobile Devices
- Formats: PDF, EPUB, Kindle (DRM-free)
- Pages: 116
- Language: English
- Released: May 2013
- Publisher: Smashing Media GmbH
- ISBN (PDF): 978-3-94454019-1
- ISBN (EPUB): 978-3-94454020-7
- ISBN (KINDLE): 978-3-94454021-4
Excerpt From Chapter 1
How Much Has The Web Really Changed? — by
Responsive design is about more than just layout; it’s about designing for the Web, which means, mostly, for people with browsers. And that’s just about everything we know about the people who visit our websites: they are probably using a browser. All the rest we just don’t know.
Up until not so long ago, we used to base our designs on some rather general assumptions about screen size and input type. With the rise of devices with various screen sizes and alternative ways to interact, these assumptions have turned out to be unreliable. We need to upgrade the defaults that we use when we start designing our websites.
Excerpt From Chapter 3
Logical Breakpoints For Your Responsive Design — by
There are several tactics for deciding where to put breakpoints in a responsive design. There is the rusty idea that they should be based on common screen sizes, but this doesn’t scale well. There are no “common” screen sizes. Another popular tactic is to create a breakpoint wherever the layout breaks.
This sounds much better. But it still leaves us with the question, How do you determine whether the layout is broken? One logical answer is to look at classic readability theory and to define our breakpoints based on that.