Grid Frameworks Are Not An Alternative To Knowing CSSGrid frameworks give you a shortcut to laying things on the screen. You don’t have to specify dimensions or percentage widths for the page to lay things on the screen, you can just use the following code, including the grid framework css using a link tag and start seeing things fall in place. [html] <div class="row"> <div class="span2">some content goes here</span> <div class="span4">some other content goes here</span> </span> [/html] In other words, grids are being used as glorified tables. I have run into a lot of people who say laying things out using a table is an awful despicable practice but these people won’t flinch before using the new awesome shiny spanking grid framework to layout a non-grid visual design. Problems with grid frameworks:
- they are the same thing as tables. They mix layout information with presentation mark-up.
- they don’t describe the content that it encloses.
- they are often misunderstood as the tool
What are grid layouts?Grid layout is a visual design paradigm where the elements on a page are laid out vertically and horizontally to make it easy on the eyes to scan the content. They have nothing to do with “cross-browser uniformity”. No I don’t mean that grid layouts are reserved for those designs where the elements line up vertically. I am saying that, in keeping with front-end engineering best practices, you should be implementing that design in XHTML/CSS using proper naming of the class and id names that describe the content anyway. Don’t ever use grid frameworks. They are not to be used. Unless you WANT an alternative to typing css, if you find that using grid layout makes your life easy when trying to quickly code up the application’s UI then go right ahead. Just know that you are using a shortcut and not implementing a grid design. (Which is okay. What are we as hackers if we can’t reuse tools for ways other than intended?)
Published: January 26, 2013