I was looking at the existing font that my personal domain is using (it is Open Sans that is locally hosted), and I realised I hated it.
The reason is simple: ``Il1''. That's a capital i, small L, and the number 1. They look like garbage. The inspiration for this realisation is from this Reddit post on Arial. Thanks to u/accideath's comment, I learnt about an awesome font face that is designed to make things more legible: the Atkinson Hyperlegible Font by Braille Institute of America.
I won't replicate the features of Atkinson Hyperlegible here (just visit their website to read), but suffice to say, I liked what I saw, and stupidly spent the past hour or so setting it up to replace Open Sans for my personal website.
Lazily, here's the comparison before my recollection of the process---left is the original in Open Sans, right is the new one with Atkinson Hyperlegible:
@font-face blocks in the main style sheet. It was after doing that and reloading the pages that I realise I needed to do some more tweaking.My baseline was the [then] existing layout that was already tweaked for Open Sans. Atkinson Hyperlegible is a slightly smaller font-face than Open Sans, and as such, the font-size needed to be increased enough to reach the legibility that I wanted. Strangely, the line-height needed to be backed down a little to reduce excessive spacing in between lines. As I compared the pages visually, I start to realise quite a few off points, and had to investigate further.
It turns out that there were many funny ``magic numbers'' that I was using to ensure things looked well with Open Sans that did not need to be done for Atkinson Hyperlegible, which is great, since it meant I could chuck it out.
I like how it looks now. Sure, it looked a little funky as compared to Open Sans, but it is definitely more legible now. It also gives the page a new feel as well, since the change of the main font is akin to a major design change.
That's all for now---I should go to bed. Till the next update.
No comments:
Post a Comment