Web Site Technology

technology

This page provides a few brief, global remarks on some of the technology choices I made for this site, the tech notes page discusses some of the technical details.

Made with NotePad

This website was made with NotePad. Okay, okay, I admit that I used PaintBrush too.

I have in fact used several editors, and various tools, but this is not one of those sites created using a particular all-in-one web design package. When I started this website, tools supporting web standards-based design were rare. I did not want to evaluate many packages, so I forged ahead used NotePad and used several tools to validate the XHMTL and check for broken links. I have yet to settle on a web design package, mark-up validator or link checker I really like.

any browser

Eric Meyer: I'm going to say it right here and now: this site best viewed in browser X is shorthand for this site's maintainers are too lazy to think about standards compliance, user experience, or cross-browser design.

The Best Viewed with Any Browser button is the opposite of the many "Best viewed with Internet Explorer" or "Best viewed with NetScape" buttons still found all over the net. The Any Browser Button means that this web site was not designed for use in any particular browser.

This site is emphatically not best viewed with some particular browser. It has consciously not been build around any proprietary HMTL extensions or vendor-specific browser features. At any given time, some browsers will display this site better than others, but the site itself is browser-neutral; it is viewable with any browser worthy of the name.

Instead of supporting particular browsers and performing exhaustive tests with many browsers, I avoid browser-specific issues by complying with web standards.

Alas, that sounds easier than it is. In an ideal world, complying with web standard should be the easiest way to make sure a site works in every browser. The reality is that you still need to deal with browser defects and limitations. Web standards support is notoriously poor in Internet Explorer, still the most-used browser of all, and quite some trickery is needed to make Internet Explorer do the right thing. Some of this trickery is documented on the tech notes page.

web standards

World Wide Web Consortium This is a modern, standards-based web site. The site makes good use of modern web standards and uses nothing but web standards. All the technology and techniques used are standard, well-documented, freely available and widely supported. No proprietary technology has been used.

The site has been designed for web browsers that support web standards. Strict adherence to web standards does not merely alleviate browser worries, but actually turns the table back to its proper position; instead of me having to worry about supporting many different browsers, browser vendors have to worry about being able to display the site. I have heard that due to its rare combination of modern features, several browser vendors have actually added this site to their test suite of real-world sites. I like that.

It is way too much work to test it with every possible browser. It is way to much work to account for all the errors and limitations of older browsers. The site is tested with a few major browsers to make sure it works; practical testing is done using the latest versions of Firefox, NetScape, Opera and Internet Explorer. In addition to making sure it works in major browsers, the web site has been validated for compliance with the official web standards to ensure it works for the right reasons.

valid XHTML

This web site is valid HTML 4.01. It is valid XHMTL 1.0 Strict. It is even valid XHTML 1.1. It even really valid XHMTL 1.1; each page is a valid XML document that includes the XMl prolog and epilog, and specifies the correct content type. All the pages of this site have been validated as XHTML 1.1. You can click the XHMTL 1.1 button on the bottom of any page to validate that page now.

Unicode

Many web pages do not specify a character set all, in which case a browser will assume that ISO 8859-1 ("Latin-1") is used. Then again, many web pages that do specify charset="iso-8859-1" are actually coded using Windows code page 1252 ("Windows Latin 1"), and should specify charset="windows-1252" to ensure correct interpretation, but this mistake is so common that most browsers correct for it.

HTML 4.0 (1997) allows specification of any character set, and defaults ISO-8859-1 while allowing any Unicode character to be referenced numerically through so-called character entity references. XHTML (2000) is XML-based and XML defaults to UTF-8.

In Authoring Techniques for XHTML & HTML Internationalization: Characters and Encodings 1.0, the W3C specifically recommends using either UTF-8 or UTF-16, with a strong preference for UTF-8.

This site does the most compatible thing: it specifies UTF-8 as the character set (through both the XML prolog and the meta element Content-Type attribute), but actually encodes all characters not in UTF-7 as character entity references, to avoid recurring problems with conversions from and to Windows code page 1252 when editing these pages on Windows.

Portable Network Graphics

Portable Network Graphics Portable Network Graphics is a feature-rich and license-free web standard for images. PNG supports excellent compression without loss of data.

This site uses some partially transparent PNG images, something Internet Explorer 5 and 6 do not support. This Internet Explorer limitation was addressed by creating an Internet Explorer-specific extension, a HTML Component for PNG transparency.

This site uses Portable Network Graphics images exclusively; PNG is the only bitmap graphics format that's a web standard, and using a single format makes the bitmap images easier to manage.

JavaScript-free

This site is JavaScript-free.

JavaScript is not a web standard; Neither JavaScript nor ECMAScript is listed among W3C Technical Reports and Recommendations. The World-Wide Web Consortium has not endorsed any scripting language. The related W3C Document Object Model is language-independent, and merely specifies normative bindings for Java and ECMAScript.

More importantly, there are many variations of JavaScript and not all browsers support JavaScript. Even if browsers does support JavaScript, the user can turn it off; depending on a feature that is absent or turned off isn't good design.

Moreover, users should turn JavaScript off to avoid malicious scripts; Over the years, JavaScript has gained a deplorably well-deserved bad reputation as a security problem. I use and recommend the NoScript extension for FireFox to control JavaScript usage.

Cascading Style Sheets

This web site is made with Cascading Style Sheets; all layout is done through a CSS style sheet. Cascading Style Sheets is a web standard for layout of web pages. CSS was created by the World-Wide Web Consortium and is supported by all major browsers.

table-free design

This web site is table-free. Well, practically table-free, there actually is one table in a technote. There is nothing wrong with tables perse, but tables are meant for presetning tabular data, not for controlling layout. To put it succinctly; if it cannot be turned into a graph, it does not belong in a table.

Abusing tables for layout is not harmless; laying a web site out with tables impact the accessibility of the site.

This web site does not abuse tables for layout. All the layout of this web site is done through Cascading Style Sheets. That one table includes accessibiltiy features and its layout is controlled through CSS.

robots.txt: please index everything

The static nature of the site already ensures that any bit that anyone might ever search for has been indexed by all the major search engines. Still, the robots.txt file is there to make sure that each spider clearly gets the please index everything message:

This simplest of robots.txt file merely tells every user-agent that nothing is disallowed; it okay for the spider to do what it would do anyway if there was no robots.txt file: index everything. The same could be accomplished without a robots.txt file, but its presence makes clear that this really is what I want.

frames-free

This web site is frame free*You may notice a domain redirection frame. It is not part of the web site itself. The actual web site is frame-free.. Frames interfere with the back button of your browser - this web site does not. Web design guru Jakob Nielsen called attention to the fundamental problems with frames more than a decade ago in his 1996 December "Alertbox" column: Why Frames Suck (Most of the Time).

I continue to be amazed not only by the number of budding web designers that think using frames is a mark of professionalism, when it actually shows them to be lagging rather far behind. I am specifically amazed by web sites that still admonish me to "upgrade" to a browser that supports this already deprecated technology… The authors of such admonitions desperately need to get with the times, dump their broken browser detection script and upgrade to a frames-free design.

The World-Wide Web Consortium deprecated frames many years ago. The XHTML 1.0 standard discourages the use of frames, and XHTML 1.1 dropped support for frames altogether. Sure, XHMTL is extensible and you can add it back in, but its inclusion in earlier versions of HMTL is seen as a mistake, and it isn't part of the standard anymore.

Flash-free

frames-free The site is Flash-free. There is no flash file that takes ages to load. There is no superfluous intro page with yet another “skip flash intro” button to push. There is no need to install a browser plug-in. There is no need to close your browser to update a plug-in, and then navigate back just to view the site.

Flash is not a web standard. A Flash-site is not a website, au contraire, Flash is in fact even marketed as an alternative to web site building. Flash is a proprietary product developed by Macromedia, now owned by Adobe. Most of the things it is used for can and should be accomplished using web standards instead.

Few sites actually benefit from Flash, most Flash usage is detrimental to the site that uses it. Flash typically reduces usability, navigability and searchability of a site. Not only are many Flash sites unusable without Flash, Flash sites are often impossible to navigate by keyboard and impossible to read using text-to-speech tools. Their lower searchability implies a lower search ranking. If you must use Flash, be sure to do it right; check out the official Flash usability's pages to learn about using Flash correctly, but consider making a web site instead of Flash site first.

plug-in free

This site is not just Flash-free but completely plug-in free. You do not need any plug-in to view this site; no Flash, no Shockwave, no Acrobat, no RealPlayer, nothing. You do not need to download or install anything.

fluid layout

This web site has a fluid layout; it is not a fixed-resolution design, but one that adapt to available space. Just how big the browser window is, is up to you. You are free to resize it. Very large and very small sizes are naturally awkward, but there is no artificial limit either way.

When you change your browser settings, almost everything reflows automagically to let you view the site just the way you like it.

fonts

This web site does not require any particular font to be installed. In keeping with classic typographic wisdom, the design uses serif fonts for body text and sans-serif font for headers only. The style sheet was designed to take advantage of some well-known fonts found on Windows and MacOS systems, but will degrade gracefully to alternative fonts if the preferred fonts are not available.

oh so free

This is a very free site. It is not just JavaScript-free, table-free, frames-free and Flash-free, it is also ActiveX-free, Java-free, add-free, counter-free, webbug-free, pop-up free and cookie-free.

no pop-up windows

There are no pop-up windows to annoy visitors. The handy hover notes*This is a hover note. that make so much more sense than footnotes appear only when you select the footnote mark and disappear as soon as you focus on something else.

no cookies

This site does not use cookies. There is no need for cookies, so it does not use them.

Check out cookie-recipes.net for some tasty cookie recipes.