Typography with Bibliotype

While researching the iPad book that I'm currently building I've been taking a closer look at Typography.

The first Smashing Mag Book says “Typography is the soul of design; it lies at the heart of visual literacy.” while Robert Bringhurst, author of The elements of Typographic Style describes it as “Typography exists to honor the content”.

In my experience so far I have found that it can make or break the book. With a few simple changes to the font-type, letter-spacing, font-height / line-height and padding to control the paragraph width you can completely change the readability of the book and turn it from a beautifully crafted reading experience to a bunch of words on the page

While there are many many tips and tricks to keep in mind when it comes to the Typography on your website, or within your iPad book in my case, I am still lacking a confident rant about the best practices, and will instead direct you to a few handy references I've found thus far.

Bibliotype

BiblioType is the name of this article and it gives you a kick start in typography when it comes to the iPad. I won't put too much about it because I really think it speaks for itself and can get you up and running faster with any tablet device.

I disagree with the “Best viewed on an iPad” badge (welcome back days of Netscape Navigator) but I will admit that it doesn't work great with the Chrome Browser on the Mac.

Blind Text Generator

Blind Text Generator provides you with an easy way to fill content out within your dummy pages, but also provides a handy interface to set your typographical style for the <p> tag.

The simple options allow you to update the type of dummy text, the number of characters or words, whether you want them in 1/2/3/4 or more paragraphs, and whether to include the <p> tags. The advanced options ensure you've got control over the style applied to the text, and you can see quite quickly and easily what the different options can do to the readability of the paragraphs.

For a more detailed version of this, and one that you can compare against each other (and admittedly one that I found while writing this article) is Type Tester.

Type Kit

Type Kit is a fantastic way to get the fonts you want to render on the web. They're so popular that they've got some of the biggest websites including Twitter, New York Times and Wordpress using their service. There is probably cheaper services out there, but for sheer performance, selection and ease of use I'm a big fan!

Tags:

Typography with Bibliotype by Justin Avery is licensed under a Creative Commons Attribution-ShareAlike 3.0 Unported License.