Niles Johnson

Some notes about design aspects of this website, which I couldn't find a place for elsewhere.

This website uses Cascading Style Sheets (CSS) to control the fonts, colors, and layout. This enables the same content to be presented in different ways. For now, I have just two stylesheets; click the name to switch between them and see which you like best. For a more stunning demonstration of CSS, check out the CSS Zen Garden (this is really worth the visit).

Hopf (default): The default style is inspired by the Hopf fibration. The head image is derived from the one designed by Ken Shoemake.

SOHO (alternate): The alternate style is inspired by pictures from the SOHO satellite. The main image is derived from one in the SOHO gallery.

H. Nav. (alternate): An experiment with horizontal navigation. In progress, but mostly usable.

Your choice of style persists throughout this website, thanks to a browser cookie. If you want to see what this site looks like with no stylesheets, use the No Style option.

I use a perl script to generate the html markup for this site. This isn't quite as efficient as server-side includes, but it works fairly well. For the style-sheet selection and some other things, I use javascript.

I'm especially proud of the javascript e-mail generator. This is what powers the "Display e-mail address" box in my Contact Info. section. For me, it solves problems with the other standard methods of including e-mail information on web pages (like writing out in words, or using an image, neither of which allow a user to copy and paste the address). The basic functionality of the script is like a password: you type the right password and the script returns the e-mail address. But this has to work without encoding the e-mail address or the password in the html or javascript (since spammers can potentially harvest these). So the script is actually a function which takes words as inputs and gives e-mail addresses as outputs. If you type the right word, you'll get the right e-mail address, and if you type the wrong word, well, actually there's a failsafe built in.

The script computes the md5 hash of the input (two hashes, actually), and compares this with a value stored in the script. The md5 hash is a function which takes arbitrary strings of words as inputs, and returns a 32-digit hexadecimal number that has no apparent relationship to the input. This way, even though the script doesn't know the password, it can tell when the input is right! If it is, then the script returns the corresponding e-mail address. If not, then you get a little error message.

Eventually I hope to have a little demo here. Until then, feel free to just look at the source file (which isn't documented very well). Note: it is true that md5 is "broken" from a cryptographic standpoint. As reverse lookup becomes easier and easier, perhaps I'll have to switch to another hash function.

Unless otherwise specified, all content is copyright Niles Johnson, 2008–2012.

You're welcome to use code from the html, css, or javascript if you want (that's how I learned, after all :) If you end up using substantial pieces without much modifications, it would be nice to have some credit, but I'll probably never find out anyway!