Ask HN: Are there any resources for learning html+css that are actually good?

[newsisan]

Definitely inspired by: http://news.ycombinator.com/item?id=2002668

"I've yet to find any good, modern, sources of learning HTML and CSS. "

And then about w3schools which I had the impression was good: "w3schools is the single worst 'developer' site on the entire web."

[mtinkerhess]

I taught myself CSS by going through each design on CSS Zen Garden, looking at the source code and poking around with Firebug until I understood why each design worked the way it did.

http://www.csszengarden.com/

[Jem]

http://htmldog.com/

[petervandijck]

Had a look, that's a great one for beginners.

[bearwithclaws]

CSS Mastery by Andy Bubb. The best, and only one book/resource you need to become really good with CSS.

For HTML, spend an hour or two with HTMLDOG.com will do the job.

[drtse4]

I also liked Bulletproof Web Design for all the real world examples, not sure that the techniques shown there are up-to-date though.

[malandrew]

Dive in HTML5 by Mark Pilgrim

Designing w/ Web Standards, 3rd Edition by Jeff Zeldman - Please note that this book is more about orientation and how to go about learning HTML/CSS than actually coding. Only the last chapter contains a real coding exercise. Either way, it's worth a read.

Most of the best resources on HTML/CSS are the blogs and sites maintained by the main contributors to the standards. Whenever a section of the W3C spec is vague or confusing, go check out the blocks of people like Bruce Lawson, Eric Meyer and Zeldman to help clear up the ambiguities.

[meadhikari]

And then about w3schools which I had the impression was good: "w3schools is the single worst 'developer' site on the entire web."

What made you think that?

I learned html and php through w3school and it was a wonderfull experience.

[hackinthebochs]

It's terrible because it teaches everything in isolation. You have a section for this tag, a section for this function, on and on. You never get a feel for how all the pieces fit together to build something non-trivial. It's only useful as a reference. And even for that purpose its terrible because the information density is way too low.

[malandrew]

It's good for a basic reference when you don't want to wade through the W3C spec. It's not good for learning.

[tstyle]

I hate the ads, but otherwise the content was good enough for me to go back every so often

[nash]

The only issue with w3schools is it is basic. Otherwise it covers a lot of material fairly well. At least it's not wrong, like many other resources.

[newsisan]

That was not my opinion, it was from the linked thread at the top.

[isleyaardvark]

The Opera Web Standards Curriculum: http://dev.opera.com/articles/view/1-introduction-to-the-web...

I didn't find it until well after I learned HTML & CSS, and I wish I had seen it then. It covers web standards from the bottom up, and would give you a really great foundation to start from.

[malandrew]

Mozilla's stuff and the Webkit blog are also quite good.

[pdelgallego]

A think the last post about CSS Positioning in A List Apart was very good.

http://www.alistapart.com/articles/css-positioning-101/

[drongo]

Check Sitepoint reference (CSS, HTML, Javascript) - no bad one http://reference.sitepoint.com/

[rubinelli]

They also have some good PDF/paperback books.

[petervandijck]

http://www.webmonkey.com/tutorials/ is a classic and still online. Well written.

I'm not sure if their older tutorials are still online. Check out this example to show to absolute beginners: http://www.webmonkey.com/2010/02/make_an_html_document/

[mch929]

A List Apart and Webmonkey were how I taught myself. I referenced w3schools a few times as well.

[csomar]

For CSS I would suggest that you get a look at Stylizer (http://www.skybound.ca/).

That won't teach you CSS, but will certainly be more productive than anything you'll read/work with.

[AlexMuir]

What would an ideal online course look like? I've been thinking about building a wiki-style engine for tutorials etc. I'd like to apply some of the elements from Stack Overflow (badges, rep-based priviledges etc)

[kulpreet]

If you'd rather watch video tutorials than read something, I'd highly recxomwnd the Lynda.com series 'CSS for Designers' — Although it's a bit dated, it teaches you a lot about web standards and semantics.

[ssn]

Harvard's course on "Building Dynamic Websites"

http://academicearth.org/courses/building-dynamic-websites

[zoomzoom]

Right click, "view source", use webkit inspector/firebug/etc...

[tyrmored]

I can see this is sort of tongue-in-cheek, but I really have to agree. I find there's just no better way to do it.

That said, for slightly esoteric techniques like Suckerfish menus, http://htmldog.com/ helps a lot.

[signal]

1 for Firebug.

I learned by going to the most complex sites I could find and turning things off. Then I changed things, and finally added.

Once you've done that you're too far on your way to need further advice.

[withoutfriction]

To address this, check out this: http://news.ycombinator.com/item?id=2024011

[glen]

http://nixty.com/course/Web-Design-Essentials-XHTML-CSS

[yanw]

http://code.google.com/edu/ajax/index.html

[mansr]

Nothing beats reading the specs.