In a nice follow-up, my post on random sampling with D was highlighted on Reddit, where content-wise it seems to have been very much appreciated.

Unfortunately it also uncovered a serious problem with the site’s readability on mobile phones. So, cue some reading up on responsive web design and some intensive tweaking of the site’s CSS. This should hopefully improve performance and usability of the site across all devices and screen sizes.

Among the changes made are:

• Progressive tweaks to layout design as the screen width shrinks, designed to ensure that there are never clashes between page elements.
• Removal of the embedded web fonts. Much as I love the Linux Libertine and Linux Biolinum font families, having them embedded into the site was costing lots of bandwidth and meant the site loaded very slowly indeed on some browsers (e.g. Google Chrome would need to wait for the font to download before displaying any text). Linux Libertine and Linux Biolinum are still requested by the CSS, so if you have them on your machine you’ll still see the best face of the design; but I’ve made careful secondary font choices that are likely to cover all platforms and will still keep the site looking good.
• The use of SVG files for the site’s stylistic graphics. These are smaller than the PNG files used previously and should work on all modern browsers. They also allow me to size all elements of the page in relative terms rather than being tied to a particular resolution. (Actually, I did try doing this ages ago in an earlier iteration of this site, but abandoned it because browser support was not widespread enough. Fortunately things have changed…)

There remain a couple of niggles. The site’s drop-down menus seem unsuitable for use on touchscreens; I’ll have to do further research into an appropriate solution here. [Update 2012-07-27: should be fixed now.] There’s also a seeming possibility that the top-of-screen search box will either wrap or otherwise clash with other page elements on the smallest screens. Nevertheless, this website should now be substantially more usable on small-screen devices.

Feedback on the effect of these changes is welcome, as is advice on how to iron out any niggles :-)