Review: Free mobile-friendly Web design frameworks

Twitter Bootstrap, HTML5 Boilerplate, 52Framework, and 320 and Up take the sting out of building websites for both large and small screens

Page 6 of 7

Less Framework, Frameless, and Golden Grid
If frameworks as lean as Boilerplate or 52Framework still strike you as overkill, you'll be happy to know even more minimal options exist. The appropriately named Less Framework (MIT License) is a good place to start.

Less uses four basic layouts -- default/desktop, tablet, mobile, and wide mobile -- to adapt your content to a series of 68-pixel columns. The designer creates his content for the original wide layout, then uses CSS to define the smaller child layouts. Graceful degradation for older browsers, especially IE, is built in.

That's all there is to Less, apart from a couple of custom optimizations, such as a media query for Retina display devices. In the creator's own words, it "does not contain any pre-defined column classes, pre-compilers, or other wizardry. The point of it is to let everyone keep writing HTML and CSS as they always have, because everyone does it differently."

Less Framework's four basic layout modes use 68-pixel columns to adapt and reflow content.
Less Framework's four basic layout modes use 68-pixel columns to adapt and reflow content.

A "spiritual successor" to Less Framework is Frameless, exemplied by its motto: "Adapt column by column, not pixel by pixel." Frameless (public domain) uses a fixed-width grid and adapts the content to fit into as many fixed-width columns as are visible in the browser. It, too, provides nothing more than the layout system and a few other pieces for getting a template up and running. You bring the rest.

Frameless.gif
Frameless uses a fixed-width grid with as many columns as can be fit into the display port.
| 1 2 3 4 5 6 7 Page 6
From CIO: 8 Free Online Courses to Grow Your Tech Skills
View Comments
Join the discussion
Be the first to comment on this article. Our Commenting Policies