So, one of these days, in the finals week, I decided, that instead of studying for my exams, I should read up some articles on Typography. After all, that's what one should do after one has spent the entire night typesetting one's resume that one has already submitted, before the exam day. What better way to escape from responsibilities than developing you aesthetic sense?
My exams aren't over, so I am still reading. Haha
So I googled, and came upon a number of nice looking polished articles. Finished one, the other one had links to four more, opened them up. Though 'Hey! This is cool stuff, I should bookmark it!' and discovered they were already in my bookmarks, and I hadn't read them. So I thought, might as well read them this time.
So one of them, is a very nice tutorial for beginners. I already know this stuff. But well, didn't I tell you about the important things to do before exam? Yeah...
So, this one site Interactive Guide to Blog Typography is an interactive type to blog typography. Hahaha... I mean it's really nice. As you can already see, all the rules the blogger mentions are already in place on my blog. But I will summarize them below. Why? I think by now you know better than to feel this curiosity.
Summary:
- Frame the content with whitespace
- Don't have distracting elements next to text
- Measure: 50~90 characters in a line are good for readability
- Leading should be 1.5em. For longer measures, increase; for shorter ones, decrease
- For titles, set tracking = 1.1
- Use one font. At most two
- For body copy, use fonts that are hinted (mathematically adjusted to be used on pixel grids)
- Use big enough font size for body copy. Recommended: 16px. I personally like 18px. Use even bigger for fonts with smaller x-height (like Crimson Text). Since I use such fonts, I guess that's why I like 18px
- Create Visual hierarchy with font sizes. Don't pick font sizes randomly, size2/size3 should have the same ration as size1/size2. Another designed makes the analogy of 'Font scale' with musical notes. Either they're in harmony, or discord. So choose wisely. You can use modularscale.com
- As in print, don't use the darkest black. Use like #444 or #222
- Use small caps. But in cases where they don't exist, and you use font-variant (as in my blog) the problem is clearly visible, as the text appear lighter than its neighbours
No comments:
Post a Comment