Image showing old style type layout

Justifying text copy is not a good look

We often have clients request to justify the copy on our websites. We understand that the desire to have everything looking symmetrical can be the motivation, so we get it, but the outcome is a poor reading experience, and we typically recommend against it. Great typography is something worth striving for, it can enhance the appeal of your site.

When it comes to typography we consider the reading experience, not only for people with healthy vision but also for those with vision impairment, and cognitive difficulties. We ensure there’s enough contrast ( dark text ), that the font-size adjusts to the size of the viewport ( no squinting ), and that the measure ( width ) of the text makes for comfortable and effortless reading.

Justifying text works counter to the physiology and psychology of reading. It hinders the reader’s ability to quickly find the beginning of the next line (which causes people to read the wrong line, and then have to re-read, causing frustration / fatigue). It also interrupts the rhythm of the text, by creating odd spaces between each word, further harming comprehension.

The W3 Working Group for WCAG 2.0 (Web Content Accessibility Guidelines 2.0) states;

“Many people with cognitive disabilities have a great deal of trouble with blocks of text that are justified (aligned to both the left and the right margins). The spaces between words create “rivers of white” running down the page, which can make the text difficult for some people to read. This failure describes situations where this confusing text layout occurs. The best way to avoid this problem is not to create text layout that is fully justified.”

Further to this, web copy doesn’t support kerning or tracking, we can’t make minute adjustments to the spacing between characters, so we end up with uneven spacing between words, affecting readability.

If you are considering justifying your text copy you can test what it would look like by adding the following CSS, in WordPress, in the Customiser under Custom CSS;

p {text-align: justify; )

Take the time to read the copy in both formats and get a sense of the difference, also consider your audience, perhaps seek some feedback from vision impaired clients. Check out other quality websites and their text alignment.

We think you’ll agree that justifying text is not a good look, or has very limited application.

About The Author