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
over 1 year ago
Additionally - I refrained from using OpenType features as it wasn't suitable to the magazine-ish layout I was aiming for.
Nice one, Jordan.
I'd love to see the heading in a chunkier weight to create more contrast between it and the blockquote.
I'm really enjoying Magneta for body copy at the moment (although it thins out a bit at small sizes).
Nice job, man.
Get your filthy hands off my Abril, you cad
keyboard shortcuts: ← previous shot → next shot L or F like
Show and tell for designers
What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.
Copyright © 2009–2014 Dribbble LLC. All screenshots © their respective owners. Shipped from Salem, Mass. USA.