style:defaultalt 1alt 2

Web Design Methodology

 <<< index of About…

Sections

Background

The design of this web site, tstotts-dot-net, follows several basic principles that are often overlooked by web developers:

While these principles are observed by many of the open source community and more conscientious corporations, they are still largely ignored by the average web site designer. Whether standards non-compliance is due primarily to developer ignorance, the whims of marketing teams, or the extreme deficiencies of Microsoft Internet Explorer, the lack of technical methodology in areas of the web design profession yields a long list of problems for users and developers alike.

This site, tstotts-dot-net, is always formatted with the latest W3C recommendations, which are currently XHTML 1.1 and CSS 2.0. Additionally, proper rendering—within reason—is verified for each popular web browser, including Internet Explorer, Firefox, Opera, Konqueror, Safari, Links, Lynx, w3m.

My personal favorite browsers are Konqueror and Links. As such, the aesthetics of this site's design are especially tuned for rendering by the KHTML engine, while maintaining legibility should content be flattened in black-and-white console browsers.

Separation of content and format

This site separates its content from the formatting at two levels. First, the site is authored in XML as tagged data, without any formatting. XSLT 2.0 is then used to statically translate the data into structured XHTML 1.1, the most recent and strict standard for the description of a web page. Second, the XHTML 1.1 code, which contains only the display organization of the data, then references multiple CSS 2.0 style sheets to format the page for rendering in multiple styles.

Kudos to Huge Sparks for introducing me to XSLT with his article XML Web Pages Without Tears. All of the XSL templates for this site originated as rip-offs from his tutorial, but now bear little semblance after years of design and refactoring.

Minimization of dynamically generated content

In many cases the content of a web page is static—viz., the content is edited solely by the web site author(s), and not by any audience interaction. Even the so-called blog of this site is static content, excepting some minimalistic PHP commenting software that facilitates limited user feedback. It is only common sense then—provided the necessary tools—to render most pages as static content, circumventing a plethora of performance and security concerns associated with serving dynamic content.

The Java application Saxon-B 8 is use to generate the static XHTML pages of this site via XSLT. The complete process of generating the web site from XML source is automated with GNU Make and a handful of tiny Bash, Perl, and Python scripts.

Additionally, the encrypted and watermarked PDF documents, GnuPG signatures, MD5 hashes, etc., are generated off-line in a semi-automatic fashion such that the content is readily available in static form.

Minimization of frivolous multimedia

My regard for Flash is extremely low. In my opinion, requiring a Flash plug-in to view a web site's main content, when that content is largely textual information, is often a simple excuse for designers (or managers) failing to develop technical skills much beyond word processing. Additionally, Flash-only sites exclude non-mainstream and slower platforms from viewing the web site, posing potential problems for even the most highly skilled developers who work in heterogeneous computing environments.

Multimedia of any form also presents issues for individuals viewing the web from an atypical browser, such as an embedded device (cell phone, PDA, etc.), alternative OS/architecture, or text terminal. Multimedia has its purpose; but substituting content for excessive visual effects diminishes the accessibility of an on-line web site, not to mention potentially compromising its long-term value and maintainability.

Finally, animations, logos, and button icons, especially animated GIFs, are omitted from this site for various reasons. (Excepting a single logo for the site as a whole.) See Web Site Inhibitions for a discussion of rationale.

Compliance with recognized web standards

Addressing the need for quality standards, where standards are applicable, is a basic concept for any process that can be rightly termed as disciplined design or engineering. Whether standards are ignored, used, or fully adhered to within a particular project can be a matter of cost effectiveness; but in a more ideal world, industry standards might hold some significant level of repute.

To read about the advantages of using web standards, take a look at the Using Web Standards FAQ. Also of interest are a few thought-out opinions on today's current implementations of Web technologies and standards.

To automate the process of verifying standards compliance, the WDG Offline HTMLHelp.com Validator is automatically executed locally to check each XHTML document upon updating the site. Likewise, an off-line copy of the W3C CSS Validator automatically verifies the style markup after any editing.

Non-dependence on proprietary browser technologies

This concept is very similar in rationale to the use of web standards. The aforementioned articles discuss this topic also. No browser-specific scripting is ever used by this site. However, this does not preclude the fact of a browser not supporting a particular scripting function; for example, the “favicon” selection per alternate style sheet is only supported by a few of the more progressive browsers.

References

This page was last modified on Mon, 28 May 2007. © Copyright Timothy Stotts 2002, 2007. All rights reserved. ^ top of page
validate:  xhtml  css  rss  atomcontact:  email  xmpp <<< index of About…