Typography in blog design

Brauereigasthof
Creative Commons License photo credit: Bundscherer

This post is a part of my Elements of great blog design series.

This is the first post of the series and today I’m dealing with somewhat general topic - typography of blog design. First things first - I do not know almost anything concerning typography except that I really enjoy simple, clean, modern fonts and being not too original at all my two favorite fonts are Helvetica and Futura. This post will be a good chance to do a research and to get more knowledge in the subject.

Lets start with the basics. And check out what wikipedia says about it. And here it is:

Typography is the art, craft and techniques of type design, modifying type glyphs, and arranging type. Type glyphs (characters) are created and modified using a variety of illustration techniques. The arrangement of type is the selection of typefaces, point size, line length, leading (line spacing) and letter spacing.

OK. Now that we know what typography is, lets get down to business and check out this great article from Freelance Folder by Lois Knight titled Typography Essentials. Can you imagine a better title of an article for us to start? I can’t. In that article Lois talks about really basic stuff like naming of specific parts of fonts and font alignment. As I said it is very basic but a great place to start. Lois ends the article with a few tips to using typography right that are quite useful.

 Now we move on to more advanced stuff. Over at Colour Lovers Steven Snell presents a great article Color and Typography in Good Design in which he discusses more advanced topics like font size, line height, choosing font color and its background and my personal favorite: contrast. Check out this part about contrast to know that he knows what he is talking about.

When choosing colors for typography contrast should be one of your major considerations. Contrast applies to the font in comparison to the background as well as in comparison to the other font colors. If you are using contrast between two font colors, using the one color sparingly will have stronger impact by drawing attention to fewer words.

Further in the article Steven discusses particular issues that right typography might come in handy and some problems with readability of the text in cross browser environment. All in all it is a great article offering very interesting information on how to actually use the right font and what to focus on when designing your next project.

Now lets think about that steps you need to take in order to get proper font styling to your blog design. Remember, we are aiming here for nothing less than awesome.

  • choose the right font for your design. Is simple Helvetica enough for you? Or maybe you need something more fancy and swirly? Now is the time to think about it
  • decide on font size. Do you want a big size blog title? Big post tiles? Or maybe you want to keep things small and minimal? Think about the readability of your posts. Choose the size to make your content easy for eye scanning.
  • determine proper line height. With too little space text might seem cluttered and not readable. With too much each lines might seem not visually connected to each other.
  • think about right colors and resulting contrast. Check if font colors and font backgrounds provide good readability and go well with overall design.
  • test. Check everything. See how this type renders in different browsers, in different resolutions with different text. After that test again :) 

Where to go from here? Well, don’t worry, I’ve got you covered. Check out the following resources in the subject of typography and stay tuned for the next parts of the Elements of great blog design series.

 

 

Share this post:
  • Digg
  • StumbleUpon
  • Technorati
  • Reddit
  • Slashdot
  • del.icio.us
  • Wykop

About this entry