nice one!

http://www.quickurl.biz

You said it J : You didn’t create it. There’s something to be said for code being 100% our own.

Custom made is always the best way to go.
Cheers!

Great video Jeffrey. I thought the same about CSS Frameworks as you did, until I too checked out the 960 Framework myself.

I’ve only started using the 12-column grid with a recent design I’ve been working on, and it makes designing so much easier. I love having guidelines to work with, and I know when I go to code it, it’s going to be so much easier.

Thanks!

@Andy – I agree. You can always modify the 960 framework to make it your own.

But at the same time – I didn’t create jQuery and I use it nearly on every project.

I have been using 960 or awhile now, and really like it. Its simple, easy to use, and lets you spend more time on things other than floats. While its not 100% “your own,” I don’t know of any project where I haven’t used other technology, inspiration, tutorials or the like to complete a project. 960 is not the end all be all to use on every project, but it’s a good tool to have in your back pocket.

Great screencast Jeffrey!

I’m one of those “slightly ignorant” commenters who slammed this CSS-framework initiative to begin with, but now I can see the appeal! I strongly agree you on the fact that people shouldn’t use a framework if they haven’t yet spent a decent amount of time with the ‘real’ language, whether it’s CSS, JavaScript, PHP etc.

ps. Where’d you get that fake Apple dock thing?

@James – Yeah I know you’re against it; I was too for the exact same reason.

Like I said, it’s not right for every application…but it’s definitely worth a deeper look.

–

Do a google search for “Rocket dock”. It works very well.

Thank you for the tutorial. I was too lazy to read on my own but watched screencast while installing VS SP1.

Thank you again!

Good to see my article linked again

another great info
Thx

Great perspective and screencast. You convinced me to give it a try! I end up spending way too much time making similar styles, why not save some time.

Great tut Jeffrey.

I share your opinion of CSS frameworks, although I prefer the the flexibility over Blueprint over the non-bloatedness of 960.

Sweet Screencast! I look forward to using this in some future projects.

Well done.

I will give it a try. Also, I keep forgetting to use google’s API for jquery, and end up always including it myself.

Great screencast, and well done… just one more thing…

The Dock on a Mac works better because… oh, right… its on a Mac.

This is going to go great with a .psd template I recently purchased from Themeforest.

I read the readme and the designer based his design around the 12 col 960 system.

So i went and d/l and was a little confused, hopefully when i get out of class and have some time i’ll be able to watch the vid tut. =}

always a pleasure reading your tutorials Jeff.

I’m one of those who you mentioned first (css frameworks are useless). But watching your video makes me thinking seriously to give a try to one of these frameworks…

960 is an awesome framework. I used it once and i cant stop using it in my projects.

I’ll admit I was definitely one of those people who didn’t see any merit in a CSS framework, but after watching this screen cast I can appreciate the idea a whole lot more.

Thanks for the motivation to try it out!

Cool! I like it! I will try it on my next project!

thank you for the video

i would have ignored it like all the other framework tuts if it wasn’t for the video.

definitely going to start using this!

Maybe I’ll further have to invest in this. It would really help keep things in a grid format…

I knew most of this stuff but watched it anyway to make myself feel better, besides its comforting, like watching the wonder years with the Daniel Stern’esque voice

@ajpalma – Thank you for saying that. I know exactly what you mean.

I adore “The Wonder Years”.

Great article. 960 is much easier to use than the other css framework such as blueprint css

I love this screencast, I will definitely try 960 on my projects.

Greeaat! I like Frameworks like jquery, but i never tried a css framework
(i like to do my own things with the code) but i will watch this screencast when i am home from work, 7 hours 45 minutes to go

Lets see if your knowledge about this framework can make me luuv it like jquery !

(btw, we need more PHP tutorials =D )

Great tutorial! This is a great introduction to 960 for webdesigners that did not know about the framework already.

Just a comment on the order of the stylesheets. Because they are cascading, I think it makes more sense to change the order to this:
- reset
- 960
- text
- default

What do you guys think?

Very nice screencast Jeff. I used Blueprint for a while but eventually switched permanently to 960. One of the things I love is the simplicity and intuitiveness of the framework.

I must admit that sometimes I get confused between a prefix and a suffix when using Blueprint. hahaha.

Thank you for this.

960’s a great rapid framework. We use it often with much pleasure!

Love the new intro!

This Screencast is good . 960.gs is good but i like Blueprint more

As i think we can save more time and rewriting process with Blueprint.

because it has many Plugins, Typography styles, Form Styles and use of em for font-size(for better accessibility).

960 uses px for font size

I want to see Blueprint screencast like this

@Jeff

JQuery isn’t as accessible as a CSS framework for a designer or developer. Cheers!

A nice framework you. I will use it for my personal projects, thanks.

@Jeffrey: Welcome to CSS Fans club.

Yes it’s tue CSS Frameworks can be time savers and CSS Frameworks are not for noobs.
I build 6 CSS layouts with Emastic(http://code.google.com/p/emastic/) in 1 hour.

I’ve been using 960 for a little while now and I think its a great library. I’ll admit that it’s not perfect for every project, but it is easy-to-use and makes for quick prototyping.

For the folks who don’t want to use it because it’s not 100% their own, I can understand the argument, but at the same time – if there was a tool to make life easier and it was appropriate for the project, why not use it? Its like building a table but not wanting to use a saw to cut the wood because you didn’t create the saw.

I would like to say though that just because the 960 library exists, it is not an excuse for not knowing how to layout a website with css.

Interesting tutorial – I had always dismissed the ‘framework’ as being a little half-baked. I’m not going to rush and use it, but I’ll consider it in the future.

I’ve used the 960 framework in the past and it works very well – especially when you need to quickly implement things and you don’t have time to sit down and handcode the framework yourself. While I do prefer to do it custom, I have no problem if I or anyone else uses a CSS framework. I think there is nothing wrong with that.

I’d like to see a BluePrint tutorial as well, would be great to compare these two web design tools….

Nice tutorial. You should also make one for CSS Beginners….
Really looking forward to learning CSS !

I’m yet to try out these CSS frame works.. will deffinatley be having a go on my next project..

Also wanted to mention that Screen casts are deffinatley the way to go.. Been watching most of Jeff’s vids and have learnt alot more this way..

@jeff could you please take a look at a comment i made on the jflow tutorial (http://nettuts.com/videos/screencasts/using-the-wonderful-jflow-plugin-screencast/)

Thank you…

great work as always!

Besides the interesting screencast, you definitely make the big mix in your desktop Jeff: a Windows based PC + an OS X dock like + the Fedora core 9 wallpaper. Respect to you Jeff

@Wassim – Yeah – isn’t that fun.

You’re the only one who picked up on the wallpaper.

You’ve created a very clear and concise screen cast.

I like this method, but what about how it affects the content sequence. I like the idea of having the main content first, followed by secondary content. I know this question is off-topic.

I’ve heard som much about this grid system. It’s nice to actually see what it does! Thanks Jeffrey.

Still can’t stand dealing with the class names and bloat, especially for making a simple 2 column site.

For creating a complex mock-up quickly for a client, I’d probably give it a shot however.

I still don’t put complete stock in NETTUTS editorials since – as a web development centric site – you still haven’t managed to implement a stable print style sheet.

Pretty convincing. I’ve used it to layout designs in Photoshop, but not for actual CSS layout, yet.

I prefer blueprint. That’s what I’ve been using. It’s less bloated. 960 is still good though.

Blueprint is less bloated than 960? How do you figure?

I can get 960 down to 3k.

@Czuma – It’s not bloated. Why do people keep saying so? I said in the screencast that it wasn’t necessary for a simple two column layout. Obviously with time-constraints, I can’t build a huge and complex site.

I’m surprised that very few, if any, have used the excuse that you are generating style based on the number in the classes in the HTML. We’ve spent how many years trying to get design out of the HTML and into stylesheets?

P.S. @Czuma is a cynic. I think for what it does, it’s a great tool.

Great video, I just may use 960 on my next project.

I read this on a blog while surfing rabdomly

1. Blueprint is simpler: I like that blueprint’s containers never change. I don’t need either a grid of 12, or a grid of 16. 24 works fine for me. There’s also only a “last” class, as opposed to 960’s “alpha”, and “omega”’s. What’s the difference between grid-6, and container-6? Can grid-14 fit two container-7? I’m too lazy to look up the answer since I’ve never once run into a problem where blueprints system wasn’t as flexible as I needed. Especially since the designer and I work together, and we tend hold off on the design until we have all the content.

2. Blueprint gives a damn about typography: 960’s creator says says “I haven’t gone out of my way to establish a vertical rhythm for text, as is described in the Baseline article on ALA. It’s not that I don’t see the value in it, I do. I think it’s an awesome idea, and a noble pursuit. However, it is fragile. All it takes is for a content editor to upload an arbitrarily sized, 173 pixel tall image, and all the subsequent elements are off-beat.” I fail to see what I gain from losing this feature in blueprint. Especially given I use imagecache, and know exactly what to do when an image is 173 tall: fix it.

3. Blueprint has a community of active contributors, and the frameworks is evolving quite noticeably: 960 appears to be the work of one guy.

for clearing float we need to add
every time in 960.gs which i don’t like.

as it here: http://www.thinkflick.com/web-design/960-grid-system-powerful-css-framework-for-tableless-designs/

Ahhhhhhhhhhhh another css framework? :S

Thanks
Omair Rais
http://www.omairarts.com

Please! I don’t have access to video! Could you please upload it to somewhere else? I really appreciate that… Thanks!

Thanks for this… I would definitely agree about the limitations, and flexibility that you have when you write something on your own.

This seems like a ton of work for something that you can do yourself with a very minimal amount of code.

I’m using a CSS framework for the back end of a site I’m developing, and I have to say it works really well. Make’s it easy to not have to focus so much on getting the css right, but instead enables me to focus on the actual code of the site.

@Dave – This is just an example. The task becomes much more difficult when you’re building a complex layout.

It shouldn’t be too difficult to implement documentation similar to the blueprint css framework. “Typography” and “Forms” test pages would be useful on 960 gs.

By the way…960’s site is far better than Blueprint CSS’ as far as aesthetics. But why judge a site by it’s design?…or ahem…a book by it’s cover?

Nice job on the video.

can anyone tell me what thing are best in 960.gs over blueprint ?

after the answer i will choose one over another for my future projects.

@jitendra – frameworks are here to bring productivity and some structure paradigm to our web projects, hence, and by definition; a framework isn’t here to be a simple alternative to the language it intends to replace. So for the people saying that CSS frameworks are useless, I say; it’s just your personal and “actual” point of view.

Now, for the two CSS frameworks in question here (960 and Blueprint), I think the reason to use one instead of the other is function to personal taste, and the big difference between them that I do notice is the fact that the Blueprint framework has a large community and active contributors around the project, whereas the 960 framework is the effort of just its creator. Blueprint is rapidly evolving, and that’s the point

Like this tutorial! Also it got me thinking about using the reset file from Eric Meyers (I sort of have my own basic reset).

What made me hesitate was the fact that you have to use padding in the paragraph in order not to break up the design. I mainly build CMS systems that produce paragraphs automatically when using a line break.
That would break up the text in a box. One solution could be to insert a new child div with it’s own padding and not use it on the paragraph., complicating things.

But then again it’s good being forced to use a very consistent way of building your CSS.

Great job man…thanks.

Thanks wassim for beautiful reply

CSS frameworks are a great idea, and it must save loads of designers time.

Though I need my CSS to be mine, I can’t help it – for various personal reasons. But I will never fight against them… Why would I?

I guess the debate around CSS frameworks comes from the fact any CSS-mastering webdesigner feels like he could have written it by himself – not like beloved jQuery.

Whoa!!

Tons of comments and no one mentioned the word “semantics”. It seems we’ve come a long way.

Don’t get me wrong, I am a fan of the CSS framework (blueprint over 960, simply because there’s a grid generator to make it a bit more flexible). It’s just been my experience (especially here) that people just keep bashing them because they don’t take semantics into consideration. Until the time when you can say:
#myContainer = .container_12 in a CSS file they won’t be.

But, everything needs to be used for the right job. A CSS framework on a 3 column site is overkill. Just the same way Rails/CakePHP would be overkill for a very static site.

Just so that I don’t confuse anyone, I am a fan of the CSS framework and I’m glad to see them being a lil’ more accepted.

Let’s just pray they don’t get overused/misused.

I used this framework for the first time after watching this video and i love it! Its going to save me loads of time in the future.

Thanks Jeff!

I’m planning on writing my own framework using the same ideologies as yui and blueprint. Purely because I work for an inhouse company (eww). And getting sites and prototypes out faster with the same foundations will be more rapid

Very good script. Very nice job man

Thanks
Bhupinder Singh

After watching the tutorial, I looked at Blueprint and 960. I decided to try BP first, since it looked more flexible. But now, I’m trying out 960. I was having a hard time getting the layout right with BP. I understood the functionality, it’s just the class naming was counter-intuitive for me. I wasn’t able to keep up with how many columns I had and I always had to go back and forth to check and count them manually. I’m a beginner with the CSS framework and I feel more comfortable using 960.

This is god send. At work I develop Line of Business applications so time spent making the application look good isn’t valued as much. This allows for such quick setup of layouts that 99% of the time is all that is needed. No more setting up tables for layout, which was previously the easiest FAST way to get the layout going.

Thanks great framework

I’m a little late chiming in here, but as the creator of the 960 Grid System, I just wanted to say it’s nice to see this video, because I think it will help a lot of people come up to speed quickly on the nuances of how it works.

As for all the Blueprint vs. [insert any other CSS framework here] arguments, I’m not sure why people get so up-in-arms about it. If a particular framework doesn’t meet your needs, but there’s another that does, there’s a simple solution: Use the one you like best, ’nuff said.

To speak to the insertion of a clearing div, you don’t have to do that. There is also a .clearfix class, allowing you to keep your markup cleaner. It’s located at the end of the 960.css file. I realize clearing floats is a matter of personal preference, and that’s why there is more than one way to do it, within 960.

As for some things that people see as glaring omissions in the 960 approach, I purposefully didn’t go overboard in attempting to dictate a look + feel. All I wanted to do was address the grid issue, that’s it.

I do “give a damn” about typography, and it’s precisely for that reason that I tried not to impose any typographical restraints, because typography is a designer’s job. The reason text.css exists is simply to act as a lightweight starting point. Nobody is forcing you to use it in your projects.

If one feels the need for there to be an entire pre-packaged design in a single download, and needs to be spoon-fed, then 960 is probably not for you. I get confused when I see so-called “designers” who want all the visual decisions handled for them. Designers who don’t want to design are like “artists” who only paint by numbers.

Anyway, thanks again for the video. Keep up the great work here at Nettuts!

@Nathan – Well said. I couldn’t agree more.

nice tut!

I needed this screencast- thank you so much. I tried to use the 960 Grid in the past, but watching you use it made it click for me in a way that reading the documentation did not. Great job!

Nice screencast Jeffrey. Nicely done, indeed. First time I’m hearing of 960. I can see both sides, but it’s pretty bad-ass nonetheless.

great tutorial. just started my church website using 960, and it’s really simple and easy. I plan on using expressionEngine for the site, so looking forward to implementing them together.

thanks again.

Thanks. That was really helpful for me.

It’s a great choice and would definitely give it a try

Con: It is not really flexible unless you are planning to develop a site using the preset widths

Totally ace thanks! So clear and easy to follow!

Muy bueno, hoy encontré 960.gs y creo que me lo quedo para siempre, he buscado css frameworks de todo tipo y me quedo con este.

Gracias por tan buen screencast

Well done, to day I found 960.gs and I get it for ever, I was searching for a nice and easy css framework ass this one.

Thank you very much for this grate screencast

Thank you very much for this great tutorial! You make me discover many good tricks!! I’ll try 960 for sure now !

@Jeffrey Way : I found 960.gs easier than Blueprint. but still have some questions questions.

1. I’ve downloaded source of this tutorial. there are two reset file. is it needed two reset css file?
2. Your own default.css file shown 2 error in W3C validator. what is that?
3. 960.gs using pixel unit for text not em.is this ok?
4. In your default.css u can use background:gray for all columns . no need to add another for #maincontent. am i right?

As for example in this tutorial in place of going to lipsum.com for a dummy text we can use this extension for dreamweaver.

http://ceslava.com/blog/en/html-lorem-ipsum-extensin-para-dreamweaver/

Hi all,

Came across this and I just wanted to mention YAML. YAML is a bit more flexible then 960 since it is not restricted to 960 pixels. You may want to check it out.

http://www.yaml.de/en/

Awesome screencast. I’m sold 960 is a great timesaver and easier than YUI.

Thanks again.

Where to start, where to start?

The concept
Ok in theory it works, having an simple way of laying out containers is a fantastic feature of the framework, using a simple numerical class naming system reduces confusion on many levels and answers many questions. It also streamlines the code and leaves the initial framework unbloated and stable.

Reality
I understand 960 as its a safe measurement when targeting 1024×768 users and above. I use this as a basis when designing myself so can’t be bad.

The alarm bells started ringing when you mentioned how to apply padding to these elements.

.class_name p { padding:10px; }

Applying padding and layout declarations to children of these parent containers is a sure fire way of making a light css file heavy and bloated. The framework should house the content without the need for positioning, padding and margining of the children. The best way to offer flexibility (which is needed in CSS) is to offer framework variants. Unfortunately this starts to bloat the initial framework which then renders the entire framework useless.

I could continue regarding the negatives but I won’t.

Positives
I admire the way you have tried to develop a framework, it’s serves as a stute lesson for budding developers. It can be rolled out through a company so the underlying code is identical, resulting in easier bug fixing for second hand developers new to another developers code. It can standardize the code, maintaining quality and stability. It can potentially be lighter in file size then if a beginner coded from scratch.

In summary
I love the idea of grid style frameworks, giving class names a consistant naming pattern, but I feel this framework has been left ‘light’ because it can’t deliver the full package. It limits flexibility which CSS is designed for. Lessons can be learned (it has taught me a few tricks) but for bespoke solutions the best frameworks are created by professionals.

Thanks again for the video tut and the innovate thoughts your framework has provoked, all the best.

Excellent Screencast. Just started looking into the CSS framework concept and this really pointed me in the right direction.

thanks for this, it’s very helpful.

btw, rocket dock is the shiz!

also, can you think about offering alternate downloads of the videos? At work, they have a lockdown on all flash video… so natrually, I want to get a downloaded version or something so I can see this.

here you had me at the first video…

Framework it is…

Thank you Jeffrey Way, I recomand 960 help full.

This kicks butt. For those of us who are not experts at css this is both a learning tool as well as a web design tool.

The comments against using this sums up Nathans point that “If one feels the need for there to be an entire pre-packaged design in a single download, and needs to be spoon-fed, then 960 is probably not for you.”. Amen Brother!

Thanks again for creating this.

Hi, why does my video stop at 09:53? I was enjoying so much, I want to see the whole 20:14, what could be wrong? Thanks!

This ‘tutorial’ was so helpful! I was wondering what all the fuss was about with 960. Now I could see it in action and I agree it’s a wonderful time saver. Thanks so much for taking the time to explain this.

Im a newby in css but idont know why you just says that you need to have 2 years with css to use that framework.

@Luis – Too much abstraction. You should never use a framework when you don’t what’s going on underneath.

Excellent screencast, I think I’ll start using the 960 framework for all my future Joomla templates.

The template advice is awesome to, I can’t believe I wasn’t doing that already!

Good to see people like 960 are using Meyers Reset, I often used it on my sites but felt naughty because I didn’t know and understand all the resets.

Anyway keep up the great work and eventually you’ll be able to buy a Mac

Thanks for the very informative screen-cast. I have been using css for a few years now and felt pretty comfortable with everything you mentioned. I was unaware though that a parent div with many floated children must be cleared. I would not have known that was the case and probably would have been banging my head about now. I’ve always tried to design with as little hacks or fixes as possible, being more of a visual designer rather than a coder, so this was particularly informative when it comes to frameworks (which incidentally is very visual and should help me immensely in getting sites off the ground, especially when using a CMS). Thanks again.

Truly incredible stuff. I can see just how much time can be saved without the bloat and cross browser compatibility.

Are you aware that your Tutorial begins about 5-6 minutes into the video? You also spent a tremendous amount of time showing the user how to delete arbitrary files. I don’t recommend you show these trivial things in Tutorials, because it’s not a part of the Tutorial whatsoever. Allow the user to delete what they don’t require –after– all is said and done. This way, all packages remain intact and not confusing in the beginning –and– *new* users won’t accidentally delete what they might need later.

I found this demo through and easy to follow. I have not use any CSS grids before but I sure will give it a try now. I appreciate the little tips and techniques you shared along the way. Keep up the good work.

Is it possible to place the 960 grid system inside of with a 100% width for large background themes? Specially what if I want a different background for my Header, Main Content and Footer that stretched the entire width of the page, but want the appropriate grid framework inside each one?

Great tutorial. As a designer I like to study other´s people solution and I think 960 gs is a great project worthy to have a deep look.

I prefer to work with more flexible units, % and ems instead of px.

So if I ever start a project with 960 gs I´d use this liquid alternative made by Stephen Bau

http://www.designinfluences.com/fluid960gs/

Best regards !!!

For all of you who are concerned about corrupting the semantics of your markup, but are still interested in grid frameworks, check out the Compass project. Leveraging Sass, Compass allows one to ‘mixin’ style definitions from various grid frameworks (Blueprint, 960) directly into semantic css class definitions. The upshot being you can have a nav defined as an unordered list possessing the single class “main-nav” and still get the layout benefits of an underlying grid system.

So, in response to Kevin Lloyd, who stated, “Until the time when you can say: #myContainer = .container_12 in a CSS file [arrives] … ” — well, that time is already here.

You can find Compass on github: http://github.com/chriseppstein/compass/tree/master

I heard a lot about 960, Blueprint and a few others but never took the time to really look into it.

As an instructor at Web Courses Bangkok I need to ensure that our students are getting the best tutition and being taught all the various technologies to help them on their way.

I believe this is a great way of taking their knowledge of CSS and realizing a way of speeding up their delivery times.

Great tutorial and it was “immediately” useful.

Cheers,

Carl

Since so many people seem torn between leveraging CSS frameworks and not wanting to sacrifice clean semantic markup, I wrote a blog post showing how you can have the best of both worlds using Compass.

http://blog.carbonfive.com/2009/03/html/compass-960-semantics

goal + rehearsal begets concision.

(good otherwise.)

Good one. Good to use especially when starting new projects

Nice Article – Worth watching it!

Cheers!

Great introduction to CSS framework, I personally use Blueprint and love it to be able to design a site rapidly with everything aligned.

well…good tutorial jeff…im gonna try this for a while…!

Useful tutorial. Thank you

Hi
Great Screencast!
Can anyone please refer me to a good Screencast about CSS problems regarding IE.
Thanks
Yalon

Nice tutorial. Some of the comments here mystify me… CSS is just about the easiest thing to learn in web design… I can’t see many people using “only” the 960 system, and that’s the point… you use it for immediate (hee hee) measurements that work together, and that’s about it. The rest is up to you. There are no real restrictions.

Any unused classes can be deleted from your “personal” copy of 960… it would take all of 5 minutes to run a CSS redundancy/orphan checker and clean out anything you’re not using.

‘Bloat’… one JPG on your site compressed with 90% quality instead of 85% (or whatever arbitrary values) is going to get you more than 3K of data.

Yeep!

In any event, those who know CSS will instantly recognize whether they might want to use this or not. And to me, that was the real value of the tutorial… watch someone else demonstrate how it might be used, then decide if I want to make the download myself.

Greg

I’m a newbie and looking for ways to improve my site.
Helppppppppppppppppppppp

How did u indent the code in Dreamweaver ??

Jeffrey: awesome screencast! Thanks so much. This is my first intro to a CSS framework, and I’m now sold on the idea.

Cheers
Brent

Great screencast! I’ve just started looking into a variety of frameworks (YUI Grid CSS, Blueprint, and now 960). Its true, I can’t say, I created 100% of the CSS if I use these frameworks, but then again, these frameworks don’t help you create the entire site. They only provide the skeleton of it, which probably accounts for 20-40% of the CSS depending on the style your trying to achieve.

Overall, I find these frameworks useful, as it prevents me from re-inventing the wheel, each time i’m setting up a website.

I also agree that you should have a good knowledge/understanding of CSS before using a framework, its no point learning how to run, when you cannot even walk.

Great vid

Nice one, very helpful and clear screencast.
Cheers

What’s name of firefox plugin used in this video to real time edition?

hugs

it’s to complex process to create something horable, hey beginner user the point is one, which technology are you going to trust to work with? and according to the point of fact adobe is the wrong solution, for example the body who just try to demonstrate his technics with silly and complex codes to build this awful site is totally wrong, why I have to waste my time to learn codes to use the useless and expensive software of adobe while I can draw anything I want and then to embedded to http file with one click? this guy want to learn to program in midi while we use FL Studio or an another example he try to learn us to write a letter with assembly while we ‘ve got MS Word, this guy is try to confuse us and to make us feel dummies, this guy is totally out of his mind, he need 25 minutes to do what I can do in less than 50 seconds

this is awesome, thanks

960 is great and screencast is also graet. thx.

Very nice tutorial.. might play around with this for an upcoming project.

thanks . this really helped me understand 960. My question is why not mske s 1060 , 1160 rtc?

Thank you so much for this tutorial… Now I can realize how much time I’ll be saving using this amazing framework… Great tutorial once again ! Good Job

Fantastic webcast!! Thank you!

thx

Great intro. Thanks! I will definitely look into CSS frameworks for my next project that I have to do from scratch. Dugg!

Very Nice tutorial,

Now I’ve get more knowledge about 960 Grid System an so WOW!

Love it!

May just have to this 960 Grid.

-FireDart

Very interesting tutorial.

Bhy the way Jeff what software are you using to do the screen cast I like the way you are zooming in and out on the screen
Could you tell me what you are using

Thanks in advance

Awesome! I am going to try out 960 in my next project.

Nice — thanks for doing this tutorial!

I have seen it once, loved it .. it’s not working any more… is the video still available?

now it is workin again… thanks for the great tutorial!

I’ve been looking for an explanation of the 960 Framework. Just what i needed thanks.

Great work!Thanks!

Thanx for the nice Video-Turorial

I have to say this much as someone whom literally converted to CSS based design about a year ago (was coming off of 11 years of tables based design) that I think this is a wonderful tool. I believe development is shifting for designers as your client is paying you as a highly paid professional and not so much a code monkey. Take that for what its worth. Tools like 960, Jquery and WordPress even are literally your Swiss Army Knife and your job is to beautifully mesh them. After the beautiful mesh you are should be fully training your client on the proper usage of the end product. I’m sold on this framework after watching the video so many thanks to Jeff and sorry for the long reply.

Didn’t really understand the whole 960 thing but after this tutorial I now understand it.

I love how you created a layout less than 5minutes

Great Screencast!

I thank you for the quick lesson and as always great stuff.

Thanks Jeff, great breakdown of the merits and uses of the 960 framework. I also appreciated (stole) some of your other methods that you briefly revealed: the template index/css/js setups. What’s great about this is that you’re actually helping us drastically improve workflow – which translates directly to more $ in our pockets! As developers and designers essentially our only product is our time. More productivity means more projects done in a shorter amount of time. And that means more cold, hard cash!

Congrats Jeff. No one could ever have explained it clearer than you did.
If you’re to have tuts, articles, et cetera to be translated into Brazilian Portuguese, count on me.

Hey Jeff,

I was just researching the grid structure and your tutorial hit the ball. You are right that if you know what you’re doing, it should only take 5 minutes to digest but it can be confusing if you’re a newbie. I’ll definitely be using it in the future.

Really great one!

This will improve work from tremendously! Thanks!

Really enjoyed this sc. Not sure if I’m going to use 960 quite yet, still a beginner at css as I’m just now getting into designing. I’ve been using free templates to practice.

Thanks a lot Jeff, very well explained. I going to give 960 a try and think it will save a whole load of time.

Cheers

Brilliant screen cast. It’s certainly convinced me to look into a css framework. Not sure whether it will be 960 or blueprint though. I think the advice you give about learning css first is very important. I remember when I first started css, as if the box model wasn’t hard enough, you have to understand that not all browsers apply it the same way.

I have one small niggly point about your screen cast. As a side point you mention the use of a template folder, that’s great and I use one myself, but when you talk about conditional comments for IE6 and using the fix for png transparency, the coditional comment shown on the screen is actually for IE7.

Hi! great video!
Im now learning about this framework! I will let you know about my new site using your tips
Bye!

Thanks for the great screencast. I totally love how 960 makes it easier, thanks to Nathan to have created this awesome framework.

Cheers!

Thanks for such a great screencast. I can’t believe I’ts taken me this long to jump on this…

I have nioticed that a lot of the sites showcased on the 960.gs site have no reference to class=”grid_##”>, I guess this has just been manually edited out once the layout has been finalised?

Thanks for inspiring sc!
have to look up for your png fix too : )

Works a treat…

Very nice Introduction, more of this! ^^

Very very nice and usefull screencast! Thanks.

Thanks for the screencast. That saved me some time. It was well done too!

nice tut and thank you!

You could shave off the first 9 minutes…

thanx a lot gr8 tutorial

Great!!!!

Мы тут

This was very helpful, thank you also I really like the way you do all your tutorial vids, very professional and you don’t beat around the bush and you get to the point fast I like that a lot, thanks

960.gs rocks, Without it I wouldn’t have created my first wordpress theme

http://swiftthemes.com/

http://swiftthemes.com/2009/08/wordpress-themes/swift-the-fastest-loading-wordpress-theme/

Amazing and easy to follow tutorial. Pretty easy to use, if you have an understanding of css.

I’ve been using jQuery for a long time, recently started using the PHP framework CodeIgniter, but didn’t even take the idea of CSS having a framework seriously! LOL, but until now.

It is not true anymore, that it has to be fixed to 960 width.
Check Custom CSS generator on their page which directs to http://www.spry-soft.com/grids/

Great tutorial, thanks so much

I have have read a little bit about the 960 grid and was not sure it would help me. Your explanation has definitely changed my mind. Excellent tutorial, and thanks for showing me the light!

very nice tut!!

I can see the value of using a framework that is already in existence if it will met your needs 75% of the time. If not then their is something to be said for writing your own. Another thing is creating your own Javascript files. Using others is cool but it might be hard to understand what they were trying to do and hard to troubleshoot. Again I believe that in the Framework category, its good to have one but you don’t necessarily have to go main stream.

Great Intro — I understood it immediately
But seriously — thanks that really helped a bunch.

Great tut!

I had some issues understanding the logic of it all before but now it´s all clear! Thank u Jeff

Wow, this is COOL TUTs. Thank very much from Italy.