How to make a list

rogersgeorge on March 11th, 2012

This lesson, class, is partly about typography and partly about technical writing. It has nothing to do with groceries. We have two kinds of lists. In HTML they go under the tags <ol> and <ul>, ordered list and unordered list. Before HTML, we called them numbered lists and bulleted lists.  In both cases, each list item is its own paragraph. Yes, I’m aware of a third kind, items buried in the narrative of a paragraph, with or without numbers. Today we’ll ignore that kind of list. We have several schemes for numbering items in a list, particularly numbers or letters, and a dozen variants on outlining, ways to show levels of indentation and subordination. Here’s the key rule for numbered lists:

Never use a numbered list unless the order of the items in the list is important, or unless the number of items in the list is important.

The Ten Commandments is an example of that second kind of numbered list. Even then, numbering them didn’t quite solve the problem. Look up the Ten in a Catholic Bible and in a protestant Bible. The numbering is slightly different. Betcha didn’t know that, didja?

These are the numbers one through ten in Hebrew. If you want to see the two versions, look ’em up. It won’t hurt you.

The most common reason to number a list is because you’re describing steps, giving instructions. You’re supposed to preheat the oven while you prepare the other ingredients, so that instruction is often first, even though you might not actually use the oven until later. Here are basic rules on how to write instructions in a list:

  1. Tell a single thing to do in each step; use the imperative.
  2. Tell what happens if the reader follows the instruction correctly. Use the present tense.
  3. Show a picture that shows the correct result.

Sometimes two things go together so naturally that they count as one (“Type your name and press Enter.”) The result doesn’t have to be a separate sentence; if the result flows naturally enough, it can go after the instruction in the same sentence. (“Put your hand over your heart to show sincerity.”) And sometimes you can’t think of a way to picture what you just told your reader to do; you can leave the picture out.

If you can, break up the instructions so you never have more than nine steps.

Three don’ts:

  • Never start an instruction with the results of the previous step.
  • Never put the result ahead of the instruction.
  • Never put what not to do in an instruction. Put proscriptions in an aside, note, caution, or warning.

And that leads us to bulleted lists. Bullets are small shapes that make it easy to see the beginning of each list item. Sometimes bullets are called dingbats, and sometimes dingbats are called ornaments. Bullets are the simplest of the three, and ornaments are too fancy to use as bullets; they are used for decoration, to signify the end of a section of text, for example. Google “typographic ornaments” to see what people did before they had television.

Dingbat. Usually they are smaller than this, about the size of an M.

Now for a bit of typography. How much should you indent a list item? That’s a matter of taste. I like to align the bullet with the left edge of the paragraph above the list; many people like to indent the bullet the same distance as the bullet is from its list item. Just don’t overdo it. A quarter inch is a great plenty. How far apart should the list items be? A smaller distance (called leading, by the way, because lines of text used to be separated with strips of lead) than the distance between normal paragraphs. The list itself should be separated from the normal paragraphs by the normal paragraph amount. For example if your paragraphs are 12 points apart, start the list 12 points below the paragraph above, separate the list items by 6 points, and resume the normal paragraphs 12 points after the last list item. There’s more to all this, but that should get you started.

Subscribe to this blog's RSS feed

For the typographers among us

rogersgeorge on March 1st, 2012

A while back I touched on the subject of page layout. 100% of the people who commented expressed interest in having me go into more detail on the subject. That task has been on a burner ever since, and eventually I’ll be posting a couple posts on the subject.

This post touches on something related to page layout, word layout, or kerning. Kerning refers to setting the space between letters so they look the right distance apart. Back in the days of hand-set type, the letters looked rather like rubber stamps on rectangular blocks of metal (the body of the type). Some letters were so far from rectangular that they looked too far from one or more of their neighbors. So the typographers made the letters extend a bit over the edge of the body. This was called a kern. Two letters that need to be kerned when they are next to each other is called a kerning pair. Look at the A and W in the top example below. The AW pair looks too far apart, even though the bottom of the A and top of the W are exactly lined up.

Many electronic fonts these days come with kerning pairs built in. Kerning is tricky because it is so subjective (it has to “look” right) and the correct kerning varies depending on the font size.

Font management software exists that allows you to fine tune the kerning on your own. Can you see the difference between the middle and bottom examples? Think you might like to try your hand at some manual kerning? Here’s a link to a site that lets you manually set the kerning. The first example shows you the correct location of the letter that needs to move so you can practice using the direction keys. It gives you a score after each word. Beware: they get harder as you go along.