Flexible Web Design
Creating Liquid and Elastic Layouts with CSS
Learn how to design and build attractive web sites that maximize usability and accessibility, adapt to changing amounts of content, and hold up under a variety of user preferences.
Liquid or fluid layouts change width based on the user’s unique device viewing size. Elastic layouts change width based on the user’s unique text size. Both types of flexible design offer clear benefits to users, who can view sites at sizes that work for their needs, but they can pose challenges to web designers who are used to perfect pixel control. Still, when planned and constructed correctly, flexible layouts can be visually appealing and reasonably easy to build. And the concepts and techniques of flexible web design can benefit fixed-width CSS designs too, as designers learn how to design for the inherent flexibility of the web, instead of the rigid qualities of print media or grid-based layouts.
Using standards-compliant and cross-browser compatible (X)HTML and CSS, in Flexible Web Design: Creating Liquid and Elastic Layouts with CSS, designers will learn:
- The benefits of flexible layouts
- When to choose a liquid, elastic, or hybrid design
- How to design and slice graphic comps in a way that makes flexible design achievable
- How to build liquid and elastic layouts from scratch
- How to create flexible background graphics and scalable content images
- When and how to limit the degree of flexibility in a web page
Who should read this book?
Flexible Web Design is meant for professional web designers who already have experience creating web sites from scratch but want to improve their CSS layout skills. Even if you intend to continue designing fixed-width sites primarily, you'll learn how to design your comps and build your pages in a way that makes them more adaptable to the user-controlled nature of the web.
This book will be especially helpful to former print designers or web designers used to table-based layout who still struggle to produce pure CSS layouts. It will teach you how to think in the CSS mindset so that designing for CSS becomes natural and you no longer find yourself fighting against inappropriate comps when it comes time to actually build the pages.