Misunderstanding web standards
Written at 10am on 09.11.06
Filed under Web Design / That Internet Thing / ALL CATEGORIES
8 comments (closed)
With every new website project undertaken both at work and at home, I find myself becoming more thorough about web standards, and as a knock-on effect, more frustrated at how poorly some designers are following standards-based practice. But there’s something else as well: Some people are misunderstanding what ‘web standards’ actually means. A conversation I had with a friend this morning highlighted some of the key issues of standards-based web design, as well as the misunderstanding surrounding them. To summarise, the main focus of my response was that said friend had mistakenly thought that I had claimed CSS was the key to accessibility. He cited a BBC programme that studied web accessibility and stated that CSS hadn’t come out on top.
My response:
Yes, it’s absolutely right that they should not mention CSS – it plays no part whatsoever in a site’s accessibility.
The prime thing above everything else you can do to make a site accessible is to have clean, semantic markup: structuring a document with proper hierarchy (using the appropriate h1s, h2s, lis, etc.), regardless of where elements will physically appear on the screen once the styling is introduced; giving semantically meaningful IDs and classes; and (something I’m really into at the moment) using things like dl / dt / dd elements where appropriate, instead of plain text with span wraps or – even worse – tables. This is something very few people do.
The upside of doing all this stuff, aside from it being the most important part of site accessibility hands down, is that it’s also the most important thing you can do to make a site Search Engine Optimised. So two birds with one stone!
But CSS plays no part in this whatsoever. CSS simply allows us the freedom we never used to have to write markup that is completely devoid of presentational elements. So the BBC were right.
However, I would argue that it’s unlikely someone is going to have an understanding of all of the above if they have no understanding of CSS, as they are effectively still in the Dark Ages world of font tags, tables, and markup littered with presentation-related code.
If there is a myth out there about CSS ‘future-proofing’ a site, I’m certainly not a believer of it: CSS demonstrates how changeable sites can be (CSS Zen Garden being the perfect example), so in fact the opposite is true: if there’s any ‘future-proofing’ to be done, it’s in the mark-up, not the style.
8 comments (closed)
Comments are currently closed on this entry, but you can still read those that have already been posted...
Search
Speaking engagements
- Web Developers Conference 12th November 2008
- Spletne Urice, Ljubljana 29th October 2008
- SkillSwap Brighton 20th August 2008
- Future Of Web Design, London 17th & 18th April 2008
- Future Of Web Design, New York 7th November 2007
- SkillSwap Bristol 25th September 2007
- iDesign: design for life (part of the London Design Festival) 18th September 2007
- Oxford Geek Night 25th July 2007
Recent posts
- Why being freelance does not mean you have to work more hours
- Starkers for WordPress 2.6.2
- Forthcoming speaking events
- Thwart the design thieves feature in .net magazine
- Death to IE6
- Vote for my SXSW ‘09 panels
- Bypassing the new Delicious site
Categories
- ALL CATEGORIES (89)
- Apple (9)
- Carsonified (2)
- Cooking With Beer (1)
- Design inspiration (2)
- Life In The Real World (32)
- Publication & Recognition (21)
- Software (14)
- Speaking Engagements (11)
- That Internet Thing (15)
- The Business (5)
- This Site (14)
- Travel (10)
- Tutorials & Resources (10)
- Web Design (32)
- Wordpress (5)
- Writing (1)
Blogroll
UPDATED! I’ve been known to while away a few hours on these blogs, most of which are written by my friends in the industry...
- Jørgen Arnor Gårdsø Lom
- Jina Bolton
- Nathan Borror
- Mark Boulton
- Sam Brown
- Andy Budd
- Kevin Cornell
- Jeff Croft
- Jon Hicks
- I Love Typography
- Shaun Inman
- Roger Johansson
- Daniel Mall
- Kyle Meyer
- D. Keith Robinson
- Jason Santa Maria
- Dave Shea
- Jonathan Snook
- Jon Tan
- Typesites
- Tim Van Damme
- Khoi Vinh
- Web Designer Wall
- Rob Weychert
Recent Comments:
- Rajesh Pancholi said: sorry for the babbling : )
- Rajesh Pancholi said: Good for you, remember why you’re making the change and don’t...
- prisca said: Elliot, great to read you’re making such a success of your freelance life ;-)...
- Christoph said: Very motivating and encouraging article! But I have some second thoughts :-)...
- Pete Eveleigh said: BTW I loved this bit… I’m not the type of guy who’ll write a blog...
- Pete Eveleigh said: I tend to agree with what you say but the article doesn’t really say...
- Gary Stanton said: Wish I knew how you did that. I’ve been freelance for around three years...
- Phil Bowell said: Whilst your post is very encouraging, I’m in agreement with John (the...
- Dave Ellis said: I seem to be going the opposite way, I need to make a conscious decision to work...
- Alex Older said: I’m looking to make the jump after Uni depending on how things go and this...
Recent Reads
-
Basics Design: Layout (Gavin Ambrose & Paul Harris) - A beautifully designed book about beautiful design. Some key layout principles are presented in an engaging way, and this is more a book about inspiration than pure instruction.
-
Poe: Illustrated Tales of Mystery and Imagination (Edgar Allan Poe) - Some fine contemporary illustrrators take on some Poe classics and the result is a gorgeous collection of words and art.
-
Penguin By Design (Phil Baines) - A history of Penguin Books’ cover designs, as educational and inspirational as you’d expect from this prolific publisher.
-
Thinking with Type (Ellen Lupton) - I first saw this sitting on a desk in the nytimes.com offices, and after thumbing through it, realised it was one of the best books about the technicalities of typography that I’d seen.
-
Hellboy: The Troll Witch and Other Stories (Mike Mignola) - The latest Hellboy trade paperback collects yet more classic stories, although this time Mignola is joined by other artists.
-
The Ten Commandments of Typography (Paul Felton) - A book of two halves (the flip-side deals with so-called ‘Type Heresy’), this is a witty but informative book bout typographical techniques.
-
Great Beers of Belgium (Michael Jackson) - No, not that Michael Jackson. This is the one who really knows his stuff when it comes to fine beers.
-
London: The Biography (Peter Ackroyd) - A lively, engaging book about the history of London, told as it the city itself were a living thing.
-
Tres Logos (various) - I could look through logo books until the cows come home; this kind of collection is invaluable to the identity designer, and this is, of course, just one book.
-
Business Cards 2: More Ways Of Saying Hello (various) - This is another great source of inspiration and a lovely ‘coffee table’ book that’s a joy to flick through even if you don’t need to design a business card.
-
Schild’s Ladder (Greg Egan) - One of the most full-on sci-fi books I’ve ever read, with its use of real physics and exploration of quantum mechanics shaping much of the narrative.
-
Wolverine: Weapon X (Barry Winsor Smith) - A landmark story in the history of this legendary comic book character, Weapon X has become a real classic.
-
Casa Batlló: Gaudi (various) - Sam and I visited Barcelona last year, where we saw several amazing architectural feats by Gaudi. This book captures some of the beauty that our camera couldn’t.
-
The Fundamentals of Typography (Gavin Ambrose) - This was the first bok I bought specifically about typography, and it pretty much does what it says on the tin, although a nice bit of history is thrown in as well.
-
Analog In, Digital Out (Brendan Dawes) - Magnetic North’s main man explores some arty, experimental projects without any of the ponce usually associated with the genre. This is a book about merging new and old ideas, and it’s inspiring all the way through.
-
The God Delusion (Richard Dawkins) - Possibly one of the most important books in print today.
-
Foundation’s Edge (Issac Asimov) - Another Asimov classic, this part of The Foundation Saga encapsulates some monumental ideas about humanity far beyond the boundaries of regular sci-fi.
-
Web Standards Creativity (various authors) - 10 great lessons for writing better markup, using the latest CSS, and adding subtle Javascript tricks
-
Transcending CSS (Andy Clarke) - Rethink the way you design and code. This book was hugely influential on me whilst building the latest version of this site and made me even more pedantic
-
Dune (Frank Herbert) - An absolutely legendary sci-fi novel full of very complex ideas... much better than the film!
-
Neverwhere (Neil Gaiman) - A dark and charming tale of a man who eschews normal life for the secret underworld of ‘London Below’
Flickr
View all of my photos on flickr
Matthew
24.04.07
#
I like what you are saying, but I find myself slightly cringing at some of the claims you’re making. A large part of accessibility (as noted in the w3c reccommendations) is having the content, structure and presentation layers separate. So, if you want your site to have any sort of presentaion, one could argue that it must have a stylesheet mate. Even though it’s an IF, it does raise the question if CSS has an important role in accessibility. So I don’t know if I totally agree with your statement that CSS plays NO part in accessibility. I do agree that semantic markup is the key here, but CSS does have it’s part. Ask yourself this, can this site separate its presentation, content and structural layers without CSS? Accessibility doesnt referr only to those with screen readers. I know there are a lot of ways to look at this, I just want to keep you thinking.
Elliot Jay Stocks
25.04.07
#
Matthew, I know what you’re trying to say, and I appreciate you digging deeper into the debate; however, dig even further and you’ll see that CSS doesn’t have a role to play in accessibility.
Why am I saying that again after what you’ve said?
Because your scenario assumes that there has to be a CSS file. If you want an accessible website and you want it to have a design, yes, I agree that you’ll need a CSS file in order to separate the content from the presentation. But a website doesn’t require a CSS file to be accessible - it only requires a CSS file to be designed.
I think this deeper crux of the matter is what I was getting at; I hope you can see why I stand by my argument.
Erika
16.05.07
#
I have to say, I am still one of those designers who has a hard time really truly understanding what “accessibility” means and an even harder time with CSS.
I have taken the time to learn how to create a site with it, but find it frustrating that a) I have to jump through hoops to get it to play nice-nice with IE 6 AND 7 and, b) that a majority of my visitors are still using IE 6 or 7. Actually, last I checked it Firefox was 4th in browsers that viewed my site!
I go to all these (what I assume are) beautiful websites built using CSS and they are all funky in my IE 7 browser.
I am totally against forcing a user to download something to what may or may not be their computer in order to view my site properly. I think that’s just pretentious and not very smart.
Ideas?
Elliot Jay Stocks
16.05.07
#
Erika, you’re completely right to be against anyone who forces a user to download a piece of software in order to view a website. However, I think you’ll find that the vast majority of desigers working with Web Standards do not adopt this approach. It flies in the face of accessibility.
Many designers (like me) have simply set up procedures to ensure sites degrade gracefully in older (and less capable) browsers. It doesn’t mean they won’t work in IE; it simply means that users with more capable browsers will get a few extra treats. I’ve talked about this in quite a bit of detail here and here.
I would urge you to persist with CSS-based layouts and building with Web Standards. It’s a tough hill to climb, but the benefits far outway the reasons against working that way. I read your post about the subject and I remember feeling the same way as you just before it all clicked into place. Although you may feel that CSS-based sites are excluding users, it’s far more true with table-based layouts and non Standards-compliant markup, which have very major accessibility problems.
Matthew
17.05.07
#
Elliot, let me quote myself really quick here.
“So, if you want your site to have any sort of presentaion, one could argue that it must have a stylesheet mate.”
I did put that if in there. Because you’re right, if you want a site to have no styling, it can be accessible and semantically correct without a stylesheet. But as far as I could tell , you were referring to real world examples where styling is part of the site. Because let’s face it, no one wants a site without styling. I never said a stylesheet is required, but I still disagree to say it has no part. In real world sites, there is styling. I consider that a role fulfilled by CSS.
I think you would be safer saying that CSS is not required to have a semantic and accessible site. But once you add a design(like most clients will want to do), you NEED a stylesheet to keep it semantic and accessible. That, as far as I know, qualifies as a role in keeping things up to standards.
Can you see what I’m saying here? CSS doesnt make things accessible, it helps to keep things accessible by giving us a way to separate the content and presentation. That is it’s role. But it is not required in a site.
As a last thought I just want to say, I think we are somewhat agreeing here. My initial post was defending that CSS has a role to play. We both agree it is not required. But in a real world site, it has a role. And I think if you read my first post you will see that this was my stance. CSS has it’s part, but is not required.
Erika
18.05.07
#
Thanks Elliot!
As far as designers who try and force their users to download more “CSS friendly” browsers, I have definitely seen quite a few designers who’ve adopted this approach. Maybe they aren’t the best examples of tolerant designers, but they’re out there. If I have time I will shoot you a few links.
I’m confused as to how a table website would exclude anyone from viewing a website. I just have yet to see any proof of that although a lot of pro-CSS designers claim that. What exactly does that mean?
I’ve also gone through some of the CSS site showcased on CSSBeauty in my IE browser to find that many of them don’t “degrade gracefully” as you put it. I can’t click on a menu because the “floats” aren’t configured properly. Whereas, I’ve never had a problem with table-based website.
Don’t get me wrong, I will continue to work on it. I am just having a hard time really understanding how CSS is better for the end-user and the designer when I spend so much time trying to make it “degrade gracefully” and I’ve never had to do worry about that (or rather rarely) with a table-based site.
Hit me up privately if you wish! I plan to suck as much knowledge out of you as possible so be prepared!
- e
Elliot Jay Stocks
20.05.07
#
@ Matthew: Yes, I’m happy to say that I do think we are actually agreeing with each other here! It seems a miscommunication on both our parts managed to disguise that fact. A very enjoyable discussion, nonetheless!
Matthew
23.05.07
#
Elliot, it was a pleasure. I shall take more time in the future to get my point accross more clearly.
@erika - you said “I’m confused as to how a table website would exclude anyone from viewing a website.” Can I ask you something? If you were blind, how would you browse the internet? Answer: you would use an assistive application that would read the screen for you. Now here is the kicker, table based layouts are not only interpretted as big tables of data (instead of something more like a document) but table based layouts often dont have any sort of structure to them that is readable to screen readers.
Here is a good link for you:
http://www.w3.org/TR/WCAG10-HTML-TECHS/#tables-layout
I think its an old document(from 2000) but it is the basics. And it may qualify for the proof you wanted.
Cheers.