Old-timer web designer looking to get back up to speed with HTML5
May 11, 2012 4:23 PM Subscribe
I need to do a bit of web design and I haven't done any since people were still using tables to position things. Point me to a good book and/or online tutorial to help me put together a relatively contemporary-looking site.
More background: I am a competent back-end coder (i.e., I can write in Perl, C, do database design, etc.), but the last time I wrote a front-end page for people to, you know, look at, the div tag was a newfangled thing. So, I'm looking for web design tips that are currently useful for someone with that background. At the moment, a static site for viewing on laptops is OK; I don't need Web 2.0 / AJAX functionality or a mobile version or mobile app or anything like that (yet).
I'm willing to buy a good book but would be happy to hear about online tutorials. For instance, I will start with w3cschools.com, but would love other ideas as well.
More background: I am a competent back-end coder (i.e., I can write in Perl, C, do database design, etc.), but the last time I wrote a front-end page for people to, you know, look at, the div tag was a newfangled thing. So, I'm looking for web design tips that are currently useful for someone with that background. At the moment, a static site for viewing on laptops is OK; I don't need Web 2.0 / AJAX functionality or a mobile version or mobile app or anything like that (yet).
I'm willing to buy a good book but would be happy to hear about online tutorials. For instance, I will start with w3cschools.com, but would love other ideas as well.
Oh, and w3schools is pretty poorly regarded. I don't personally use them, so I can't vouch, but I would look at CSS Tricks first.
posted by backwards guitar at 4:34 PM on May 11, 2012
posted by backwards guitar at 4:34 PM on May 11, 2012
Coming from a similar background, I found CSS Mastery to be an excellent book for understanding how to design with CSS.
posted by Brak at 4:37 PM on May 11, 2012
posted by Brak at 4:37 PM on May 11, 2012
Response by poster: Thanks for the ideas so far! I had recalled w3cschools being decent back in the day, so... yeah. Good to get the updates.
posted by Joey Buttafoucault at 4:55 PM on May 11, 2012
posted by Joey Buttafoucault at 4:55 PM on May 11, 2012
Okay, well, this may be really specific to me, but I really just needed to have a pretty complete inventory of CSS properties and whatnot, to teach myself and experiment. (I don't like structured learning.) And I use... this. Oh it's ridiculous. And yet it works for me!
posted by RJ Reynolds at 5:01 PM on May 11, 2012 [1 favorite]
posted by RJ Reynolds at 5:01 PM on May 11, 2012 [1 favorite]
As a front-end developer, I usually point folks over to Mozilla Developer Network. MDN CSS Documentation has a good reference guide and decent tutorial.
posted by xtine at 5:12 PM on May 11, 2012
posted by xtine at 5:12 PM on May 11, 2012
Also, w3schools is very bad resource. Check w3fools for reasons why.
posted by xtine at 5:13 PM on May 11, 2012 [1 favorite]
posted by xtine at 5:13 PM on May 11, 2012 [1 favorite]
You won't learn much from Twitter Bootstrap, but it is a nice foundation to build a site on.
Devguru CSS2 is what I used back in the day. Similar to RJ Reynolds link.
posted by backwards guitar at 5:29 PM on May 11, 2012
Devguru CSS2 is what I used back in the day. Similar to RJ Reynolds link.
posted by backwards guitar at 5:29 PM on May 11, 2012
That w3fools link, xtine posted is excellent. There are very good learning resources linked from that page. See especially the W3C's Web Education Group and the aforementioned Mozilla Developer Network.
Have a look at A List Apart, even though it may seem like a bit much. Start with an article like,
I also recommend looking at the CSS Zen Garden for some idea of what's possible with with straight HTML+CSS.
But please, for the love of God, don't give up and use tables.
posted by ob1quixote at 6:11 PM on May 11, 2012 [1 favorite]
Have a look at A List Apart, even though it may seem like a bit much. Start with an article like,
For a Future-Friendly Webor
Fluid Grids.
I also recommend looking at the CSS Zen Garden for some idea of what's possible with with straight HTML+CSS.
But please, for the love of God, don't give up and use tables.
posted by ob1quixote at 6:11 PM on May 11, 2012 [1 favorite]
Tables are great for tabular data. For layout, not so much.
Can I Use is helpful if you can't remember what does and doesn't support a certain selector or property.
posted by fifteen schnitzengruben is my limit at 6:52 PM on May 11, 2012
Can I Use is helpful if you can't remember what does and doesn't support a certain selector or property.
posted by fifteen schnitzengruben is my limit at 6:52 PM on May 11, 2012
Ummm...from the third sentence of that "tables aren't entirely passé" link:
The hacks and conditional comments ruin our clean markup. (emphasis mine).
If you're doing CSS this way, you're doing it wrong.
posted by Brak at 10:12 AM on May 12, 2012
The hacks and conditional comments ruin our clean markup. (emphasis mine).
If you're doing CSS this way, you're doing it wrong.
posted by Brak at 10:12 AM on May 12, 2012
HTML5 is a user-friendly book. There is a book by the same author dealing with HMTL5 for mobile devices, too.
posted by _cakes at 6:54 AM on May 18, 2012
posted by _cakes at 6:54 AM on May 18, 2012
This thread is closed to new comments.
CSS Tricks for a website. I particularly like his screencasts. I'd start with him. He's a natural teacher, and super smart.
posted by backwards guitar at 4:33 PM on May 11, 2012