Web Site Coding Standards
Technical background: here we discuss internet-related coding standards, reasons for choosing a particular standard, or any standard at all, and the impact these decisions may have on a web site's business and future development.
HTML, CSS and Javascript
CSS can replace verbose HTML code formerly used to define web pages' layout. HTML is then freed to do as it was intended, to flag text with succinct codes to identify the text as, for example, a paragraph, a level-1 heading or a path to an image — but not to dictate what one of those things looks like or where it belongs on the web page. This results in greater separation of content from markup code, and typically makes both development and maintenance more efficient and affordable.
See also:
Generally, CSS offers a streamlined alternative to older, code-heavy methods of specifying design attributes. In general, a site employing CSS:
- requires less code, downloads faster
- may render faster in the browser
- can eliminate some Javascript, effects may execute faster
- simplifies updates and maintaintenance of both content and code
- adapts more easily for display on PDAs, mobile phones and other devices
Some developers, including External Design, sometimes use CSS as a replacement for common Javascript functions like image swapping. But CSS was never intended to replace Javascript, and tabular data still may be best represented using HTML tables. Each has its strengths and appropriate uses.
Not all browsers adopt the entire CSS specification consistently, but all major browsers' current versions offer good support of HTML 4, XHTML 1 and most of CSS 2. Some inconsistencies remain but, in most cases, fixes are simple or the differences truly are negligible.
Progressive Enhancement and Older Browsers
What is CSS? “Cascading Stylesheets”
Cascading stylesheets (CSS) faced initial, but short-lived, resistance from developers and site owners because of poor support for it in the web browsers of the time. Today, though, most web browsers comply to a great extent with official CSS specifications, and CSS is used widely to define the style and presentation of web documents. For many web sites, the adoption of CSS lightens the byte-load (of the pages we sampled) by about one-third to one-half compared to sites using older HTML-based methods of page design and layout. The first standard for CSS was formalized as a W3C recommendation in 1996.
Certain sites may be mandated or find it cost-efficient (due to ROI) to support very old browsers, which we may informally refer to collectively as "Netscape 4 and earlier" (NN4) or "Internet Explorer 6" (IE6). Even such browsers can benefit from a carefully coded, HTML-CSS site's content but, to make today's internet render correctly, such older browsers are more likely to need a web page to include coded workarounds or even reversion to an older coding style.
In earlier years, designers treated older browsers with the design principle known as "graceful degradation." Some page elements would not work or look good, but the content would remain at least marginally accessible. The oft-unspoken presumption was that users of older browsers were used to seeing a poor version of most sites, so a poor rendering would not reflect poorly on the site in their eyes.
At the time of this writing, users of minority browsers like those mentioned above account for only a small percentage of most sites' visitors, often less than 2%. Design philosophy moved from the days of graceful degradation to "progressive enhancement," which presents a well-designed web page to today's less-capable browsers, and with upgrades for browsers that have adopted the standards more progressively and accurately. It is considered poor practice to use proprietary or other code intended to only work in a single browser,1 because choice of browser is to be left to the sole discretion, preference and needs of the end user. And despite any eagerness to embrace new standards, developers mustn't consign users of yesterday's browsers to a less-functional or transactionally challenged shadow of the intended user experience.
1. Exceptions include institutional and dedicated systems where the hardware and software that is chosen may be controlled or mandated.
The fact remains that supporting older browsers requires additional design forethought and coding considerations, and may add to the time and cost of development. Site owners should evaluate the importance of support for very old browsers, and be aware of all the tradeoffs and foreseeable consequences before including them in the list of browsers to be supported by a new web site design.
HTML and XHTML
In general, we adhere to XHTML 1.0 coding standards, another activity of the W3C. Used with CSS, this can allow a web page to be designed for display on disparate platforms like typical desktop displays as well as on mobile phones, PDAs, dashboard devices and specialized browser clients for the visually and physically challenged. The XHTML code says, "This is a paragraph," and the CSS says, "A paragraph looks like this" in print, on the screen, on handhelds, etc. (As a very minor example, certain elements of this site — like the sidebar navigation — do not display when printed because we deem them irrelevant to that medium.) This site does not yet make full use of alternate devices, but adoption of the CSS and XHTML web coding standards will make that achievable with minimal effort when it makes business sense to do so.
Adhering to web coding standards makes it less likely to encounter cross-browser incompatibilities during development and, thereby, makes many projects easier to deliver on time. It also increases a site's likelihood of seamless transition as future browser versions are released.
To Validate or Not To Validate?
Online validators provided by the W3C, and perhaps other validation services, make it easy to test whether a web resource conforms to the standards. Is it necessary to validate your site's code? In general, no. Is it a good idea? Usually. Canny developers will use validators intelligently and, if it is appropriate and acceptable, may publish a well-tested web page whose code does not pass validation. They will be aware of the tradeoffs and act thoughtfully.
External Design’s Approach
Our work focuses on getting good results for our clients, including our client sites' equivalent look and functionality across computer platforms and browsers. We look at how many of a current site's visitors are users of old browsers. The site owner often can deduce how many of those visitors convert to meaningful contacts, so we consult with the client on how backward-compatible their sites need to be to achieve their business goals and the desired results from their investment.
In most cases, we now advocate a CSS+XHTML approach with Javascript and, sometimes, Flash. Tables may be used, but to a lesser degree and as tables in general are intended (i.e., for tabular or columnar data, and only quite rarely, if at all, for layout purposes). Inline style tags are more sparse and succinct.
Rationale
The XHTML and CSS standards improve accessibility and enable more-consistent, reliable performance from web browsers. They streamline the code, in the hands of experienced developers, thus reducing bandwidth and improving both developer and user experience. They also simplify content integration and maintenance, and lead to the development of web resources that are more likely to be compatible with future web browser releases. Dynamic content is more easily served because its markup can be freed of hand-coded style overrides.
In a Perfect World
We prefer to keep our sites free of workarounds that fix obscure rendering issues in specific browsers. But even some major browsers have CSS bugs, and some businesses must support users of browsers that were developed before today's standards were published.
The terrain is not as rocky as it once was, but still, it is possible to stumble. We work with each client to define the business at hand, and then adopt appropriate technical approaches to ensure a smooth development process and a reliable, effective result.
Contact
us for custom web site design
Soothe the savage beast with