Welcome!

Adobe Flex Authors: Liz McMillan, RealWire News Distribution, Maureen O'Gara, Yakov Fain, Keith Swenson

Related Topics: Adobe Flex

Adobe Flex: Article

Web Standards

The right thing to do

I've been involved in the Web standards community almost as long as I've been working on the Web, and I've long felt that designing to W3C recommendations is the right thing to do. It's easy to evangelize standards like XHTML and CSS, but when it came time to put my money where my mouth is for the redesign of my company's Web site, adaptivepath.com, my partners and I had a very frank discussion about whether the effort - and it would be a lot of effort - was really going to be worth it.

We had to ask ourselves, how important is standardization to an individual business like ours? Do Web standards give organizations a return on investment? Does the transition to XHTML and CSS make financial sense? The answer to those questions is yes.

Web standards help you:

  • Speed development
  • Simplify maintenance and increase opportunity
  • Open up site accessibility
  • Reduce bandwidth costs
  • Improve user experience
Speed Development
So many of our clients have spent numerous hours building multiple versions of their sites, attempting to present a perfect design for as many users as possible who may be viewing their sites on any variety of browsers and devices. For every new design, there is an increase in development, QA, and maintenance time. We wanted to spend less time managing the site and still ensure that it rendered properly on available browsers. With over 95% of our audience now visiting our site with standards-compliant browsers, we knew it was the perfect time to make the switch. Using Web standards, we were able to achieve these goals by developing only one set of HTML pages and one stylesheet.

Adhering to Web standards forces you to error check your code to ensure it complies with the level of standards you've selected. Simply declaring which version of HTML (or, for that matter, XML) you're using will let you validate your pages against those specifications. Running your pages through a validator like the one available in Dreamweaver MX 2004 or x (online tool of choice) can save you an enormous amount of QA time. Before you even open the pages in your target browsers, you can run the validator and see exactly where your errors are. This reduces the time developers spend on QA and gives your site incredible consistency between browsers. While current browsers still have rendering bugs, they are far less severe than they were five years ago.

Simplify Maintenance, Increase Opportunity
For years, the standards community has been extolling the virtues of keeping visual design separate from content, but logically linked to each page. This clean separation makes it much easier for you to develop and maintain your pages for two main reasons. First, it makes the pages easier to update because of your content presentation such as type style, color, size, background colors and images, and even positioning of content blocks. Second, the separation of content and design corresponds to most teams' distinctions between design and editorial work, allowing the teams to work in parallel rather than sequentially. A nice by-product is code simplicity. This structure requires you to depart from coding pages with HTML in favor of XHTML. Your files become ridiculously simple because most XHTML pages are little more than a collection of semantically rich <div> and <p> tags, with a pointer to a powerful CSS file.

Recently, we hosted a CSS file for a client on our development server while they began production on content and back-end systems. As we continued to iterate the design, we were able to simply edit the file without having to integrate with their versioning and release system. By working in parallel, we dramatically reduced the time-to-market.

Using this structure also lets you immediately react to visitor feedback. Once your site is in production, you'll likely decide to change some aspect of the design - the size of your headlines, for example. If you had embedded the style information in each content page, it would take hours or even weeks to adjust the styles. But by using CSS standards, you can change thousands of pages by modifying a few lines of code in one file.

Speeding development and maintenance is a competitive and financial advantage. Shorter development times not only reduce costs, but free resources sooner, thereby increasing opportunity.

Open Up Access Options
Clean code pays even more dividends. Browsers that don't offer compliant CSS implementations can now simply skip the style. In other words, semantic XHTML markup can be rendered in any browser - including nontraditional clients like mobile phones, PDAs, voice interfaces and screen readers, and anything else that supports the most basic tag set.

A standards-compliant site that is coded for simplicity solves problems with mobile access, Section 508 accessibility, and past-version browser compatibility.

So you get all that and it's easier to develop and maintain? Indeed. You can even eliminate some hard costs in the process.

Reduce Bandwidth Costs
When we stripped away the fonts, tables, and little images used as design elements on our home page, we reduced the size of the code from 20.9K to 9.2K. Now, this may not seem like a lot, but it would aggregate to quite a bit if our site generated heavy traffic.

Our 56% reduction in bandwidth usage is hardly relevant to a site that gets a few thousand page views a day, but large commercial sites get that much traffic in a minute or two. The most popular sites often get tens of millions of page views a day.

Saving 30K to 40K from each page view - plus a cached stylesheet that never needs to be downloaded again - can save you thousands of dollars per month. Ever see an IT guy get excited about a new design? You will.

Improve User Experience
Cold, hard cash is easy to quantify, but there are additional benefits to slimming down code. It's no secret that a faster, more lively site will nearly always translate to a better overall user experience.

Huge interfaces squeezed through plodding modem connections have been a plague since the Web's inception. The increasing dominance of broadband has only helped a bit. A hotel phone line plugged into a business traveler's laptop may be the only tenuous link you've got to a new customer. Adopting clean, standardized code gives users a shortcut to accomplishing their goals at your site.

Justifying the Switch
These aren't formulas for determining the ROI of migrating to standards, but they are some pretty good financial justifications. "It's what all the cool sites are doing" shouldn't be your only point when arguing for a switch to XHTML and CSS.

The economic benefits of standardization are tangible: faster development, simplified maintenance, reduced bandwidth costs, improved user experience, expanded access and opportunity, and, of course, the assurance that Web users, regardless of platform, browser, or OS, can view content freely and consistently.... So what are you waiting for?

More Stories By Jeffrey Veen

Jeffrey Veen is a founding partner of Adaptive Path, a premier user experience consulting company. He launched HotWired.com in 1994, and is author of The Art & Science of Web Design and HotWired Style.

Comments (3) View Comments

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.


Most Recent Comments
Chuck R 07/22/04 02:34:32 AM EDT

ya... *type => typo

:) oops

Sunny Thaper 07/22/04 01:41:21 AM EDT

"Also... there is a type in the 3rd Paragraph"

Chuck R, don''t you mean "typo"?

Chuck R 07/22/04 01:38:48 AM EDT

This article is great - simple enough that I can help explain to non-web developers why standards are so important.

Also... there is a type in the 3rd Paragraph, 2nd sentence in the "Simplify Maintenance, Increase Opportunity".

It says... " Once you site is in production,"
It should be "Once your site is..." etc.. Same way in the MXDJ magazine too...

Just FYI - thanks