The various files making up this site were constructed with a variety of "Open Source" tools.
This particular set of files were largely created by hand, using the emacs text editor on Linux. There are a number of "modes" available for emacs for special purposes, one of the HTML authoring modes was used here. When you go to "markup" a section, emacs will only show you the markup elements which are legal at that point of the document.
Besides having the emacs lisp function for this installed, you also need the various DTDs for the types of information you intend to markup. In general, it is best to use a "strict" DTD when creating information and a "loose" DTD when interpretting someone elses work. In order to access the DTD, all you need is something like:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
As the first line of the file. Emacs will parse the DTD to learn its contents. This then controls how emacs will assist you in producing the remainder of the content.
The background graphic (periodic table) started as a SVG (Scalable Vector Graphics) image with sodipodi (2 elements). Once the XML source was generated, a perl script was used to place all of the text for 110 elements. The perl script can be found here.
Since XHTML is more structured, and is often rendered faster by browsers, all HTML files are being converted to XHTML at this site. HTML Tidy is being used for this.