Do you have problems in coding your own design? Does it have to do with styling and CSS? Do you want to speed things up and not make a mess of it? If you too have the previous questions and problems, Nathan Smith has created a system known as the 960 Grid System to answer your questions.
The 960 Grid System is a CSS grid system for rapid prototyping and development of websites. In easy and brief terms, the 960 Grid System helps ease up the coding process, minimizing errors and maximizing efficiency. The grid system is a mechanism that breaks up the work into shorter pieces so accuracy is achieved.
In this hybrid article, we’ll dive into the 960 grid system with a quick overview, then we’ll give you some great tutorials and finally some inspiration to get you started.
What is 960gs?
The 960 Grid System is an effort to streamline web development workflow by providing commonly used dimensions, based on a width of 960 pixels. There are two variants: 12 and 16 columns, which can be used separately or in tandem.
This system works for almost any browser and any OS. If any problems do come they are easy to fix out. It is free to use and these days with its increasing popularity one can easily find tutorials on using this incredible framework.
One drawback could be that it can only work for layouts with a 960px width. So if one has a different layout choosing this framework could be tedious.
If you are on the hunt for resources regarding on how to design your site according to this framework, this .zip file file will help you. Also, if you are concerned if developers using this framework have not so good looking sites that the 960 grid system website has a few mind blowing examples one could refer to before using this framework, and we’ve included a few of the inspirational sites below.
If you are having any problems or confusions on what framework to choose, Raj Dash has written a good and detailed article at Net.tutsplus to remove such confusions, titled “Which CSS Grid Framework Should You Use for Web Design?”
Tutorials and Resources for using 960gs
960 CSS Framework: Learn the Basics:
960 CSS Framework: Learn the Basics
Advertisement
Prototyping with the 960 Grid CSS Framework
Build a Newspaper Website with a Grid (NETTUTS Plus Tutorial)
Build a Newspaper Website with a Grid (NETTUTS Plus Tutorial)
Design a Fresh Blog Website Based on the 960 Grid System:
Design a Fresh Blog Website Based on the 960 Grid System
Introduction Design Tutorial for 960 GS:
Introduction Design Tutorial for the 960 GS
Build a WordPress Theme with the 960 GS:
Build a WordPress Theme with the 960 GS
Inspirational Websites using 960gs
WooThemes
Nuvo Graphics
OneHub
Phil Coffman
Pulse App
Black Estate Vineyard
Right From The Heart
Travis Isaacs
“There are two variants: 12 and 16 columns” Actually there’s a 24 column layout too; even included with Nathan Smith’s templates.
Some nice examples, however it does illustrate the repetitiveness if used too strictly. The grid layout is a good guide, but some stick far too much to it without using their own judgement.
n
Is this open source, freeware, payware? thx for sharing
It’s free. :)
What stupid question.
Did you read the article at least?
twat.