Flexible Layouts for web

The web has allowed content to be accessed globally by millions of viewers on thousands of different screens. Each screen has its own dimensions, colour profile and supported typefaces. This has lead to the creation of fluid layouts - layouts that are designed with the intention of having the text spill over columns and pages, and be able to cope with the changes and still look appealing and most importantly, still be easy for the user to follow.

The link here: http://www.maxdesign.com.au/articles/liquid/liquid-sample1/ presents a simple set of boxes that could accommodate text, you can see that when the size of the browser window is changed, the content expands and contracts, leaving margins intact. This requires the designer to set dimensions of columns as a percentage rather than a strict width.

With the introduction of CSS3 on the web, layout has become more flexible than ever. This page ( http://richardshepherd.com/smashing/css-flexbox/ ) is a demo page that demonstrates a layout that can be reshaped without breaking, maintaining a legible design.

In contrast this website - http://milkrow.com/letterpressclasses.html does not include any measures to salvage it's content on resolutions other than the resolution the designer had originally designed it on. As the window size is constricted, the content is simply truncated, and the user is forced to scroll. The effect in a far less intuitive and professional feeling design for forces the user to adapt to the website's broken layout.