How this site is built

This site is hosted and version-managed on github.

These web pages were mostly written using Gvim and Intellij CE on a Debian GNU/Linux system. All HTML is valid HTML5. To verify this, feel free to click on the "HTML 5" icon underneath the navigation bar.

The visual style and page layout attributes are completely kept outside the HTML code in a CSS3 compliant stylesheet. To work around a few bugs and CSS standard violations of Internet Explorer 6 and older, some old IE specific CSS had to be used, too.

The layout structure is defined using HTML "div" tags and is table free, except for the presentation of tabular data. The layout is meant to "flow", i.e. scale nicely when the browser window or the screen font is resized. All dimensions in the layout are specified as "em" (units relative to the current font size) instead of using absolute pixel values.

To let the page width grow with the content but keep it readable, a CSS "max-width" setting has been used. Since Internet Explorer 6 and older do not support this attribute, a workaround was put in place that emulates "max-width" for those old IEs.

The CSS3 attributes border-radius and box-shadow are used for rounded corners and shadows of the navigation bar and the content section. IE8 or older do not suport this, so unfortunately with those non-CSS3 browsers the look of this site is a little more bland.

To have the CSS code validated against the World Wide Web Consortium standard, just click the "CSS 3" icon on the left hand side of each page.

The navigation bar is implemented as an HTML "iframe". This allows the reuse of the navigation bar on all pages, without the need for any server side page generation. The style settings for it are in a separate stylesheet.

The iframe is embedded in an HTML "div" with the CSS setting "position: fixed". This causes the navigation bar to stay in the same place when the content is scrolled. Unfortunately Internet Explorer 6 and older do not implement this CSS feature, but modern browsers like Firefox, Seamonkey, Opera, Safari, Chrome and even IE 7 and later support it nicely.

All images on this site are PNG files, mostly created and/or edited with the GIMP software package. PNG transparency is used in several places. No GIF files were used since they allow only a limited number of colors. JPG files were not used because of lacking transparency support.

Usually, Internet Explorer 6 and older do not support PNG transparency. I use this PNG fix, developed and distributed by Angus Turnbull at twinhelix.com to work around this deficiency.