I am finally (nearly) happy with the design of this site and how it responds on different devices. It has taken a lot of tinkering, but thankfully there are now (free!) tools that can help.
For part of side project I’ve been working on (a bit of web site building), I’ve been trying to use Ruby for automated photo set page production. One of the crucial steps in this workflow is scaling down the original images ready for the web. Sure - I could use nearly anything to achieve this, even Automator, but it would be cleaner to have this task as part of a single build task that I can call via rake. Also, I need a solution that can be cross platform.
This must be one of the most common first posts for a site that has just started using Jekyll, but I’m starting to get a workflow together that automates a lot of the mundane tasks that arise from using a static site engine without being able to use plugins.
I was debugging this site using the Chrome “Inspect Element” option (which is just amazing), and noticed the huge amount of whitespace that was in the HTML generated by Jekyll. Going by this bug report the engine is not smart enough to exclude whitespace between lines of code. I have seen extensions that claim to be able to solve this, but as I’m hosting on GitHub I need to keep to the standard install setup. I had a thought of how to solve this, and it works surprisingly well!
An updated solution is available.
While I’ve not had a huge amount of time to devote to building this site, I have got stuck down a few rabbit holes exploring some of the amazing improvements in web technologies and the power that CSS 2+ provides. This site uses many (and possibly too many) ideas and projects I’ve stumbled across in the last couple of weeks. As a side note, I have been deliberately avoiding using Jekyll Bootstrap because I wanted to do the research and coding of the site myself.