Learning HTML5 and CSS3

user371187 picture user371187 · Mar 2, 2011 · Viewed 8.2k times · Source

Imagine somebody today, March 1 2011, has never written a webpage and would like to know what they should read to start building web pages today. They don't care about backwards compatibility, but want to build with web standards so that they will be portable amongst as many browsers as possible (Yes I'm saying I do not care if my web pages don't work with IE 4-8, Opera, Netscape, Mozilla, etc, I really don't care, because I've never used them, and that's likely true about those who will use the tools I'm building).

This person has zero biases or bad habits because they've never done it before. They're also hyperactive, so if they have to read 200 pages as to "why to use web standards" or "why web standards are better than "the old way"", they'll get discouraged and distracted and throw the book away, and go swimming. Speaking of which, my hair is wet.

They're looking for references that are engaging and concise. They're not stupid, this person is a real-live engineer who has done a tiny bit of development, a decade or two worth of systems administration, and even built a successful company or two. They just didn't go to college because they really aren't book learners, and are better at applied hands-on learning than at absorbing mounds of useless data in order to get to the two or three things they really need.

Given all of that data about the individual, and I know it's a lot about that individual (this individual is me, of course), what books or resources would you recommend?

(Zeldman's books are out because I already threw them away and then went swimming today.)

Answer

Andrew Marshall picture Andrew Marshall · Mar 2, 2011

Some good resources to start:

  • Mozilla Developer Network: For HTML, CSS, Javascript, & DOM.
  • Dive into HTML5: For learning all about HTML5
  • JSfiddle: For fiddling around without having to build a whole page every time.
  • HTML Validator: For making sure the HTML you write is valid.
  • CSS3 Preview: Run-down of some of the new features of CSS3.
  • Official HTML5 spec: For when you need all the detail straight from the source.
  • jQuery: Arguably the best framework for making writing javascript for websites easier.
  • A List Apart: "For people who make websites". Definitely not for starting out, but good to read regularly.
  • Firebug: If you're using Firefox, this is a must-have.
  • Developer Tools: built in to Chrome & Safari (essentially firebug for webkit)

Also, do not use W3 Schools. Please see W3 Fools for a long list of reasons why. W3 Schools will often come up at the top of search results, but please resist the temptation to use it.