a static-site dh research archive

Breaking some rule or another

I’ve been on a static website kick lately. Last spring I got hacked on my old wordpress multisite install through a well-known third party forum plugin. That wasn’t fun. I decided then and there to go static, since php is a scripting language for security vulnerabilities.

So in May/June, I converted my personal site to a dynamically-generated static site using hyde. Hyde is a python site generator inspired by jekyll. It’s pretty damn cool, as I get more and more used to it. It uses jinja2 templates, and allows me to keep all my site content and what not under source control. To publish an update to the site, I simply push to my server with an update hook. I even figured out a usable workflow to manage multiple subfolder sites for my courses (for the Spring– here, here, here— ok, that last one’s not up yet). Each one of those has its own css, templates, etc.

Along the way, there were two domains still using php on my server, including an empty Omeka repository for my Bourbon Quito Project. I’ve been playing around for a couple of months with replacing that site with something else. I have tons of content for it, but I’ve had so many other things going on that I’ve never developed it. It’s quite ridiculous of me to put up an academic/DH site and leave it there empty for so long. I’m sure that’s breaking some rule or another about agile web development or something. But, the genesis of Bourbon Quito Project was to make an individual research archive for a book, if not something more. Turns out that when one is hand-keying transcriptions, building such an archive can take a long-ass time.

Design for this dummy

My static-site-fever was stoked by working on my Honors Historical Methods class for the Spring semester using a hyde port of twitter’s bootstrap toolkit. It’s based on a 940px grid, and comes with all sorts of ready-made css loveliness. It’s not hard to make beautiful, contemporary-looking sites with topbar navigation, nice typography, and a variety of layouts. There are also ready-made javascripts for nifty effects if you’s like to use them. Most of all, it helps someone like me with zero design chops.

While playing around with the toolkit, I thought it might be fun to reinvent the Bourbon Quito Project as a static site. The workflow would make quite a bit of sense. When I transcribe a case, I do so in textmate using markdown. It would be simple to simultaneously publish the transcription to Bourbon Quito Project, as it would be keep push it to a mercurial repo. There are some issues to work out, though. And, with the bootstrap toolkit, it wouldn’t be to hard to make the site look intentionally designed. I decided first and foremost that I needed to change the color scheme a bit as well as the font set. Twitter is, of course, full of sans-serif goodness. I prefer my fonts seriffed. (I know this isn’t necessarily preferred web design, but for me serif fonts communicate permanence in a way that sans-serif fonts do not. And, this is a research archive.) So, I resorted to my favorite serif font with Garamond, using google’s web fonts, for paragraph text. Headings use IM Fell English, which has a particularly attractive Q with a long tail. I minimized twitter’s black/grey/blue color scheme in favor of pale yellows and reds present in an iconic 1734 map I cropped for the header image of the landing page.

I think it looks nice– much nicer than the lame css hacks I’d done on the previous omeka incarnation of the site. But design was only one of the problems I’ve been thinking through, and posed by the use of a dynamically-generated static site.

Interactivity?

In putting together my course sites using hyde, I’ve had little problem in accomplishing the interactive features I used to rely on php for. Some of it is javascript, and some of it is outsourcing. On the course front, what kinds of interactivity do I really want? I want a comment system, a calendar, forms, and a feed aggregator to point to student posts on their own blogs. For the former, I followed many sites both dynamic and static, and outsourced to disqus. The calendar, forms, and feed aggregation are available through google apis, and easily embedded. I was especially happy to find a solution for aggregating feeds, as the feed-wordpress plugin was one of the things keeping me in wordpress. But, the issues for my research archive are a bit different. What do I need to accomplish?

  1. Full-text search.
  2. Photo Gallery for Manuscripts.
  3. More granular comment capability for blog/chapter posts.

Search is the complicated one here, but there is probably a solution with Tapir (if not google site search). For granular comments, there is Highlighter. Both of these solutions lack permanency– they’re dependent on third party services. But, for now I’m OK with it. That’s because I’m also working on a django app behind the scenes that will replace this whole shebang on heroku some day. But, I digress.

Aside from outsourcing comments and search, I found a great solution for the photo gallery of Manuscripts that mirrors the development workflow of the main site. PhotoFloat is a very nifty set of python scripts that takes a folder (album) of photos, produces thumbnails of various sizes, and constructs a photo archive and viewer with javascript. It lives locally on my machine, and I sync the results with my server at for the manuscript archive.

The photos I have from my archive collection trips are quite large at more than 3MB each. That’s way overkill for the web. So, I wrote a small python script that takes a folder of .jpg files, reduces their quality to about 800KB, saves them in the appropriate place of for processing by PhotoFloat, and then runs its scanner to make the thumbnails. Then, it’s as simple as syncing with the web server.

What’s the point?

There are so many great CMSs out there to manage a site like this, why not use wordpress, drupal, or omeka (the top three for DH projects)? Static sites are fast and use very little RAM. In getting rid of the php from my VPS at dreamhost, I’m averaging 80-90MB of RAM for like 4 or 5 domains. It’s cheap to run such a server, and while now I’m using Apache2, it’d be simple to switch to nginx for even more performance improvement. It’s more secure. I write everything in a text editor, and manage it with source control. I deal with all my pics through the command line. Static site generators like jekyll and hyde score you some geek points. But, more importantly, I feel like I have a better grasp of the mechanics behind content management.

And, it’s fun.

About

Associate Professor of Early Latin America Department of History University of Tennessee-Knoxville

Tagged with: , , ,
Posted in Digital History, programming
2 comments on “a static-site dh research archive
  1. ctb says:

    I should add– given that static sites take us back to the 90s anyway, it seems apropos to have bourbonquito.com permanently “This site under construction.” Just need to put a caution tape, animated gif banner up.

  2. […] posting to wordpress.com using markdown, using easygui for pythonic historians, and on making a static-site digital history archive. I did a series of posts (here, here, and here) on integrating Google Tasks on the command line. […]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

parecer:
parecer:

Hacer juicio ú dictamen acerca de alguna cosa... significando que el objeto excita el juicio ú dictamen en la persona que le hace.

Deducir ante el Juez la accion ú derecho que se tiene, ó las excepciones que excluyen la accion contrária.

RAE 1737 Academia autoridades
Buy my book!



Chad Black

About:
I, your humble contributor, am Chad Black. You can also find me on the web here.
%d bloggers like this: