After reading a lot of useless articles here on Designer News it's nice to hear a fresh voice with something valuable to say. Though I already knew what you were teaching, you come at it in a new way that is both helpful and compelling. Thank you for this!
The case for vertical rhythm can never bore me because very few actually follow it. I can tell you that some clients intentionally broke vertical rhythm because they felt their site looked symmetric [SMH]
The more articles on this topic, the better. Let's even have a NYT piece about it.
Always ready to write more about Vertical Rhythm. Especially implementing in on the web
Thanks for reading Jono! I'm glad it was helpful!
It has really been a while since I have seen an in-depth article about a practical design problem. Great stuff.
A small addition: I think it helps to pick a smaller unit like 7 or 8 because it allows for more fine-grained control.
This is SWEET. Really sweet. More people should know about this! :D
You want to talk about vertical rhythm?
Wake me up when the web has reliable control over the font file’s vertical metrics
… Well, unless you are NYT and you can basically have your font files custom-drawn and engineered.
… But even if you have control over the font file, browser implementation of interlinear spacing calculation is horribly inconsistent, mainly because it was intentionally left vague in CSS standards, causing browser vendors to do their own things.
You have to embrace the idea of approximation. I understand your pain but you have no control over browser or device rendering.
I'm not saying that you should give up the detail but try and find a happy medium; being able to accept and work around these nuances.
I've gone from pixel perfect rage to a state of zen where I can let certain things go. It's a good place.
I fully understand that I have no control, and I do agree with you that it is approximation.
This article in discussion, however, is precisely built upon that an ideal, exact world, in which, for example, setting margins and paddings to multiples of the same pixel value in CSS is applying vertical rhythm.
For me, vertical rhythm is achieved first and foremost in the mockup, and then realized as closely as possible in code.
This is the theory. There's the implementation that's yet to be covered :)
Well put. I spent the last few weeks trying to explain to a client that this was one of the reasons that their documents looked so clunky and cluttered.