Bootstrap 2.0-based design

Redesign

This is phase two of the new site.

I’m using Bootstrap. It is an incremental improvement to the last design.

What’s new?

Using Bootstrap changed much of the markup, but I’m focusing on user-visible changes beyond alignment changes.
Better navigation on touch-devices.
Bigger photos — all photo sizes are bigger than the old site.
More pleasing grid view layouts. It is trying to balance dealing with photos in varying ratios and sizes with having a regular enough layout to scan.

Development notes

Each time I revisit the design of the site I go back over almost every page to look for and fix formatting bugs. Sometimes I’ll fix or remove dead links or insert updates. Each time I think about making significant edits or deletions for posts that are no longer relevant. How much of a blog is historical [and thus should get just enough editing to ensure things still work] versus being a living document [and thus obsolete posts that do not have enduring value should just be removed or rewritten]? I don’t know. For now I tend to leave things mostly as they were written. As the now continues to recede from the then I will need to contemplate this. Eventually I’ll probably purge a lot of the old content — particularly the content that web logs and searches suggest nobody has linked to.
Having a redesign in progress just paralyzes other writing. It’s easy to say “I’ll finish that post once the redesign is done”…
I’ve made further use of jQuery.
I tried out Supersized but could not get it to work well on collections of more than a dozen or so photos. This was not usable by me because I want something that could apply to any collection of photos on my site.
Now using Isotope to do layout of photos in groups.
Using isotope and some new sizing code for the multi-photo pages to try to generate a more pleasing grid view. I’m leaving the detailed layout to isotype but helping it along by ensuring all “grid view” photos are one of four sizes. A “cell” is 300 by 200 and photos may consume up to 2 cells high and wide. A photo is forced into the size closest to its natural ratio. If it’s “close enough” then it is distorted a little. If not then the photo is automatically cropped or matted.
The rendering scripts are simplified.