Found a wonderful toy to add to the redesign of my Website.
The key takeaway from the article was use meaningful modular scales in setting your font sizes so that there is proportion and balance as fonts scale.
The article came with two toys:
- A website where you can play with modular scales.
- A repo containing a nifty Sass plugin to automate the process of using modular scales on your site.
The latter was quickly coopted and rolled into my stylesheets.
The first thing I learned in playing with it all is that the golden ratio is not a good one for scaling fonts, even if it does look pretty on the proof sheet. It grows and shrinks too fast. But mixed with an augmented fourth, it provides three wonderfully balanced steps for H1 to H3 elements. There is even a nice sized gap for those who desperately need H4s for whatever reason. Besides, how often do you get to use the ratio of 1:√2, the epitome of musical dissonance?
In other news, after using Sass for two years, I finally read a book on it. And now I know how little of it I was using. On the other hand, both the Drupal and WordPress Sass plugins are not comprehensive. I may have to set up Compass locally.