The Way Forward With Web Standards

This page is here for archival reasons. It is quite out of date.

Abstract

Even though Web standards are being embraced by many Web authors, some businesses are reluctant to invest in standards-based Web sites without concrete reasons to do so. To help Web authors interested in advocating Web standards, this article assembles arguments and information about Web standards into one document and explains Web standards in terms of how they affect business. After outlining what Web standards are and how they are used, the article clearly demonstrates that adopting Web standards can improve many aspects of a Web site, such as: the amount of bandwidth used, load times, providing a foundation for accessibility, device independence and quality assurance processes. The article refutes several negative myths about Web standards and describes strategies for embracing standards. This article will lay the foundation for further research by MACCAWS into the nature of the business benefits of Web standards.

Status of this document

This document is a working document. If you have a review, comments, suggestions or any feedback, please contact the MACCAWS Research Group.

MACCAWS is indebted to contributors and reviewers for their ideas and their enthusiastic participation.

Contents

Introduction

Are you creating a Web site? Perhaps you are already the owner of several, or maybe you are involved with the process of creating, developing or maintaining a Web site. If you are new to standards, you may wish to first consult our Standards Primer (link to come).

The use of Web standards is fundamental to the development of Web sites. In this article, we will:

  • explain why it is in your organization’s best interests to implement Web standards,
  • outline steps that you can take in order to achieve standards-compliance and make it part of your process,
  • present concepts that are non-technical, non-proprietary, and apply to all manner of Web sites, regardless of their size, function and complexity.

Standards and the Web

Standards exist to ensure quality products and safe usage for almost every kind of product and many procedures that we encounter on a day-to-day basis. For instance, in much of the world, it is standard that a red traffic light means stop, an orange light means caution, and a green light means go. These standardized rules help to ensure that all vehicles can proceed safely — regardless of what type of car, who is driving or where the vehicle is going. Without standards for traffic lights, driving would be much more chaotic than average rush-hour gridlock. In the same manner that all existing standards dictate how to build and use products and procedures, Web standards define how each of the various technologies associated with the Web should operate in order to provide a sound and stable platform.

Most commonly-used Web standards

HTML, XHTML and CSS are three of the most widely-used standards on the Web today. In this section we will discuss the origins and the nature of development of these specifications. You may wish to skip this section, but we recommend taking a little time to build an understanding of these technologies and become familiar with their history.

HyperText Markup Language (HTML) and eXtensible HyperText Markup Language (XHTML)

HTML is a markup language for Web documents. As it evolved, HTML became a specification for describing the structure of documents. HTML provides a way to create a document from components such as headings, paragraphs, tables, acronyms and quotations. A different technology, Cascading Style Sheets (CSS), is responsible for the presentation (or “look”) of documents.

New HTML specifications are no longer being written. HTML 4.01 is the final HTML standard, and is now superseded by XHTML. Authoring in XHTML is not substantially different from authoring in HTML, but it does offer enormous business benefits, especially for more complex applications. As XHTML 1.0 is a redefinition of HTML to conform to the rules of XML — it is both HTML and XML. This means that with XHTML you can take advantage of the wide adoption of HTML, and the power to manipulate information with XML.

Cascading Style Sheets (CSS)

CSS was developed to provide a simple and easy way to define the presentation of a Web site. While HTML defined the structure, CSS was responsible for the “look and feel” of a site. Using CSS, a Web author can define presentation elements (the layout, fonts, colours, etc.), independently from the markup of Web content. Style definitions can be defined in a completely separate document that many Web pages can refer to. A Web author can change colours and layout by changing only the style sheet(s) without the need to alter each Web document that is affected. The ability to affect many pages and even the layout of a Web site by changing only a few lines of code is what makes CSS such a valuable technology.

CSS has the advantage of allowing styles to be specified for different kinds of media including:

  • browsers,
  • printing,
  • personal digital assistants,
  • cellular phones and
  • wireless media.

CSS gives you the power to make your Web pages suitable for different types of devices without having to create additional HTML pages.

Other Web standards

HTML and CSS are only the tip of the iceberg in terms of the Web standards that are currently in use. Many other standards operate at different levels of the infrastructure of the World Wide Web and the Internet. For example, HTTP (HyperText Transfer Protocol) is a standard that works behind the scenes, dictating how Web content is served over the Internet. While you may not need to be familiar with all these other specifications, it is a good idea to get acquainted with some other more significant Web standards so that you will have these in your tool set — and be better equipped if the need arises in future projects.

Other commonly-used Web standards include the DOM (Document Object Model) and ECMAScript (standard Javascript)

The XML Family

You might have already heard of XML (eXtensible Markup Language), a standard that is the core of a large family of related technologies. These include:

  • XSL (eXtensible Stylesheet Language) — a family of recommendations that describes how XML documents should display . Also facilitates the transformation of XML documents into other formats
  • RSS (“Really Simple Syndication”, “RDF Site Summary” or “Rich Site Summary”) — a popular set of formats for syndicating news and Web sites . All RSS standards currently in use are XML . RSS 1.0 is also RDF.
  • SVG (Scalable Vector Graphics) and SMIL (Synchronized Multimedia Integration Language) — multimedia and graphics standards. Using SVG animation in combination with the DOM can be equivalent to Flash ; however it is accessible and better semantically structured. SMIL is a language that allows you to combine audio, video, images, and text to build time-based, streaming multimedia presentations.
  • XForms — a way of creating forms on the Web where the functionality and presentation of the forms are defined separately. With its definition in XML, a particular form can be configured to look differently; it can look like a classic XHTML form, or otherwise.

XML is also one of the means to implement RDF (Resource Description Framework), a framework for describing relationships between resources using specific vocabularies (“ontologies”) . RDF allows us to use knowledge models we have in the real world to better correlate information for re-use.

Accessibility

Apart from Web technologies, standards also exist to ensure that Web sites and the tools for creating Web sites meet other quality criteria, such as accessibility and internationalization.

Accessibility guidelines exist for Web sites, and user agents. The following table summarizes the guidelines and the kinds of systems and software they apply to:

GuidelinesWhat they apply to
Web Content Accessibility GuidelinesWeb sites
Authoring Tools Accessibility Guidelinessoftware such as:Frontpage,Dreamweaver,and content management systems
User Agent Accessibility Guidelinesbrowsers,search engines,and other systems that consume information by displaying content, or by re-using the information for other means
Internationalization

While accessibility standards are in place to ensure the Web can be used by everyone, the internationalization effort aims to ensure everyone can use the Web in their native language.Important concepts and projects in the internationalization effort include:

  • Character encodingFor many years different languages have had a specific encoding associated with them. This meant that multi-lingual documents were not possible and communications between systems running in different languages were not seamlessly compatible. Unicode is a standard character encoding for all languages that is now widely adopted. Organisations such as the ISO and W3C are producing frameworks for internationalization, including guidelines for implementations at an infrastructure level.
  • Facilitating multilingual Web pages and Web sitesThis includes considerations such as:
    • bi-directional text,
    • ruby annotation (character annotations used to clarify the pronunciation often added to ideographic scripts such as Japanese),
    • number formatting
  • Localization considerationsLocalization considerations include such issues as:
    • cultural sensitivity in graphics and text
    • flexible forms that allow different address and naming conventions
    • political sensitivities

Standards organizations

The World Wide Web Consortium (W3C) sets many of the Web standards that are in use today. This consortium was founded 1994 by Tim Berners-Lee with the involvement of MIT, CERN, DARPA, and the European Commission. Its members include software and hardware vendors, governments, standards bodies, content providers, and research laboratories. Technical specifications, recommendations and other missives for the Web are produced through consensus reached by its members, with input from the public through open forums and discussions. The W3C’s mission and goals support a vision of the Web that is open, trusted, interoperable, decentralized, universally accessible and vendor neutral.

Other standards organisations include:

Some common myths

Standards do not sound particularly exciting, creative nor cutting-edge. In fact, the very word itself conjures up the idea of restrictions and the seeming lack of flexibility. It is unfortunate that the word has such negative connotations, because these misconceptions could not be further from the truth.

Let us tackle a few of the common myths one by one, after which, we shall look at the practical benefits of incorporating Web standards into your Web development project.

Myth #1: Standards make your Web site “ugly and boring”

The use of standards does not necessarily affect the look and feel a Web site. Claiming that standards make your Web site ugly and boring is equivalent to saying the specification for the composition of concrete has the ability to affect the look of a building — a claim that we know is untrue; the specification for the composition of concrete ensures that the structure of the building is sound, after which, we can decorate and furnish it in any way we choose.

If a building is well designed, it will be attractive regardless of the concrete that has been used in its walls. However, if the quality of the concrete is poor and does not meet standards, the building risks an unstable existence, with the possibility of crumbling. The same scenario applies to Web standards — they do not infringe upon how a Web site looks or operates. Standard-compliance ensures a robust Web site. If a Web site is ugly and boring, it is because the site has not been well-designed.

CSS Zen Garden showcases attractively designed CSS layouts.

Standards don’t just apply to code, there are also standards for the more visual parts of the Web. Some exciting new standards have been developed for animation and graphics. These new standards include: Scalable Vector Graphics (SVG), Syncronised Multimedia Integration Language (SMIL), and Portable Network Graphics (PNG).

Myth #2: Standards increase development time

Experienced Web authors who are not used to coding to standards may require some time to become accustomed to new habits and paradigms. However, depending on the skill level of your Web authors, standards can actually decrease development time:

  • Standards-compliant Web sites can be much faster to develop and are more easily maintained if you are using markup specifications that work well with Cascading Style Sheets (CSS).
  • You will only need to produce one version of your Web site. You will no longer need print-friendly templates or browser-sniffers, or different templates for different browsers.
  • If you use authoring tools such as Dreamweaver or FrontPage, you will need to invest a small amount of time up-front in order to configure these tools to produce standards-compliant Web pages. Instructions on how to complete these steps are readily available. The steps are easily accomplished and will take no more than a handful of hours to complete. You will find that this time is wisely-spent and has near-immediate returns.
  • It takes less time to check standards-compliant code for accuracy and correctness, as automated tools are available to check sites.
  • As new Web authors join your team, they will not have to puzzle over implementation quirks and inconsistencies left by previous Web authors.

Myth #3: All of the visitors to my site use Microsoft Internet Explorer anyway

Browsers Change

While Internet Explorer has been the most dominant browser in use, it may not be in the future. At the end of May 2003, Microsoft has announced that they have ceased the development of free, standalone versions of Microsoft Internet Explorer. In July 2003, the Mozilla Foundation was formed to facilitate the development of its open-source browser, at the same time that Netscape’s browser development was discontinued by AOL. There are other browsers on the market that are freely available, the most well-known being Mozilla, Opera, Safari and Konqueror. Ultimately, users are free to choose which browser they wish to use; therefore, plan for flexibility afforded by standards.Other “browsers” that visit your site

In addition to visitors who use a personal computer, you may have other visitors that you are not aware of, such as search engine bots or spiders. Search engines typically run automated computer programs called spiders (or bots) that search through the text on your Web site (also known as “crawling” a Web site) in order to update their database indices. If your site is not available to bots and spiders, your content may not be so easily found via search engines.

Implementing your Web site according standards ensures that your content is available regardless of the medium that is used to access it. This has the added benefit of freeing you from having to cater separately for new and emerging technologies such as mobile Web browsing using a cellphone or a personal digital assistant (PDA).Browser Lock-in

If you are creating a Web site for an Intranet or a closed network, developing to standards means that you are not bound to a particular version of a browser and the technologies it supports. Imagine this scenario:

  1. Your company’s standard operating environment runs IE 4.
  2. The entire Intranet is built so that it works only on IE4.
  3. The Intranet is expanded and built upon year after year by department after department.
  4. Two years later your company decides to upgrade to Mozilla.
  5. You spend the next six months recoding your site so that it is not tied to any particular browser

Plenty of work could have been saved if your Intranet was built according to Web standards from the beginning. Web standards are designed to work across browsers and devices; if you have developed your Intranet according to standards, you will not have to spend additional time re-constructing your entire site.

Myth #4: It doesn’t look the same on all browsers

There is a little twist to this myth — it is in fact true on all counts. The myth lies in that many Web authors believe that Web sites should look the same across all browsers.

Web sites that have been designed to “look the same” run into the problem of being inflexible or unusable, for a part of your potential audience. When a user views a site, they may be:

  • using a computer platform of their choice,
  • using a browser of their choice,
  • visually impaired and require fonts to be large, or have physical difficulties with using a mouse,
  • browsing using a cellphone or a PDA that cannot render a graphics-heavy Web site

Building Web sites according to the CSS-based layout method means letting the browser do all the work — regardless of platform or device. Using CSS to its full potential enables you to create one version of your Web content, allowing devices and users to use the style of Web site that works best for them. If you try to make your Web site exactly the same for everyone, you run the risk of making it impossible or unpleasant to use for some people.

The benefits of Web standards

Now let us take a look at the benefits of adopting Web standards. Incorporating Web standards into your projects can:

  • lower your development costs
  • lower your maintenance costs
  • expand your audience
  • lower your hosting costs
  • increase your organization’s profile.

To fully take advantage of all these benefits, adopt Web standards to their fullest extent and employ CSS-based layout method.

Cost savings during development

During initial development

In the traditional method of building Web sites, the process of changing presentational elements (such as colours and fonts, or even page layout) would involve going through every Web page to make the changes, and might also involve changing hundreds of spacer gifs and other graphic images on the site. Prototyping and changing the design mid-development becomes much easier when the content and style are completely separated and CSS-based layouts are employed.

Web standards have been designed to encourage the separation of content and presentation, so changing one need not affect the other. When altering or adding content, your Web authors need not touch the presentational information; conversely, to change the look of your site, they need only alter the descriptions for presentional elements in the CSS.

Confusion and disorganization due to the coding differences in large development teams is minimized when all authors required to code to a specific standard.During redesigns

If you are employing CSS-based layouts and Web standards, and you wish to give the Web site a different look, it may be as simple as developing a new set of stylesheets and not the markup on each of the pages.

It is no longer necessary to use a templating system or an expensive CMS to change the presentational elements of a Web site. Whether you are changing the font or the layout of a Web site, if you have separated content and presentation, you can edit one CSS file to change all of the pages on your Web site.

A side-effect of incorporating standards into your long-term development process, is that your project will be much less dependent on specific habits of your Web authors. Further development work in the hands of skilled and standards-aware Web authors should be swift and efficient.

Cost savings during maintenance

Well-written, standards-compliant code is concise, clean and clear. For the average Web author, this means a great deal of time can be saved in the process of updating or altering content.

  • CSS-based layouts allow authors to add new features or change page layout without having to edit each individual page
  • Changes to colours or fonts a can be achieved site-wide very quickly – without the need to interfere with the content
  • Updating your site to take advantage of new standards or improvements or changes in browsers is easier when all presentation information for your site is on one page.

Using standards ensures that your Web site has the built-in flexibility for growth and change.

Day-to-day cost savings

Every little bit of data that is transferred has a cost. Depending on your hosting service, you may be paying for every bit of data your audience downloads. The less unnecessary information your Web site sends to your audience, the cheaper it is to run your site.

  • Significant cost savings are gained from the brevity and clarity of standard-compliant Web pages are the savings in bandwidth. Case-studies have shown that using CSS-based design, and separating the content from the presentation can reduce the weight of a site by 25 % to 50%. This also improves the user experience as smaller pages load more quickly.
  • When employing separate CSS files referenced by all of the pages of your site, server and browser caches ensure that the style information will be downloaded only once per user.

Both these factors contribute to savings in bandwidth, which means it will cost less for you to run your Web site, merely by using the available technology to its best advantage.

Growing your audience

If your site meets accessibility and internationalization standards and guidelines, your site will automatically be available to previously ignored audiences.

  • Efforts to meet internationalization standards mean that your Web site can be reached and used by people around the world. These efforts can also mean that when your company opens an office on the other side of the Earth, you won’t have to redesign the whole site to ensure it works in a new language.
  • By ensuring your site meets accessibility guidelines you may be avoiding costly litigation, or damaging complaints. Lawmakers around the world are including Web accessibility provisions in human rights laws or explicit laws that guarantee access (such as Section 508, The Disability Discrimination Act, etc). In addition to the legal ramifications, being accessible means that you are opening your business online to a greater audience, and hence opening the door for greater returns in the long term.

Improve your image, increase your returns

Adopting Web standards can be good for your business’ image. It may add to your operating costs in the short-term but it enhances your image within their community. By choosing to adopt Web standards you are telling your customers that you:

  • believe your content should be made available to anyone regardless of the technologies they choose to use.
  • refuse to alienate anyone based on what they use to access your site and under which circumstance — you care about each of their experiences.
  • ensure that your Web site is accessible to all and you open your business and your content to an increased audience.

Using Web standards is not only best practice and good corporate citizenship, it also opens up opportunities for a larger and more loyal customer base, which can only benefit your bottom line.

Being a few steps ahead of the game

Because few companies are aware of standards, have thought about their impact, or have invested resources into exploiting their benefits, there is an opportunity for you and your company to seize a competitive advantage.

Web standards are designed to be extended and added to and to work together with future growth in mind. Web standards are a sound and sensible way for you to invest in the future because they enable you to:

  • create Web development projects with room to grow
  • escape the risk of being bound to a proprietary technology that may become dated,
  • adopt best practices,
  • produce Web sites that are accessible to everyone,
  • produce Web sites that are usable on any device.

Seize the opportunity to beat out your competitors and adopt Web standards.

Embracing Web standards

Improving the layout of your Web site with Web standards

Web standards and Web design are related but are also quite independent. A Web site that does not adhere to standards can be made standards-compliant without affecting the design. On the other hand, using Web standards can give you more design flexibility and allow you to achieve layouts that are not possible with non-compliant layout methods.

Layout MethodAdvantagesDisadvantages
Table-Basedworks uniformly across most visual browserspossible to have a layout that adheres to HTML standardsmost table-based layouts are not actually standards compliantnot flexible enough to work across all available mediacontent could be unavailable to some users
CSS-basedcontent available across device media and platformsmaller file sizes and faster page loadsless bandwidth usagefaster development and maintenanceeasier to redesignand moreusers with older browsers may not enjoy the same visual experience as not all CSS renders correctly on older browsers,web authors may have to learn new coding techniques.
Table-based layout

The traditional way of designing Web pages is what is known by experienced Web authors as “table-based layouts”. When using this method, elements in a Web page — page titles, menus, graphics and the content — are all placed using HTML tables.Advantages

The advantage of this of table-based layouts is that tables have been around for a long time and work uniformly across most visual browsers; therefore you can expect the design to be consistent across computers.

It is possible to have a table-based layout that adheres to HTML standards.Disadvantages

Due to the lack of knowledge amongst Web authors and poor standards-support in most authoring tools, many such Web sites are not standards-compliant.

Unfortunately, table-based layouts are not flexible enough to work across all available media. Emerging wireless technologies and assistive technologies, such as screen readers, cannot render table-based layouts. This effectively means such Web sites could be unpleasant to use and inaccessible to a part of the population.

The CSS-based method

An increasingly popular method that skilled Web authors use today is to design Web sites without using tables for layout. This means that a Web author uses HTML or XHTML exclusively for the structural markup of the Web site, and uses one or more global CSS files to specify all presentational elements — including the placement of content.Advantages

One advantage of the CSS-based layout is its flexibility — the content can be accessed regardless of the type of browser that is being used. It allows Web authors to build sites that work on many kinds of devices instead of just the personal computer.

Other advantages include:

  • smaller file sizes and faster page loads,
  • less bandwidth usage,
  • faster development and maintenance,
  • easier to redesign,
  • and more.

These advantages have been discussed in detail in “The benefits of Web standards”.Disadvantages

The main disadvantage with CSS-based layouts is that older browsers, may not render the design in its full glory because CSS was an emerging standard when the older browsers were first released. With good use of standards, users viewing CSS-based Web pages through older browsers will still access all of the content; these users will simply have a different visual experience. Most modern browsers today such as Mozilla, Opera, Konqueror and Safari have no problems with CSS-based layouts. Microsoft Internet Explorer, arguably the most widely-used browser, is able to render most CSS-based designs, but even the latest versions have inherent faults with CSS support. We discuss this issue in the context of the myth: “It doesn’t look the same on all browsers”.

Another disadvantage is that many Web authors are not yet familiar with CSS-based layouts. It has taken time for browsers to correctly apply standards; as a result, Web authors who are new to the method must learn new techniques to achieve consistent design behavior across browsers.

Deciding upon a method

Both Web design methods can be standards-compliant, but in choosing which standards and which method to use, you will have to decide which method will bring you the best returns. To fully leverage the advantages of standards-compliance, we recommend that you take the plunge and adopt the CSS-based layouts, as this is the methodology that will bring you more benefits well into the future.

Choosing your standards

Choose a layout method

Earlier on, we described the two main development methods that Web authors use today: the table-based method of using HTML tables for designing page layouts, and the CSS-based method to layout pages. The table-based method allows Web authors to cater for older generation browsers at the cost of inflexibility in handling new devices such as cellphones and PDAs. The CSS-based method of Web design has added advantages of providing basic accessibility and interoperatibility, at the compromise of a simplified visual experience in older browsers.XHTML or HTML

Both table-based and CSS-based layout methods can make use of valid XHTML 1.0 Strict and CSS. Given there is no technical advantage in using HTML 4.01 anymore, we suggest that any new project you undertake should make use of XHTML, as this will allow you to further handle different XHTML versions (for example, XHTML for mobile devices) with incredible ease. XHTML is only one small step away from XML, which will provide you with greater data management options should your information needs expand.

Some people would argue that there is no real advantage to using XHTML because most browsers in use today don’t handle XHTML differently from HTML 4.01. However, it is not more difficult to author XHTML compared to HTML 4.01. When all browsers can handle XHTML properly, there is only a minor change you have to make on your server configuration to make the switch. Therefore, it makes sense to author in XHTML now.

You can already begin to serve XHTML properly to clients that support it. Here’s how.Accessibility laws

It is in your best interests to adopt accessibility standards, the most generic being the Web Content Accessibility Guidelines. In the United States, the definitive Web accessibility law is Section 508 of the Rehabilitation Act, but around the world, the legal guidelines vary. The applicable law in the United Kingdom is The Disability Discrimination Act. It is worthwhile to spend some time investigating into which laws apply to you. Making your Web site accessible is good practice, it avoids legal trouble and it opens the door to more customers.

Demanding only the best

If you are outsourcing, or hiring external contractors to build your Web site, make Web standards a fundamental part of your project proposal or requirements document:

  • Take the care to specify the standards you want to use, and which versions of these standards you require — for example: you may want to request a site that uses XHTML 1.0 Strict, CSS 2.0 and SVG 1.1.
  • The issue of Web accessibility continues to draw public attention. You should require an accessible site that adheres to the Web Content Accessibility Guidelines and to your local accessibility-related laws.
  • If your site crosses national and cultural barriers, ensure that it can reach everyone and demand that your vendors or team produce a site that takes internationalization into consideration.

You have the right to require what you believe is in the best for your business in both the development process and the final product; ask for standards compliance.

Educate your team

Depending on the skill level and experience of your Web authors, they may or may not have heard about standards. You may get blank stares or cynical comments upon your first mention of Web standards.

Developers have been slow to adopt Web standards for several reasons:They have never been taught properly

The Web grew very fast and very fierce, as a result, many books and design courses were based on outdated and incorrect Web practices in order to cash in on the growth of the Web. This has severely compromised the skill level and knowledge of Web authors today.

Web authors may not know that things are changing, and if they are not paying attention, their skills will soon become outdated or are already outdated. It is important that your team be trained in Web standards because they are the ones who can ensure that your Web sites are well-oiled and run smoothly. You must train your:

  • development team,
  • design team,
  • project managers,
  • maintenance team,
  • quality assurance personnel,
  • content producers

The tools they use don’t produce standards-compliant code

During the fast and fierce early growth of the Web, tool vendors were more interested in securing the market than generating quality Web sites. Consequently, many Web authoring tools are based on a flawed understanding of HTML and outdated authoring practices. If your developers have been using tools that are not standards-aware, it is only understandable that they have never been exposed to best Web practices.

You can find tools that will help you and your team adopt Web standards. The latest version of Dreamweaver MX implements CSS to a very high degree, allowing the CSS-based layout methods to be achieved with ease. It sounds like a lot of hard work, but the most difficult task is probably educating your team, and then providing them with authoring tools that generate standards-compliant code.”It’s too difficult”

Many Web authors have learned one way to create Web sites and found that they haven’t needed to change because browsers and user agents have been extremely tolerant of invalid and unstructured HTML. As a result, a subset of Web authors are not willing to learn new and better ways of creating Web sites. You may also experience cynicism from some Web authors who have found CSS difficult to work with because they believe in the idea of “pixel-perfect” design (see Myth #4). Poor implementations of CSS in some older browsers have discouraged some authors from adopting standards technology. However, modern browsers like Mozilla, Safari and Konqueror are standards-aware. Browsers, tools and developers are moving towards adopting standards.

Once you have educated and equipped your team, there are methods you can use to ensure your sites continually comply with Web standards.

What to do for existing Web sites

If you have an existing Web site we suggest an incremental strategy for converting your Web sites to be standards-compliant.

This strategy is explained and outlined in detail in an article entitled “Web Standards Switch” at the W3C Quality Assurance Web site.

You can integrate the process of moving towards a standards-compliant site as part of your regular quality assurance process by:

  1. deciding which standard to comply with, determining strategy to make the site accessible, how internationalization applies to the site and any other improvements that will be made to the site;
  2. analyzing your Web site against these criteria using the Log Validator — a tool developed by the W3C that aids in fixing the most frequently accessed pages on a particular Web site;
  3. deciding on a regular schedule to fix the 10 most popular pages on your Web site using the Log Validator. This way you will begin with the most popular pages and eventually work through your entire site;
  4. periodically reviewing the process to ensure that all the necessary pages are being converted to standards.

In this way, you can ensure that your site meets the quality standards you have elected to meet.

Catering for new Web sites

If you are about to begin a new Web project, then you are in the fortunate position of being able to start with a blank slate — you are in the best position to take advantage of Web standards.Make Web standards a part of the requirements for your Web site.

Whether you are developing your site in-house or contracting the project outside your immediate team or company, you will need to specify clearly which standards you have decided to meet. You may wish to consult the article released by the W3C QA Group titled “Buy standards-compliant Web sites“, that has a table of specific requirements you can use for inspiration.Add standards-compliance to your CMS requirements

If you are in the process of purchasing a content management system (CMS), consider adding standards-compliance as a point on your requirements list. If you have already purchased your CMS, inquire about add-on modules or modifications that create compliant code.Ensure that processes are in place to maintain standards-compliance

Maintain standards-compliance throughout each stage of your Web site’s lifecycle — design, development, testing and maintenance. Make sure that the tools used by Web authors and site contributors are able to create and maintain a site that complies with the standards you have chosen. For example, content authors using a CMS should be contributing standards-compliant pages. However, they may not have direct control over the CMS; this means your CMS must be tailored to produce standards-compliant code.

It is important to go beyond initial requirements to plan processes that will ensure that your Web site remains standards-compliant in the future. This is the only way to reap all the benefits of Web standards.

Converting Web sites in development

If you already have a Web site in development it may be more complex to change requirements. Extra costs and expanded timelines are always considerations when changing requirements. Don’t forget that using Web standards is a way to save money in the long run. It may seem cost-ineffective to integrate standards into your project because your contractors may penalise you for not having specified standards as original requirements, or it may appear to add more time to your project, but remember: the long term cost-savings will outweigh the initial resources you spend on improving your processes. It will also assist you in complying with accessibility laws and save potential legal costs for non-compliant sites. In the spirit of making a permanent change for the better, integrate into your Web development project, processes that support the implementation of standards.

If you are:

  • very early in your Web development — such as in your analysis or feasibility study phase — add considerations for Web standards now rather than later. It is a well known software engineering fact that the later you introduce a change, the more expensive it becomes. Integrating Web standards into your process early will save money and resources as your project matures.
  • midway through your project, for example, where some development has been done, and some design work has been completed, ensure that all development work and design work from now on comply to standards. At the same time, you may be able to introduce processes which will improve the parts of the sites that have yet to comply to standards.
  • almost finished, your best option is similar to Existing Web sites. Introduce the processes for ensuring compliance in your quality assurance phase and make standards-compliance a part of your maintenance requirements, so that any new content that gets published complies with Web standards.

No matter what stage you are at in an existing project, there are great advantages to adopting Web standards.

Validation for quality assurance

What is validation?

Validation is the process by which you check your Web pages for correctness. It is a sound, simple way to ensure that the your Web site is on the way to standards-compliance. As HTML and CSS are formal languages, validating means checking the HTML and CSS of your Web site against the formal grammar (called a Document Type Definition or DTD) — much like the way you check for spelling errors and grammatical mistakes in an email you are writing. There are many kinds of validation, but within the context of this document, we shall explore only HTML and CSS validation.

The tools to validate Web pages are known as validators. There are validators available for free from the W3C. These validators can check individual pages. There are other validators available (at a cost) that can check an entire site. However, the most up-to-date and definitive validators are from the W3C.

The W3C hosts HTML and CSS validators that are updated with current standards as they are developed. These can be found at:

Validation is part of effective QA

Problems such as unexpected behavior in some browsers or strange layout problems, may be occurring simply because the HTML or the CSS contains mistakes. Validating your pages to find and remove errors improves the presentation of your site across user agents.

Validation is:

  • the easiest and cheapest method of quality control for the underlying HTML and CSS of your Web site.
  • an efficient way to detect human errors.
  • a method to spot check your team’s work to ensure the quality of the their HTML/CSS .
  • a way to catch both common and hard-to-spot mistakes in the HTML and CSS – like running a business letter through a spell-checker.
  • the simplest way you can be sure that your Web pages are indeed complying with the standards that can be checked by automated tools.
  • notoriously good tools for picking up errors in your templates. If you detect and correct an error in your template you are on your way to improving the overall quality of your Web site.
Validation Saves Time and Hassle

Validation offers a solid way to investigate problems within a design. Running your pages through a validator allows you to quickly determine the problems by isolating which lines do not comply with the standards. While validators will not catch all problems, they will trap the glaring errors, enabling your QA time to be better spent on real problems rather than simple mistakes.

Understanding the validator output

If you have never encountered the W3C validators before, it may seem that the validators output incomprehensible messages. As it is merely an automated tool, a validator reports all the errors it finds, and provides an explanation. After fixing the first error and re-validating, you may find that the number of errors is greatly reduced. This is because each error that occurs has a chain effect and causes additional errors. After using the validators a couple of times, you will become familiar with the messages that describe your most common errors.

Taming authoring tools to produce standards-compliant pages

WYSIWYG (What You See Is What You Get) editors, such as FrontPage, Dreamweaver or GoLive, allow users to create Web sites simply and quickly. These tools are usually programmed to output proprietary, non-standards-compliant HTML and CSS – unless you make some modifications and change some preferences. With a small amount of configuration, most of these tools can be adjusted to produce compliant Web pages. In most of the applications, you can adjust the settings in the “Preferences” (or equivalent) to produce compliant code. In the cases where this doesn’t do the trick, third-party tools such as HTML Tidy and Lift Accessibility Kit are available as standalone or plugins to your software.

Dreamweaver MX can be easily set up to achieve standards-compliant pages. You can also make Dreamweaver 4 produce standards-compliant Web pages. Although FrontPage 2000 and FrontPage 2002 can also be set up to write compliant code, this is more complicated than configuring Dreamweaver MX. You may consider using Mozilla Composer, which produces compliant Web pages by default, and is available for free from http://www.mozilla.org.

Appendix

HyperText Markup Language (HTML) and eXtensible HyperText Markup Language (XHTML)

There have been several versions of HTML since the beginning of the Web, but for the most part, three versions are still being used in current Web development: HTML 3.2, HTML 4 and XHTML 1.

HTML 3.2 was created to capture the HTML-authoring practices of Web authors in 1996. HTML 3.2 replaces HTML 2.0, which codified common practice in 1994.

HTML 4.0 was released in 1997 and was revised with minor corrections in 1998 as HTML 4.01. The final version of HTML 4.01 was released in December 1999.

Along with HTML 4.0 and 4.01 came new approaches to Web design, including emphasis on accessibility, internationalisation, faster page rendering in browsers and better support for separation of presentation and document structure using Cascading Style Sheets.

Released in January 2000, XHTML 1.0 is a family of markup languages that reformulate HTML as an application of eXtenxible Markup Language (XML) 1.0. Bridging between previous versions of HTML and XML, XHTML is in the position to exploit the full power of XML technologies, while retaining the ability to present HTML documents in current Web browsers. XHTML 1.1 was released in May 2001 with small changes to specify the basis for future extended XHTML family document types.

There is very little technical difference between authoring XHTML 1.0 and HTML 4.01. The main difference is the cosmetic requirement for markup to be well-formed in accordance with valid XML. This makes it easy for Web authors already producing valid HTML 4.01 to start to author in XHTML 1.0.

XHTML 2.0 is currently under development and is steering Web documents towards purely structural markup, with presentational elements defined in Cascading Style Sheets. XHTML 2.0 will be better integrated with XML technologies; parts of (X)HTML may be deprecated or omitted in favour of XML technologies that have the same capabilities. The development of XHTML 2.0 is still in early stages, and much of the specification is yet to be defined.

Acknowledgements

Many thanks to:

The MACCAWS team of contributors: Tara Cleveland, Tony Crockford, Tom Dell’Aringa, Char James-Tanny, Rebecca Milot-Bradford, Dunstan Orchard, Ranjan, Francis Storr, Stephen Taylor, and Stephanie Troeth.

Reviewers: Stephanie Booth, Garrett Coakley, Maciej Ceglowski, Gordon Cleveland, Karl Dubost, Emma Jane Hogbin, Holly Marie Koltz, Ethan Marcotte, Judah McAuley, Rebecca Tierney-Hynes, and Olivier Thereaux.

Credits

This document has been compiled by Stephanie Troeth and edited by Tara Cleveland and Rebecca Milot-Bradford.