Blueprint CSS Tutorials
I’ve been using blueprint CSS for a couple of projects recently. If you haven’t heard of it, blueprint is a “CSS framework” that uses a grid system to align your content, coupled with some great typography and form styles. Even if you don’t plan to use it in a production site, it’s great for making professional looking prototypes in the design phase with very little effort.
Using blueprint can be a little different to your run of the mill CSS. Here are some tutorials that I found useful:
Live Demos
Yes, you’re right, it’s not a tutorial. However, it is by far the easiest way to get started with blueprint if you’re lazy you learn best by example. The main sample page is a nice showcase of the basics. There are a couple of test pages here and here, and lastely there is very useful demo of the form elements.
Quick Start
A good quick start guide can be found on github. It is extremely basic, but I guess that’s why they call it quick start. It covers setting up blueprint, fonts and the most basic of grids. Worth reading if you read nothing else.
More Information
The blueprint page at github has a list of other tutorials if you’re hungry for more information. However, when I last looked most of the links were broken. The only two English one still working are:
http://www.frinity.com/posts/css/design-three-column-css-layout-using-blueprint-framework
http://www.blackrocksoftware.com/blog/quick_blueprint_guide
Enjoy.
