How to Make Your Content Attractive and Effective

You've read all the rest, now read about the 'why' and 'what for' behind design concepts.

There is nothing more important than creating content that is easy to read, whether it be for print or for online reading. Most of the basic design rules apply to both mediums. Whether it is a page in a magazine or a blog entry, you risk losing your readers, no matter how good your content is, if you don't follow a few, simple guidelines. The point is, you have to know the rules before you can break them.

Surprisingly, what you see on a web page or blog follows the same tried and true rules that were developed for print eons ago. Way back when editors "marked up" copy for typesetters is when the concept of consistent uses of fonts, font sizes and blocks of print became known as style sheets. The consistent use of styles not only made it clean and easy to read, but became a part of the publication's branding.

Posted on the typesetter's wall was a list of paragraph styles, fonts, element alignment - a map of directions to consistently style everything on a page, on each page of the entire publication. These styles remained consistent page by page, day by day, week by week and month by month. Make a change to that style sheet posted on the wall, and that change happened everywhere that element occurred from then on.

Balance

Let's start with balance. Because you can hold it in your hand, one print trick-of-the-trade is to turn the composition upside down and then look at it. That stops the eye from reading the content and frees it up to look at the balance of the whole page. Remember that the old typesetters used to take an article, headlines and ads all cut out from other pieces of paper (elements) and put those pieces together on a full page sized paper much like a puzzle. The content pulls the readers in, but the ads bring in the revenue, so this had to be balanced out.

White space (blank space) around the elements plays a big role in balancing everything out as this gives the eye a chance to rest. When the balance isn’t right, it looks like a bunch of crap was thrown in to compensate. The result is a jumbled mess that is very difficult to untangle, and most readers won't bother to put that kind of effort out. It's too difficult to tell just what the important points are, even to the point of frustration, which leads to lost readers, whether they turn the page in a magazine or quickly click to the next web site.

Block Width

It's the content that draws the readers in, and good content keeps the readers on the page. The longer a reader is reading, the more likely it is that the ads will be noticed, remembered and acted on. Around 22 percent of engaged readers will remember the brand in an ad and eventually buy the product advertised. Compare this to those irritating mountains of junk mail delivered by the mailman. The return on investment (ROI) for mailer ads is only expected to be around 2 percent on a good day.

What the print masters have set in stone is that the width of a block of text should be no wider than 4 inches. Anything wider tires the eye out, makes it difficult to remain on the line and even more difficult to track down to the beginning of the next line. Newspapers use half that, making the columns only 2 inches wide to allow speed reading. Magazines will use 3 or 4 inch width.

This same width of blocks of text applies to online reading too, and it is perhaps even more important because of the difficulty of reading anything online. Having light shot directly into the eye is very tiring, so it's best not to add to that - and lose your reader - by letting your text span the width of the screen. Stay around 500 pixels wide, and if in doubt, hold up a piece of paper with 4 inches marked off up to the computer screen.

Text alignment

We read left to right, so it is important for the blocks of text to be left aligned. When the eye reaches the end of a line of text, it moves down and to the left and will latch on to the consistency of all the next lines starting in the same place on the page. Blocks of text that are center aligned are very difficult to track since the eye has to hunt for the beginning of the next line. Fully justified - text that reaches the margins on both the beginning and the end of the lines - is OK if the width is no wider than 4 inches, and the blocks of text are small.

Newspapers and magazines will indent the first line of a paragraph to break up the text and add in that much needed white space to rest the eye. Again, because the eye is much more strained by light being shot into it, it is best to put a blank line between paragraphs for online reading, giving much more relief to the eye than is needed when reading print.

Huge, long blocks of a paragraph are extremely daunting when reading online. It's best to keep the paragraphs as short as possible without harming the idea in the paragraph. Scanners latch onto that first line in a paragraph, and maybe they'll stick around for the second. Paragraphs that are long are guaranteed to lose a reader without a great deal of interest in what is written, but shorter paragraphs will draw the reader in.

Fonts

An old tried-but-true taboo that has carried over from newspapers and magazines is the rule that you should never, ever have more than 3 different types of fonts on one page. And that includes variants of the same font. So, if you use Times New Roman for the headline, and use it again in italic form as the subhead, you only have one font choice left.

Print is easier to read in blocks of text if it is a serif font, like Times New Roman, so the headlines used with it are usually a sans serif font like Arial. Cutaways, those little snippets of the article in bigger text in boxes, are usually the same font as the headlines. You’ll notice that when you look at a page in the newspaper, it looks like a jumbled mess if the ads use a lot of different types of fonts in the company logos.

Online, the opposite is true. It is much easier to read a sans serif font in blocks of text like Arial or Verdana. Headlines and sub headlines can be either a serif or a sans serif.

Use variants sparingly. For important words you want to stand out or emphasize, use either bold or italic. A lot of writers use italic to denote something thought, but not spoken out loud. A headline bolded will take precedence over a headline of the same font and size that is not bolded, giving you another way to denote hierarchy besides font size.

Keep in mind that italics are easier to read if the font is a serif font, like Times New Roman. This is a nice way to set off a quote you want to use. If what you want to set off is more than one line, only italicized serf fonts work. For italic sans serif, keep it to less than one line. This applies to both online and print.

Last point, ALL CAPITOL LETTERS IS VERY DIFFICULT TO READ. When looking at a word, the eye recognizes the shape of the word. That shape is defined by the letters that reach up, like "d" and "t" and the letters that reach below the line, like "p" and "g" and "y". Only when a word is not immediately recognized will the eye slow down to look at each letter. Never, ever use all caps. Besides, it's considered YELLING.

Posters and advertisements

The whole point of putting together a poster or ad is to make the main thing attractive immediately, to draw people in so that they will read the specifics in smaller print. That main thing also has to be very memorable and easily read at a distance for posters. That is your one, big chance to attract and hold attention. If you lose it on this main point, there’s no sense in even distributing the posters or ads. No all caps, no funky font, and no effects! In fact, you will never see drop shadows or embossing on text in any professionally done print job. If you do find the rule broken, you certainly won’t find any other rules broken in the same composition.

I’ve seen these kinds of stallion promotion things (see the image, click to see enlarged version) in horse magazines as full page ads, and when used as half page or smaller, the eye will look at the pretty horse and go on to the next element because it’s just too difficult to try to read.

Anything that slows down immediate recognition of any element should be questioned, and visual effects are never more important than what is being said. Just because these kinds of ads are used in horse magazines doesn’t make them “right” to use. Look at the ads for Purina horse feeds. If an ad can’t win at least as much notice as a Purina ad, then advertising money is wasted. The eye will always go to what is easily understood first.

Content is King

Newspapers and magazines have been around forever - because they know that it's the content that sells the publication, not the fancy fonts, graphics, colors or the paper it's printed on. Advertisers run ads in effective publications to build brand awareness and recognition that leads people to buy the product when seen on store shelves.

Content is king. There is no way to emphasize this point enough. Styling should not distract from the content.

What has been discussed so far is effective visual presentation of content, but all the design tricks in the book will only go so far if the content is crap. Check spelling, double check grammar, break up run on sentences... Nothing destroys validity and confidence in the author quicker than sloppy writing. One mistake may be written off as an oversight, two may be pushing it, and three mistakes and the reader has moved on.

Content is king. In newspapers and magazines, a writer submits to an editor who edits and double-checks with a fine toothed comb. If there are a ton of mistakes, the article is sent back to the writer for a rewrite, if the editor doesn't just throw it in the trash and fire the writer. The copy is sent to layout and a draft is printed for others to reread everything to make absolutely certain that no mistakes have slipped through. After all these double and triple checks, it finally goes to print.

Online content writers and bloggers usually don't have editors to double check and correct mistakes. What comes out of the typewriter, so to speak, is immediately published and viewable to everyone. Be careful!

Reread it again

When I put together a major article like this, I read and reread and reread again. I reread it here in the composer, I reread it again in preview, and I'll do it again after I hit that publish button. Still, mistakes leak through. Why? Because I wrote it, I've looked at it over and over, and I know what I was saying in that sentence. It's this level of familiarity that doesn't allow my eye to see the mistakes. I may have typed "made" when I meant to type "make" and every time I read it, my eye then sees "make" because that's what I meant.

This is the main reason that I do not have the option to subscribe by email. I'll hit publish, read it again, and then go do something else for awhile. I'll come back later for another read through, and I inevitably find mistakes and have to go back and fix them. If you subscribed by email, you'd have a full inbox in no time! I don't know for certain that Feedburner works that way, but I sure don't want to take the chance of losing any of my subscribers!

There it is.

And that's all she wrote. Whew! Yes, it's a lot. But, if you think about it, most everything here is common sense. You'll remember it. If you don't, you know where to find it again!

If you found this useful, give it a Digg!