We are a bunch of tech geeks, coders and designers. Read more ...


« Great Typography Formula for Web Design

Admittedly, we have not always done well with the typography in our web designs and we are continually working at it. One area that does not have to be as difficult to get right is “measure” or the length of a line of type.

Ideally, the measure should be somewhere between 50 and 80 characters long. We have not always followed that, unfortunately, and anything longer than 80 starts to get difficult for the viewer to read. Even this post you are reading right now does not follow that rule perfectly. Hey, I am being honest here :)

To achieve a good measure, the designer should consider adjusting the font-size and Robert Bringhurst came up with a great formula for that: Multiply the font-size by 30 to give you the acceptable measure for each line (font-size X 30 = measure). For example, if your font size is to be 12px, a good measure would be 360px.

Additionally, you could take the size of space on your design that is to contain type and divide that by 30 (font container / 30 = measure) to give you a starting point. So if your design calls for a 500px area of type, your font-size would be 17px. That, of course, is just a starting point. No one would want to read a paragraph of 17px text – yikes. You would probably want to find some ways to adjust that area in your design (pullquotes, images, etc.).
There are many rules and suggestions regarding typography in your design. This is just one area and we are going to try to post some other tips as we pick them up. We have found some really great guides and articles out there and will be compiling them into a post.

  • Share/Bookmark
your ad here