The beauty of web standards

Image taken from designblurb

Image taken from designblurb

I dont con­sider myself an expert on web stan­dards, far from it. But I know a good thing when I see it and expe­ri­ence it. Ever since read­ing Jef­frey Zeldman´s book, “Design­ing with web stan­dards” I´ve been an avid web stan­dards uhhh, guy.

When I got my first job as a web designer / coder I only knew how to use tables for lay­out. I was quite good at it actu­ally, all those spacer gif´s ahhh, the good old days. The com­pany I worked for had lit­tle insight into the div lay­out thing, it wasnt until I started doing it by my own moti­va­tion that we started to do table less lay­out. And when I read Jeffrey´s book things really started to develop fast for me and the company.

I´ve been read­ing up on some html 5.0 stuff but at this moment in time it seems like a dis­tant dream, browser sup­port well, sucks! It seems like the browser ven­dors are doing a bit bet­ter on CSS 3.0 than html 5.0 which does help some. But of course there is always one browser (guess who) that is really lag­ging behind the rest.

I coded my own site to meet the w3c stan­dards and val­i­date. This stuff is actu­ally quite sim­ple, just learn what some of the tags are sup­posed to do. The p tag is for a para­graph of text. Block-quote is for a quote from some­one. H1 is the main head­line of the page and you should use h2, h3, h4 etc for the sub­se­quent head­lines within the page. Use strong for stuff you want to be bold, it´s really sim­ple when you just read up this stuff. I highly rec­om­mend Jeffrey´s book.

gummisig.com block quote

gummisig.com block quote

Facebook block quote

Face­book block quote

A great exam­ple of the ben­e­fits of cor­rectly mark­ing up you code can be seen when I imported my rss feeds from my site to the notes in Face­book. I actu­ally was a bit sur­prised, but after get­ting over that I was like “of course, yeah web stan­dards”, not in a nerdish way of course. Every­thing looked great in Face­book too, they appar­ently have also made styles in their css to accom­mo­date for stan­dards. My block­quotes look like block­quotes in the Face­book notes as well.

There are mil­lions of other rea­sons to code your site with stan­dards, this is just a small one. But it is fun to see the result. This should also look good on hand­held devices and rss read­ers, etc.

Good markup will look good every­where, except maybe in Inter­net Explorer, pun intended.

You should follow me on Twitter here

3 Responses to “The beauty of web standards”

  1. RosastefNo Gravatar says:

    Excel­lent. Couldn’t agree with you more. Have not read Zeldman’s book yet, have been about to read it for years. Head­ing to amazon.com now…

  2. gummisigNo Gravatar says:

    …like your style Rosa :)

  3. AndreasNo Gravatar says:

    I remem­ber going from table-based lay­outs to CSS-based ones. What a dream it was. I real­ized I could change the entire design with­out touch­ing the markup at all. I think that was the biggest thing for me. Since then I’ve always striven to keep my HTML as clean, seman­tic and acces­si­ble as possible.

    Beau­ti­ful design btw!

Leave a Reply

Inspired by Iceland