W3C Core Styles | Hacker News Reader

W3C Core Styles

w3.org

39 pointsmshafrir18 comments

Is this a trick where you post an item from 1999 and we all think it's recent? This seems completely pointless -surely anyone able to code HTML is also able to copy and paste a Css file from somewhere?

I don't think it's a trick at all, and I wish I knew about it years ago. The web is like that: tons of crap that's easy to find and lots of gems that you find, then lose, then maybe find again. (Sort of like visiting a really good used bookstore: you need to browse and hope to get lucky.)

Some of the styles are not to my taste, but three or four of them are clean and simple and easy to read. They provide someone with no CSS a head-start. They provide someone with little design skills a head-start. How is this bad? (As for linking to a CSS file: the good thing here is that the authors explicitly offer them up for re-use. It's a bit underhanded to just find a website you like and "borrow" its CSS wholesale.)

"Some of the styles are not to my taste, but three or four of them are clean and simple and easy to read. They provide someone with no CSS a head-start. "

Yes and no. It's probably better than nothing, but nowhere near as good as using something that considers layout as well, such as 960gs, jQuery-ui, Typogridphy, YUI, Blueprint, and so on.

The CSS, much like the markup used in the sample doc, is more "Here's my thesis" than "Here's my Web site/app". And that's clearly related to the age of content.

All fair points, though many people still write web sites with just pages, rather than web applications. (I do, for example.) Still, I agree that some kind of layout for columns would be great. As a non-designer, however, I find most of the grid systems immediately overwhelming. (For example, I'm looking now at the front page of 960gs, which I didn't know, and I want to cry. I have zero idea what I should or could do with that.)

"For example, I'm looking now at the front page of 960gs, which I didn't know, and I want to cry. I have zero idea what I should or could do with that."

I've been using 960gs quite a bit. It fairly simple (or at least it seems so now).

The basic ideas:

* Grid layouts are a Good Thing (see http://www.thegridsystem.org)

* Grids work best when used with proper proportions and ratios

* If you start with a fixed width of 960 pixels, you can get even divisions of 12 or 16 columns, with suitable margins between columns

* You can use CSS to set the width and margins of div elements

* 960gs defines CSS selectors to do just that, with styles for all combinations of column widths

* You can nest grids; 960gs has container styles (to contain stuff, natch) and grid styles.

* The 960.gs site has a number of example sites to glom ideas from

For example

    <div class='container_12'>
     <div class='grid_6 alpha'>Foo</div>
     <div class='grid_4 '>Bar</div>
     <div class='grid_2 omega'>Baz</div>
    </div>

splits the page into three sections, divvied up into different sizes. (The alpha and omega class values are used to trim margins on edge columns.)

And that's pretty much it. Work out a layout based of 12 or 16 evenly-sized base columns, and use that to assign the CSS class values.

Anyway, my E-mail is in my profile if you have questions. I'm no 960gs expert, but have been playing around with for a bit at least.

Edit: Just re-discovered this page

http://www.mostinspired.com/blog/wp-content/uploads/2009/rip...

A nice demo page of using 960gs with JQuery.

The CSS, much like the markup used in the sample doc, is more "Here's my thesis" than "Here's my Web site/app". And that's clearly related to the age of content.

More Web sites should take the "Here's my thesis" approach.

Do you have a recommendation? I found it hard to find a good default style sheet. The "base" styles from YUI and Blueprint at least look horrible.

http://csswizardry.com/typogridphy/ may be a good start. Clean and balanced.

This is such a strange idea, I could definitely see this helping people, but the people it would help probably wouldn't know this existed as an option.

It will help me. Truly good design requires focused, skilled attention. But things like "core styles", blueprint, and the YUI stylesheets move the standard of "good enough" a little bit closer to that ideal. It's awesome for a developer working on an MVP.

These are quite nice. Only one thing gives away their age. Every choice is fluid. The Web seems to have reached an informal consensus that having a maximum or fixed width for lines of text is a "Good Thing™"

I'm not sure; I enjoy playing with these pages, resizing my browser window down until it's perfect for me, rather than having the width predefined. But I might be strange that way (and most users won't even know how to resize their windows...)

The main issue with not having a maximum width is the lack of readability of long lines of text.

Stop maximizing your browser.

I like to maximize whatever window is in focus to minimize visual clutter. (one of my pet hates about Safari and Mac OS in general is it's aversion to full-screen windows.

As I've ranted about before multiple overlapping windows solve more problems than they create. Give me a single full-screen window plus the option to occasionally tile 2 (or 4) windows for those few occasions when I need that.

I always assumed that was laziness on the part of the designers, and decided to make my layouts as fluid as possible as a result. But, since I'm more of a code guy than a CSS guy, I'd end up spending hours perfecting the layout, instead of developing, and I'd end up setting max-width and min-width anyway (to wide ranges, something like 600 to 1500px, but I'd use em). I also always used em for units, in case the user was using large fonts. I always hated a site with lots of text that fixed its width to something small like 550px, until I found out about the Readability bookmarklet.

So, 1: is there a good reason not to use fluid layouts? 2: What should a code guy like me do to minimize time spent designing prototype fluid layouts, before I'm ready to pay for design?

This is the end of a long road that started with the the combined popularity of RSS readers, Readability, Instapaper, Safari Reader, and all those cookie-cutter blog templates.

The end, or the beginning? These were designed in 1998.

Reply on news.ycombinator.com