Walls of Text

So today we move onto number five on the list of ‘what annoys me about your blog’ something we’ve all done and something we will probably all do again. Walls of text.

Again, these are only my thoughts and opinions based on my twenty years of web design. Your thoughts and opinions are welcome even if they oppose mine and especially if they are well thought out and not just abusive.

Walls of Text

Wall of Text

Wall of Text

White space is our friend in the web world, it helps break images and text, it helps break headings from text and it helps break things like copyright messages and text. But there is absolutely no reason why it should be used to separate text and text. (With three ‘breaks’ in that paragraph it would have been a great place to use the daily prompt of Fragile. 🙂 )

We’ve probably all read novels which are essentially just page after page of walled text, but a novel is different to the web. There are a thousand studies on the internet that look at ‘eye hot spots,’ the spots on a screen that people focus on first, last and for the longest time. These studies are used by some designers to work out where to put the most important information on the page.

Many of the same studies also show eye movement up and down the page whilst reading the text. These studies show when presented with a break in text many viewers eyes take a brief rest and continue reading. Whereas if presented with a wall of text the viewer often either scans the page, or worse exits the page.

Eye Movements on a Webpage

Eye Movements on a Webpage

Spacing between paragraphs does make a huge difference to the way people react and the way people read. The pause between paragraphs is only small but it’s enough for people to continue reading and scrolling.

The thing that many people don’t consider is that a wall of text registers with the mind almost instantly, even before the viewer begins reading so in many cases a reader may not even start reading your wall of text.

Sometimes it may not feel right to add an image to your text. Sometimes it may not feel right to add an image in between paragraphs. However images break up text, allow the viewer to focus on something else and also help explain some things in further detail. Studies have also shown that even adding the same image repeatedly down a page can help viewers focus more than no images at all.

Explaining things better

Explaining things better

While pictures definitely make a difference another well utilised option is the Horizontal Rule. Some WordPress themes may not utilise the hr tag but any theme that allows you to add to the CSS (which is many of them, even on WP hosted sites) can have the code added to it. Alternatively if you can’t add a horizontal rule through CSS you also have the option to make a small graphic and insert it as you would any other image. (Search Google for horizontal rule for ideas and options).

If you utilise Google Analytics and other such monitoring software on your website you might be surprised just how much of a change you see in the time people stay on your site from adding images or even a horizontal rule.

Horizontal Rule

Horizontal Rule

It’s also worth considering that the smaller you make your text the more it needs breaking up. Obviously text too small is hard to read at the best of times but if your wall of text is in a smaller font not only does it look like a wall of text but it looks like a wall of cramped text. A horizontal rule can make all the difference, even a single line horizontal rule that is done with pure CSS.