Type Set Match Experiments

Not so much theory behind this one, this was based more on my own visual preferences based on the theme. I like how Abril Display works at wide widths and when paired with the publication-friendly Magneta they seem to work quite well together.

I hacked a drop cap into the canvas by using the strong tag - as I have recently learned: they don't work too consistently across different browsers (and operating systems it seems), but hey, we're having fun here right? And on that note, I used a lowercase "c" from Abril Display simply because it's nicer than the uppercase variant in both Abril and Magneta.

I tried to keep to the modular scale based on 16px and the golden ratio both vertically and horizontally, so I used rems frequently to ensure different font sizes would adhere to the scale in relation to their spacing and relationships between each other.

The multiple columns caused concern when adding the blockquote, the baseline alignment between columns was knocked off slightly so there is some negative margin work in there to realign the baselines (again, the live version could be slightly off across different browsers). And finally I used Tim's previous tip for text indenting to align the drop cap with the left edge.

Live - http://beta.typecastapp.com/jordanmoore/share/a7927980c76913c8721d3a51adfe09232195c271j

keyboard shortcuts: previous shot next shot L or F like Z toggle zoom