Tag: layout
-
Examples of flexible layouts with CSS3 media queries
Media queries let you to feed different CSS to users based on their viewport size (among other things), allowing you to create even more flexible layouts than ever before. See visual examples of real sites that use CSS3 media queries to make the layout more adaptable to the variety of screen sizes and devices in use today.
-
Deal-breaker problems with CSS3 multi-columns
Firefox and Webkit support some of the CSS3 multi-column layout properties—but not very well. Unfortunately, the spec isn’t very clear about what’s correct. Until the spec is clearer and the browser problems are ironed out, multi-columns are useless to me.
-
The liquid web site motherload
Check out Nomensa’s portfolio for great examples of liquid site designs.
-
Why browser zoom shouldn’t kill flexible layouts
All the major browsers now have zoom functions built in, which may make it seem like there’s no longer any need for liquid or elastic layouts. Not so.
-
Voices That Matter: Web Design Conference 2009
Download the slides from my presentation at Voices That Matter: Web Design Conference 2009, as well as get links to related tutorials on designing flexible images.
-
Updated flexible design inspiration
I’ve updated my original post on sites to explore for flexible web design inspiration.
-
Living, breathing design comps
Presenting static image comps to clients can be especially problematic if you create flexible layouts. Try building an (X)HTML/CSS version of the design to show to your client instead in order to make designing and creating flexible layouts easier.
-
Revised presentation slides available
Download the slides from my presentation Designing CSS Layouts for the Flexible Web at the National Association of Government Webmasters 2008 Annual Conference.
-
Voices That Matter slides available
Download the slides from my presentation Designing CSS Layouts for the Flexible Web at the Voices That Matter Web Design Conference.
-
Inspiration for flexible web design
Liquid and elastic web sites don’t have to be ugly or boring. There are plenty of beautiful examples of flexible design to inspire you.
Stunning CSS3: A Project-based Guide to the Latest in CSS
Flexible Web Design: Creating Liquid and Elastic Layouts with CSS