Line Height

Wrong kind of line height.I know, it’s been a while since I’ve written. Don’t worry, though, I don’t have a lot of time so I don’t plan on rambling a lot in this post. I’m going to talk a little bit about line height, explain some general rules, then give a brief explanation of why they’re important. I’m doing this because most people are bad at setting line height.

What is line height?

If you’ve ever had to type a paper, you’ve probably had to write it in double space. That setting  in Word (line spacing) is what we’re talking about. It’s the distance between each line of text in a paragraph. It’s usually called line height or line spacing (in CSS it’s called line-height:)

The trouble is that most people set their line-height entirely too low. The usual reason is to save paper (or space on the web). The problem is that the more you cram text together, the harder it is to read. Take a look at the hastily-created illustration below.

Line Height

I don’t know if you can see it or not, but the easiest text to read there is the text set to 21px line height. There’s a lot of sciencey stuff that goes into why it works that way. I’m not really going to talk about that. Just understand that the rule on line height is that it should be 1.5x your font-size.

When should you ignore this?

As with most rules, this is more of a guideline. You may want to use a higher line height when working with light text on a dark background (like I did with a recent catering website). You might want to set it higher for serif fonts than for sans-serif fonts, because the fancy serifs may require (or kindly request) more room to breathe. You should also always use whatever your teacher/professor asks for.

You can use a lower line height if your working with all capital letters (not too much), or if you’re working with odd fonts and it just looks better. Larger type can also require less line height.

Why’d you write this?

You might have been doing it right all along, I dunno. For the most part, though, people tend to get this wrong. You’ll typically see line height set entirely too low, either to save on space or because it’s the default setting. Adjusting your line height is a really simple thing to do and can make a big difference. Give it a shot.

I told you this post would be short. I kept it under 500 words.

Share and Enjoy:
  • Print
  • Twitter
  • Facebook
  • MySpace
  • Digg
  • Sphinn
  • del.icio.us
  • Google Bookmarks
  • StumbleUpon
  • Mixx
This entry was posted in Graphic Design and tagged , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

  • rss twitter email contact
    whattheblindsee wallpaper newtheme under construction