Hi there,
I was wondering if anyone could recommend a good video (or other) tutorial about CSS/HTML Frameworks (like Blueprint).
Also, what do people generally feel about the framework approach?
Thanks,
simon
Personally i dislike the use of CSS frameworks as they are very bulky in the download and contain a lot of un-needed selectors that you would never use, however with that said you can get stripped down versions which are clean and work well which is pretty much the same as using Eric Meyer’s reset css or the YUI reset css but in a much simpler form.
I can see your point regarding excess code, but putting aside the code element for a while, do designers use any common forms of visual grid for layout purposes, and if so, what sort?
simon
The frameworks add unnecessary complexity at best. Building sites with separate styling and markup is the science; paring the markup and CSS down top the barest minimum, doing the same thing with less, is the art and the elegance.
The resets don’t make sense. Why zero out items you don’t use and why zero out and then set items you do use? Why not just set them once without zeroing?
You should avoid frameworks as imaginekitty says it is nonsense to zero out items and then set items that you use. With custom approach for CSS on every web site you can achieve best performance.
Hi nomis66,
I’ll disagree with the others and say you should definitely look at frameworks.
Most aren’t bulky at all, and the lack of a framework can often lead to you duplicate styles.
I’ve recently started using Compass and love it.
It includes:
A reset
CSS3 utility functions for vendor prefixing
Vertical rhythm for Typography
Grid layout
You can implement as little or as many as the modules as you want.
Resets are normally used to ensure rendering consistancy between browsers. Some browsers have slightly different defaults for some elements. I normally reset <h1> to <h6> and maybe a couple of other elements. I don’t bother resetting just about every element like some prefer to do.
Getting back to the op’s question, I would advise against using a framework unless you really must use one for some reason. I prefer to have full control myself rather than have my hands tied to some extent to what the framework allows or wants you to do.
Thanks guys,
It occurs to me that frameworks have both benefits and disadvantages. As a comparative novice i think that I should probably get a stronger grounding in HTML/CSS before delving any deeper.
However, I would like to know if people tend to use a visual grid system when it comes to designing the appearance of their sites???
si
Yes, as long as the design can translate well enough to the flexible nature of a web page. Laying something out on paper (or photoshop or illustrator) it often helps to start with a grid using rule-of-thirds or golden ratio for general placement.
It’s just unfortunate when that concept of controlled static grids, that works on paper, is transferred to a web site layout in a control-freak way. By your question I can see that you know that a grid on paper doesn’t necessarily translate to using a grid-based layout system .
Nomis66:
You may be interested in reading Jeff Croft’s (one of the creators of Bueprint) explanation of why he needed it: http://jeffcroft.com/blog/2007/aug/09/myth-content-and-presentation-separation/ or at least, that must have been where I read where he explained the situation was something crazy like a bunch of newspaper? sites who were all crazy complicated yet also similar so it made sense to make a bunch of classes and structures (documented in a wiki) that all the devs used to quickly build the same structures again for more, similar clients.
That said, whenever I see front-end markup like you see in any typical Drupal page (I say Drupal because it’s one framework/CMS everyone goes on and on about how awesome it is blah blah, plus they’ve offered a 960-grid-based theme since D7), I puke rainbows. 500 wrapping divs with classes like “block block-block clear-block block-clear-block clear-clear” is disgusting.
But then only web developers look at the underwear of a site. The average web surfer never sees all that crap. I sure as hell wouldn’t want to have to deal with that code though. Gross.
Off Topic:
Thanks for putting images inside my head I now can’t get rid of… :headbang: :mad:
I would certainly reccomend using a “boiler plate” which is more like a head start of pre-written code that you can just modify and remove unused elements from rather than a full framework.
Frameworks can be good for rapid prototyping and wire frames but so can Photoshop hehe. I don’t suggest using a framework when possible for any production website, for one, all that extra CSS and such like is an extra bit of page load, bandwidth and negative SEO points (page load etc) not to mention bad form.
If you need a framework then I have used ZURB’s foundation a few times which is a nice and easy one which covers many scenario’s although it also comes with Javascript elements and some other bits. http://foundation.zurb.com/