This is a very old article. It has been imported from older blogging software, and the formatting, images, etc may have been lost. Some links may be broken. Some of the information may no longer be correct. Opinions expressed in this article may no longer be held.
This site has had a few facelifts recently. Hopefully this one will stick. It’s based on two main principles:
Use Hoefler Text for copy. It’s an absolutely gorgeous font which comes with Mac OS X that I was recently using on a printed document. Hoefler has a delicious set of italic glyphs — they were properly designed in their own right — they’re not just sloping versions of the roman (non-italic) glyphs. It also uses ascending/descending numerals, which look a lot nicer in the normal flow of text than block numerals do. Garamond and Georgia are reasonable substitutes when it’s not available.
The Guardian (newspaper, not website) looks good; copy it! That’s where I got the idea for the small blue “TobyInkster.co.uk” heading at the top of each page.
I’ve combined this with a few other minor ideas:
Numbers and bullet points from lists hang into the margin. The last couple of versions of my site did that too.
Use classical ratios for font sizes. Assuming your browser default text is 12pt, then the main heading for each page is 36pt, sub-headings 24pt, sub-subheadings 18pt, and sub-sub-subheadings 14pt. Small text is 9pt, 10pt or 11pt. Headings on the side column are 14pt. Of course, if you’ve changed you have a different text size for your browser, then all these should scale accordingly.
I’ll probably make a few changes to the comments form, but I do rather like this look, so hopefully no big changes for a while now.