The 960 Grid System was primarily developed for rapid prototyping, cutting down on repetitive and tedious tasks but it is also more than suited to be used for any web design project. In this post, you will probably find the tutorials, a showcase of sites designed using the 960 Grid System.

960 Grid System Tutorials
Learn the Basics
This is the most basic tutorial to get you started with 960 Css framework. You are taken through the basics of loading the framework, so you can start developing a simple webpage with 960 Grid System in the fast way.

Working with 960 Grid System
This tutorials that takes you through the basics of installing the 960 Grid System.

Detailed Look at the 960 Css Framework
This is the opportunity to spend some time with 960 Grid System, you will be amazed at how much time can saved when you are developing your web projects using the 960 Grid System.

Design and Aesthetic Benefits
It is regardless of whether you use css grids for prototyping or production systems, there are multiple aesthetic and design benefits.
1. Visual design cohesion between page elements.
2. Uniformity and consistency in HTML element placement, thereby reducing Css coding errors.
3. Easier to apply the “rule of thirds” and the “golden section” to design, which results in a visually appealing layout to most human eyes.
4. Mostly eliminates the need to use nested HTML tables.
5. Nested sub-grids for very complex designs that are relatively simple to produce.
6. Easier to apply images and text calla outs to produce asymmetric layout for visual texture.
7. Cross-browser support, so less screaming and hair pulling when you get around to testing for that bane of designers.
8. Reduced effort for producing slicker web page layouts, compared to coding the necessary Css from scratch.
9. Reduced future effort if you need to reposition elements or change rendering characteristics for related elements.
10. Unable with static page and CMSes/ blog platforms.
11. Enables the popular use of creating “magazine” and premium themes for blog platforms.

Fluid 960 Grid System
An example of the 960 Grid System. It has built with a library of commonly used HTML elements, combining these with Css for typography and layout, and adding some basic effects from popular Javascript libraries. For example, there are three templates, which are 960 pixels width, 12 column fluid width or 16 column fluid width.

Enjoy using this Css framework for your web development.

What is the Blueprint?
It is a Css framework that designed to cut down the development time and ensure the cross-browser compatibility when working with the Cascading Style Sheets (Css). It serves as a foundation for many tools designed to make Css development easier and more accessible even for the beginners to start a new project.

Blueprint gives you a solid foundation to build your project with an friendly grid, sensible typography, useful plug-ins and also a style-sheet for printing.

What does Blueprint offering?
1. A Css reset that eliminates the discrepancies across browsers.
2. A solid grid that can support the most complex of layouts.
3. Typography based on expert principles that predate the web.
4. A typographic baseline.
5. From styles for great looking user interfaces.
6. Print styles for making any webpage ready for paper.
7. Plug-ins for buttons, tabs and sprites.
8. Tools, editors and templates for every step in your work flow.
9. Power scripts for customization.
10. Absolutely no bloat.

Blueprint has its grid-building tools, however the grid is fully customizable. If you want to customize the columns and rows with other standard of width and height, you may use the Blueprint grid Css generator tool. It provides a replacement grids.css file, but it also creates a grid.png image file for use as background image during development.

Best practices
When using Blueprint, it is important to read all of the included Css and understand what everything does and how it works before you dive in deeply. Do not miss out some important elements like the .border, .colborder, .box, and .hide classes. Do not ever edit Blueprint’ s files, and it is good practice to include your own style sheets and override Blueprint because editing Blueprint’s Css files will make upgrading to the latest version of the framework more difficult. Keep your work separate from the Blueprint framework. Everyone is free to download the Blueprint, Css framework to have a try and enjoy the benefits.