Yet more adventures in web development
I have, once again, redeveloped this website. I think it’s slowly getting better each time. The change this time was rather radical: I reformatted the site’s html files as org files, an emacs major mode. To explain what I did, let give me quick overview for those who don’t know much about web work. I am particularly interested in static sites, sites that are dynamic documents. I’m not talking about “web applications”, sites that do some computation or present some user interface or form.
Modern web sites have essentially three pieces: the content, the style sheets, and the scripts. The content, first, is the actual text that the author compeses. It is stored in a “marked up” form, which indicates to the computer where the paragraph, section, and article breaks are; it indicates which text is a header, which a link, and which the table of contents. In short, it tells the computer the structure of the text according to the meaning it has to the human: a human can easily see what the headers or paragraphs are, but the computer needs to be told explicitly. The traditional language for this on the web is HTML, the hypertext markup language, in one of its many iterations.
Second, the style sheets tell the computer how to present the document: what type face, color, weight, and size should each element in the marked-up text have? How much space on the screen should it take up? Where should the margins be? Ideally, this information is kept completely seperate from the marked-up content, which is marked only for semantic structure and not at all for appearance—in other words, you mark up the text to say “this is a heading”, but you don’t give any information about how a heading should look; that’s what the style sheet is for. The traditional language for this is CSS, cascading style sheets, so called because more specific styles are inherited from more general styles.
Finally, the scripts tell the web browser what to do with the document. This is the most open-ended part of the suite, since it is a fully-functional programming language. The core of it, though, is the DOM, the document object model. This allows a program to access and manipulate the computer’s internal representation of the structure of the document, as described by the marked-up content. The program can hide or show elements, or insert or remove them. On this website, there is a script that tells the browser to display the blog posts one at a time, even though they are, in fact, all in one document. Press the ? key to see the possible commands. The traditional language for web browser scripting is ECMAScript, also known as JavaScript.
The change I made recently was to stop writing HTML, markup, directly: instead, I write org, which is much simpler to deal with but powerful enough to give me the structure I need to make the document work. Then I tell emacs, a text editor, to convert the org to HTML and then publish the HTML to the internet. Right now, you’re (probably) reading the HTML output of the org I wrote. This saves me a lot of time, since I don’t have to explicitly write the markup: I just write the text roughly as I intend it, and org does the rest.
The styles on this site are still a little wacky: this is where I am weakest, since web styling pretty much reduces to graphic design. I copied the colors from another site I thought looked good, but it’s still not quite where I’d like it. Similarly, the scripted navigation isn’t quite right: I still have to play around with the script (the excellent org-info.js) to get it to do what I want to do. Also, the navigation is still a little weird. And there’s more content I’d like to put up, so there’ll be more to navigate to.
But I’m happy with the change to org—it makes it much easier to write and publish the posts, and that’s what I wanted. Now there’s slightly less friction between my writing and your reading, which seems to me like a pretty good thing. More imporantly, I’m learning a lot about maintaining what is now a real, though small, site. There’s some interesting questions of how and what I’m doing, and where I’m going. I’ve reached a pretty healthy feedback loop, though: I have a site, so I write for it; I have writing, so I have to maintain the site. It’s an upward spiral. Thank you for coming along for the ride with me.
