Growing Up With Web Standards

Pingback by snapping links » useful and decorative — Nov 23 2004 @ 9:55 pm

[…] y browsers phpThumb (really easy way to make thumbnail images) muniwireless growing up with web standards firefox screensaver in […]

Pingback by this is rachelandrew.co.uk » This is the way we do things around here — Nov 23 2004 @ 10:19 pm

[…] s the way we do things around here Posted by Rachel @ 11:19 pm Derek Featherstone describes something that se […]

Pingback by Autism blog, web design blog. Left Brain/Right Brain — Dec 20 2004 @ 2:12 pm

[…] ncepts of modern web design. Over on Derek Featherstone’s A Box of Chocolates in a recent article on the wider subject, Derek says; There are stil […]

Comment by Roger Johansson — Nov 23 2004 @ 3:12 am

Great one, Derek. I completely agree, and I think this kind of approach is more or less necessary to help anyone new to building websites find the correct information instead of the old, outdated, and wrong material that is everywhere.

Comment by Tommy Olsson — Nov 23 2004 @ 5:52 am

Well written, Derek.

I have thought about writing a combined (X)HTML+CSS tutorial based on semantics, web standards and accessibility. But I always thought, “why bother, there are tons of tutorials out there already”.

My problem is that I’m not a graphics designer. “Selling” web standards means proving to the sceptics that it doesn’t have to be plain and boring.

And writing something like this takes massive amounts of precious time. I would love to give it a try, but I’m not sure anyone would listen (except possibly a few who already know all about these issues).

I have been able to open the eyes of a few individuals, making them realise that accessibility is something important, and that web standards is not a hindrance but a Good Thing(TM). From a few individuals to several million old-skool web designers is a giant leap, though. :)

Comment by Jesse Rodgers — Nov 23 2004 @ 9:18 am

Nice post Derek but I think you missed something. The vast majority of people that create web pages rely on specific tools to create web pages. The dominant one being Macromedia’s Dreamweaver. If these tools do not make accessible, standard code that people can easily maintain and recreate than they won’t. Plain and simple.

In an academic setting I can create a template. I can distribute 10 different versions for dwt, PHP, SSI, ASP, etc. But I still can’t make people ensure their tables have all the code Dreamweaver or Contribute does not include. Why? They (maintainers) just don’t like the code and they have 100 or so pages to take care of part time. Contribute does a great job but it also confuses style with structure – but that is what Word users get.

So I focus on what I can do. This template will ensure the content is structured well so that it is understandable without style or images. I can ensure some level of meta data, encoding, and contact information remains. I can encourage the use of Contribute that forces ‘alt’ tags, resizes images properly, uses standard code, has a spell checker, and can restrict the ‘style of p’ in place of headers.

Education is very important but as I find myself in the middle of explaining ‘what process I use to make a more accessible web site’ to those who don’t understand, I realize that I am just doing it now.. and not perfect mind you.. but I am thinking standards, accessibility, then IE (gawd IE). I have often resorted to ‘read Zeldman’s book’ then we will talk ;)

Comment by Jonathan Snook — Nov 23 2004 @ 9:29 am

I just have to give you props for the baby zeldman pic. :) Otherwise great post. I just did a quick search for “learn html” and just looking at the top 3 results tells me we should be very worried.

I think one of the reasons that most standards-focused resources don’t rank higher is that they market themselves as a corrective resource. “Learn Web Standards! Use CSS! Lose your old table-layout ways!” You’ve hit it bang on that we just need to develop or link to resources as if they are the definitive starting point for learning how to make web sites.

Then maybe one day “learn html” will bring up useful results.

Comment by Derek Featherstone — Nov 23 2004 @ 9:44 pm

@Roger: Thanks for your thoughts, and thanks for doing your part on your site. Your Bring on the Tables tutorial is exactly the kind of resource we need to see more of…

@Tommy:

And writing something like this takes massive amounts of precious time. I would love to give it a try, but I'm not sure anyone would listen (except possibly a few who already know all about these issues).

I guess I see the possible power of having 10 or so great resources that many blogs link to in order to drive it up the search engine rankings and supplant those older resources that are currently there. I agree, it would take a lot of time, but perhaps it would be worth it?

@Jesse: I’m not disagreeing with you – the authoring tools we use have a role to play in all of this as well, but at a certain level we need to leave that to the software vendors to sort out. That’s what the Dreamweaver Task Force of WaSP is all about isn’t it? At the end of the day, a tool like Dreamweaver is just a tool – so the better the mind that controls the tool, the better the end result.

and finally, @Jonathan: I’ve been aching to work that picture of my son into a post since I took it almost 6 months ago ;) As for the searches, I didn’t take a look at “learn HTML”, but I did look for “html tutorials” and “web design tutorials” and it wasn’t pretty. This is exactly the kind of thing that I want to change…

Comment by Robert Wellock — Nov 24 2004 @ 6:34 am

It’s interesting stuff and I have seen quite a few web designers – doing recent redesigns – that claim to understand accessibility but throw it out of the window for the sake of eye-candy, which is just as worrying.

Comment by Blair Millen — Nov 24 2004 @ 7:10 am

The most interesting aspect of this post is the search term factor Jonathon Snook mentioned. I just did a domain name check for learn-html and learn-css and both are available in the most popular TLD’s. The CSS version is available for almost every TLD while the most popular TLD available for the HTML version is .net.

My suggestion is why not create a couple of new sites (not you personally Derek… but I’d be happy to participate) that can “lead” when it comes to writing html and css. If all bloggers link to them and they were filled and maintained with decent content, as soon as a newbie searches for something along the lines of “learn html” or “learn css” then they have a fighting chance that they’ll end up at the right place.

It could be an extremely valuable resource.

As I say, I’d be happy to take part in a project like this, if someone has suggestions regarding web hosting, content management etc.

Comment by dotjay — Nov 24 2004 @ 8:08 am

I really like this article, Derek. Your comments towards the end are very motivational.

I think one of the strongest points with blogs as educational reources is the inherent chance to provide feedback and to read other peoples’ thoughts in order to make up one’s own mind.

The problem with resources of tutorials, etc is that some are incredibly old (obviously, these should slide down the search engines over time), and some are revamped incredibly old tutorials.

Even though I’ve been doing web design for some time, being relatively new to trading as a web designer has helped me to start on the right path. As you say though, many are stuck in their ways. Others (I’m thinking “clients”) don’t realise that they should be expecting better from their designers.

With respect to rankings of such resources, I wonder how much impact “practicing what you preach” has on that. ;)

Comment by Ray — Nov 24 2004 @ 11:51 am

Never mind Dreamweaver. A friend of mine insists on using Frontpage. He develops government sites and stopped banging his head on the ‘web standards wall’ 3 years ago. 3 years!

That attitude is killing me.

Also: a hosting service I spoke to yesterday for a client is offering a home-grown CMS as a panacea for small business owners to help them publish online. She’s only vaguely familiar with Blogs, has never heard of web standards, and authored a CMS which gives an MSWord functionality to writeing for the web. Right away I was suspicious.

Being morbidly curious, I examined the code. Every paragraph tag came out looking like this:

<DIV><FONT face=Arial><FONT> size=2>

And, she didn’t know that there was more than one version of HTML. It was impossible to decribe to her my business needs.

The problem, as I see it, is MASSIVE. I wanted to puke.

Comment by Malarkey — Nov 24 2004 @ 5:23 pm

Interesting this. There has been a fair bit of standards-geezer self evaluation recently and I have been thinking along similar lines.

I like to think that slowly and surely, the messages are getting across and the best way forward surely is to lead by example; doing high level work, then talking about how and why. Then the results can speak for themselves.

Comment by patrick h. lauke — Nov 24 2004 @ 5:31 pm

coming in late, but: you mirror my sentiments exactly. i’ve just recently caught the opportunity (albeit small, admittedly) of going to do a guest lecture with some first year computing students at our university before they’re unleashed on a web project. mainly focussing on accessibility, rather than standards per se…but the idea is the same: get them while they’re young. get them before they’re subjected to the “…for dummies”, misinformed, old-school tutorials and kewl tips & tricks. it’s much harder to *unlearn* bad habits later on (as many of us found over the last few years) than it is to start with the right mindset and tools from the get go.

oh, and cheers for the mention. we need to catch up on where we’re at with the little SMIL sideproject, mate!

Comment by Lachlan Hardy — Nov 24 2004 @ 10:05 pm

I’m heavily involved in a course that is teaching standards-based web design to Year 8 students. They get taught it in electives at Year 11 as well (for those unfamiliar with the Australian school system, Year 12 is the graduating year). Now I just need to make sure it is covered in the other years…

I’m definitely a strong supporter of getting them when they’re young. I try to avoid mention of tables for layout at all – although every second kid already knows about the font tag

Comment by Cheryl Colan — Nov 25 2004 @ 1:53 am

I teach web design at a community college. My course is considered “occupational,” so the school insists that I teach using Dreamweaver because they believe it’s the software all professional web designers use. I try very hard to teach standards-based web design, yet every book out there for Dreamweaver still uses tables for layout and barely covers CSS. And heaven help me when the students look at the properties window and discover the font face and size attributes. I am tired of having to teach the old way of doing things because I am forced to use books with lessons based on Dreamweaver. I am at the point where I’m ready to write my own book just so there is one I can use to teach my class. We need the teaching resources to catch up to the Web Standards design philosophy.

Comment by Rakesh Pai — Nov 25 2004 @ 1:53 am

What you say makes a lot of sense, and I’ve been thinking in similar lines of late. Blair Millen, I think it’s a great idea to start a site which can pool and host resources that would be all that a web developer needs, from newbie to pro. Such a resource would be heavily linked to anyway because of the nature of its content and the obvious lack of such material on the rest of the Internet.

I am willing to contribute my time and efforts to see it materialize. I doubt it will take a lot of resources (read money) to pull this off. The project sounds interesting, all right! What are we waiting for!

Comment by Derek Featherstone — Nov 25 2004 @ 8:04 am

@Blair and @Rakesh: I’m all for setting up new resource sites etc; however, let me clarify one thing re: my intention.

My goal with anything that we do is to obliterate the poor resources with many good resources. In order to be effective, I’d suggest we need to dominate that first page of search results for the common search phrases.

So, creating one “supersite” might be partly effective, but I think we’d still need a lot more than just that one site as it will only show up as one or two results for the good search terms.

@Cheryl Colan:

We need the teaching resources to catch up to the Web Standards design philosophy.

I hear exactly what you are saying. That is always a problem with printed books, especially those with an Internet focus. I’m not sure what else is out there, but you might want to check out the book that Julian Rickards authored (he told me that he’s working on another one as well…). He’s posted some details: Macromedia Dreamweaver MX Creating Web Pages, including the table of contents.

Comment by Faruk Ates — Nov 25 2004 @ 12:51 pm

Derek,

Excellent post, I’m recommending it to my friends right away! It’s very true that we need to push the old, wrong practices and tutorials down to lower pages in search results. Only then will people be more massively introduced to doing things the right way.

I know that I will be trying my best with my site to provide a whole bunch of resources for people. My Learning CSS project is a good example of this. I hope this have this thing running before the end of the year. With some luck, I’ll even get people to contribute designs for it :-)

Resources aside, we should also give the right example and use the latest, modern techniques when making our own sites. People who are learning HTML and CSS and all often check out the source of sites they like, and if that source is a minimalistic HTML 4.01 (that validates) document, it’ll only teach these people minimalistic HTML 4 — this is, imo, very dangerous. It’s why I keep suggesting the use of XHTML regardless of MIME-type or direct benefit (or lack thereof): XHTML gives a better example for people to learn from, providing you write valid XHTML of course.

My two cents…

PS: I have a comment on your comment system, though: add a color:#000; to your input and textarea CSS rules, because it’s painfully lacking at the moment.

A bigger font-size wouldn’t hurt for this field, either…

Comment by Kev — Nov 26 2004 @ 8:56 am

The problem is very large indeed. I wrote an article on possible accreditation for UK web designers and as a follow-up I decided to try and contact some of the big name web associations to se if they would be interested in heading up such a scheme. I’ve documented what I found and it wasn’t pleasant.

In my opinion talk about moving away from concentrating on standards is premature until we can present a unified (and valid!) face as a profession and take on board the responsibility for educating newcomers in the ‘right’ way.

Accountability and education – just my 2p ;)

Comment by frank — Nov 27 2004 @ 6:12 pm

The tutorials found on the web are very bad when it comes to standards, if this gets high up then I’m all for it.

Comment by Dustin — Nov 28 2004 @ 6:54 pm

Hi there. Good read. Another great reason blogs do well…is because we all link to each other :p
Thus I surfed here from mezzoblue because I was recently finishing up an entry for the css zen garden. So it really wasn’t that hard to find. One great thing I continually love to see is (redundant) basic HTML tutorials because that’s where the newbies are going to start from.

You remember when you started reading from htmlgoodies.com and htmlbasix.com. None of those places told you anything about a doctype or gave you a real good reason why you should close your p tags and make your sure text can be scaled. content separate from design was a totally new concept to a lot of us at one point or another.

On the statistic of 3% knowing web standards. I believe it.

On the video that zeldman put out. I was lmao. “DOM, css, xhtml…wait…css, xhtml, DOM…no wait!”

I just saw that a couple of weeks ago when zeldman put that up on his website at happycog. Good stuff.

Lastly, I work with a guy; he’s a designer and I am a programmer…and we both split up the process of “cutting up the design.” In every case that he gets a chance, he uses sliced up images and tables, which in almost every case, we need a liquid design and his just doesn’t pass.
Afterwards, I have to get a hold of it and start all over with a css re-design.

…this has happened several times and it’s getting quite tedious. It’s folks like my co-worker that need to re-learn the curve which I think will be much harder than those who are just getting into web design.

Anyway, this has gone long enough. I’ve got this site bookmarked so I’ll be around.

Comment by Fernando Dunn II — Nov 29 2004 @ 9:22 am

I think standards are so far behind because the wrong market is targeted. Most resources that I see are clearly created for standards veterans or people who are new to web design. Not much made for people who are veterans of non-standard web design or those who rely on Dreamweaver or Frontpage to do the thinking for them.

If we want to see more standards on the web, a few things need to be done. You need to get the vets and big dogs into it.

As hard as that sounds, it reaps a big reward.

Comment by Faruk Ates — Nov 29 2004 @ 10:57 am

Fernando,

I think the main problem in that is that very few people have found succesful ways to convert the experienced webdevelopers (the ones with experience but not aware of Standards).

Those people are often very stubborn in their ways, they like being “experts” and they don’t like being told that, actually, they’re making truly shitty sites and should re-educate themselves. :-)

The ones who don’t mind being told that are already among us, blogging it out for good measure.

Comment by Dustin — Nov 29 2004 @ 11:36 am

You’re definitely right.
I mean, these guys are professionals at what they do, they’re just doing it wrong. They’ve never been re-learned. I’d hate to call these guys ameteurs just because they didn’t fall into the standards movement.

But I commend those, however, who have taken the time to stay up to date with the times and keeping taps on the w3c’s recommendations etc..

Comment by Gregory — Nov 29 2004 @ 2:52 pm

I have built a few basic web sites over the years using Go Live 3 and 4. I read “Professional Style Sheets for HTML and XML” by Frank Boumphrey a few years ago, and these days tend to use BBEdit and CSSEdit to edit my sites (one built by someone exporting Word docs as html and importing them into Dreamweaver; what a nightmare!).

I’m struggling though. tools like CSSEdit make it so much easier to use css, and there are many sites describing css techniques. all the same, building a site from scratch is difficult when compared to the relative ease of using wysiwyg tools like Go Live.

in addition, I’ve found little mention of frames in css sites. BBEdit lists a doc type of xhtml 1.0 frameset but there is no frameset for xhtml 1.1. are css-savy people moving away from framesets too?

the browser incompatibilities and the hacks required to work around them is not something I want to think about. I’m not a professional designer. I’m just particular about my site design and understand the efficiency and long-term-ease of css. browser incompatibilities do not fit into my time table of learning.

from this intermediate user’s point of view, the best hope of general better web design with good use of standards and css depends entirely on wysiwyg tools. they will need to be updated. if we’re lucky, the current extremely complicated wysiwyg tools will be entirely replaced by new tools from new companies. applications from big companies almost never get simpler (Word anyone?).

nuff said.

Gregory

Comment by Fernando Dunn II — Nov 30 2004 @ 10:50 am

I mentioned the people who use the apps, but failed to remember about the apps themselves. I think Gregory struck gold. Perhaps the community should make a further push for browsers and WYSIWYG

Comment by Fernando Dunn II — Nov 30 2004 @ 1:15 pm

… I got cut off someone

Anyway I meant to say “Perhaps the community should make a further push for a standard support for standards in all browsers and WYSIWYG editors.

Comment by Ray — Dec 04 2004 @ 11:10 am

Gregory, yes CSS-folks are moving away from framesets.

They’re the 5th horseman of the apocalypse. I see nothing but usability problems with framesets. In fact, I think nothing epitomizes the junk-markup era more succintly than a frame-based website.

Trackback by The Tao of Webdesign — Dec 12 2004 @ 1:16 pm

Some more links…
While i’m writting the new article about “How to design a entire site using only 10 steps and CSS”, i leave you some new links for articles that worth a visit. Meanwhile i’m so busy with the MPIII Course….I’m now…

Trackback by Zepfanman Blog — Dec 20 2004 @ 4:17 pm

Web standards, usability, and accessibility
Web standards and the terms that go with it are unknown to too many people. This post is an effort to explain how and why we need to be designing better web sites.

Comment by Andrew Krespanis — Dec 21 2004 @ 8:02 pm

You’ve given me my new years resolution, Derek. I’m going to find my most hated ‘worst practice’ article with a high page rank and try to wipe it off the Google-map with an equiv. ‘modern approach’… Well, that’s the plan, anyhow. :)

Comment by Cheryl Colan — Jan 19 2005 @ 12:01 am

Derek:

you might want to check out the book that Julian Rickards authored (he told me that he's working on another one as well"¦). He's posted some details: Macromedia Dreamweaver MX Creating Web Pages, including the table of contents.

I keep meaning to come back and thank you for the link to Julian’s book. Instead I ordered Essentials for Design Macromedia® Dreamweaver® MX 2004 Level 1 & Level 2, also by Julian. The second in the bundle was set to be published January 15, 2005, but the kind folk at Prentice Hall graciously sent me a PDF advance copy so I could plan my syllabus. During the course of the last four months I have reviewed no less than 12 new titles trying to find one I felt good teaching from, and these books look to be the best out there rignt now.

Comment by Jules — Jan 19 2005 @ 6:00 am

Thanks Derek for the recommendation and thanks to Cheryl for the praise. It was my goal to promote standards and accessibility in my books (without deviating too much from the topic of the chapter) and it appears that my goal has been achieved.

Later today, I will post up-to-date information about my latest books on my web site for anyone else to have a look.

Comment by Jules — Jan 19 2005 @ 6:22 am

Oh yes, I forgot about this.

I was born in 1960 which means that I am old was in high school when Canada changed to metric units in the mid-seventies. Although I can use metric units with a fair degree of comfort, there are some measurements I have trouble converting. My weight (don’t go there) and gas economy. I am comfortable with 40 mpg but I have no clue as to whether 8.8L/100km is good or bad although I know it is better than 9.0L/100km.

A few years ago, I was in a local hardware store purchasing some shelving materials. The assistant in the department cut the metal shelving to my specifications and I took it up to the cash counter where (I learned later) a 16-year old girl was stationed. She asked me how long the shelving was and I replied “6 feet” (it was sold by the foot). She replied, “How long is a foot?” which floored me because I hadn’t yet run across anyone who had no concept of the old Imperial units.

It may be that in the future, we will learn about some developers who have never built a web site using tables and don’t know what frames are but that time may not have yet arrived.

Comment by Tom — Mar 06 2006 @ 8:46 pm

I really enjoy reading your articles. Keep up the great work.
TBoardenson