How do you maintain the visual balance in your design when the length of your headlines vary dramatically? A long headline will naturally demand more attention than a short one because it takes up more space on the page, skewing the visual balance.
YouTube offers an interesting solution. On YouTube’s video pages, short headlines use a font size that’s approximately 10% bigger than the one used for long headlines. In other words, YouTube adjusts the scale of the headline depending on its length.
The headline to the left is approximately 10% bigger than the headline to the right. By adjusting the scale of the headline relative to its length, YouTube makes sure the headline draws just enough attention to itself. Long headlines don’t overpower, yet short headlines don’t drown either.
This is a great way to maintain the visual balance of the page even when the length of the headlines vary greatly. (An additional benefit is that this approach will ensure that more headlines will stay on a single line because long headlines are rendered in a smaller font-size).
The idea of adjusting the scale of your design elements to the amount of information they contain is interesting, and can be very powerful – especially on sites with multiple editors (or millions, in the case of YouTube).
This opens up the notion that, in a time of user generated content, our designs must be alive and adapt to the information of each page on our site.
Share your thoughts in a comment.
