Not-so-masterful webmastering

This post has nothing to do with concerts or community or climate. Nothing to do with music at all. It’s a technical note about website structure. But as with so many endeavors, the core activity of this project—playing with and for people while encouraging climate conversation—represents a small fraction of the overall time and effort. Dealing with the site is one of many background activities that feel very foreground when I have to engage with it, so I’m documenting it here.

The Concerts area has become the heart of the website, containing not just the project map and info about upcoming performances, but also the ever-growing archive of past concert write-ups. Until yesterday, all the write-ups were part of one long webpage. As I noted before, as it gets larger, it takes longer to load, and this can make links to anchor tags (such as a direct link to a particular concert write-up) problematic. This is because lots of web layout is defined by widths, with height being a consequence of (say) how much text is in a given element. 

[You’re only halfway through this post. Really, no reason to read this if you’re not interested in webby stuff.]

Browsers can figure out the space needed for text almost instantly. However, when an image’s display is defined by width, the browser doesn’t know the image height until it’s had time to look it over, and thus doesn’t know how much vertical space to allot for it. This is why pages with lots of images may “chatter” up and down as the content fills in. 

It’s possible to define image height and avoid this problem, but it’s relatively complicated to do this in a way that doesn’t risk distorting the image proportions—not impossible, but fussy and involved, and time-consuming if there are lots of images of different aspect ratios. Even if I were to upgrade my web code to be super slick about image layout, though, the page would still be very long, unwieldy both to load and to edit. This was true already with only 20-some concert write-ups on the page; with hundreds, it would be a nightmare. 

So I made each concert write-up into its own separate page. This involved a bunch of routine slicing and dicing, but I also had to go into the JavaScript script that my former student Blaine Billingsley kindly wrote for the cool clickable map, so that the “more info” link for a given town would go to the new individual concert write-up page, instead of to the location of that write-up within the one ginormous Concerts page as before. Still really basic stuff! But not my home base, so it required me putting on my thinking cap. 

Even little things are not so little, everything takes time.