Why you shouldn’t align HTML justify

Have you ever wanted to align the text on your web pages so that it spreads across each line, just like in newspaper columns? You might think this looks good, but here are a few reasons you might want to reconsider. Why you shouldn't specify align=justify for your website text.
14 May, 2012
Martin Jarvis

Martin says… Don’t Justify Align

One of my WordPress clients recently asked me for fully justified text on their website rather than to align left.

Here’s an example of normally aligned website text. As you can see, the text is aligned to the left margin meaning that not all of the text will align to the right margin.

AND

Here’s an example of justified website text. As you can see, the text is aligned to both the left margin and right margins, meaning that each line will be the same length.

Justification (or full alignment or double justification) means that each line in your web page is the same length (except perhaps for the last line), with the text on those lines being spread out to meet a uniform line width and to align with both the left and right margins.

The HTML code (or attribute) to achieve this (for those of you who are interested) is text-align=”justify”.

I advised my client against justifying the text on their web page. I think that most website readers prefer to have their text set out in fairly narrow columns, and with the text aligned left. This makes it easier to read.

Justified Alignment is actually non-standard for the web, and the W3C standards committee states the following:

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 a text layout that is fully justified (aligned to both the left and the right margins).

Of course, it’s up to you as a website owner to make the final decision on the text layout and other styles on your site, and don’t forget that text alignment has worked successfully for newspapers for many decades, especially where the columns are particularly wide.

What do you think? Do you think left-aligned text is easier to read, or do you favour the more spaced-out layout of full-text alignment? Leave us a comment below to let us and our readers know what you prefer (and why).

Does your website have inappropriately aligned text? If so, and you would like us to take a look at changing it for you, leave us a comment in the form on this page or call us on 01793 740964.

16 Comments

  1. Frank Hileman

    The wider the width of the paragraphs, and the better the justification algorithm, the less “rivers of white” is a problem. The IE “newspaper” form of justification is particularly good.

    Reply
  2. Laura

    I find that with no white space at the left margin the page is difficult to read,as the letters look as though they bleed into the border line. I usually wont bother reading it at all. I find if I view a page in ‘no style’ rather than default, it looks better.

    Reply
  3. Andy

    Why not offer a choice. Its fairly simple nowadays to offer a choice between CSS files etc and any good web designer should have readability and web standards in the back of his mind.

    Reply
    • Martin Jarvis

      Yes, agreed Andy, you can offer your visitors a choice of text alignment via different css files (the same as one might do with things like text size). It might be a little harder with platforms like WordPress and Joomla, but certainly can be done.

      Thanks for the comment.

      Reply
  4. Sabrez Alam

    Hello Martin,

    Today, I was just searching to align my blog post text as justify and landed to your post and amazed what you have mentioned and what W3C mentioned.

    Now, I have decided not to align the text on my blog to justify.

    Thanks for the awesome information.

    Sabrez Alam

    Reply
  5. Võ Duy Khánh

    Hi,

    Currently my website is using justify for all post. But when I’m browsing on the Internet, I see that no one use this format, it make me confuse. So I try to research, and now, after read your post and some other post, I will remove this format.

    Thanks again for your information!

    Reply
  6. Tech Spurs

    You are right, Justify alignment only looks good for web owners. It is very difficult for readers from mobile as it spaces heavily in between the words.

    Guys, just go with Left alignment 🙂

    Reply
  7. Shukan

    I learn from this post actually before I read and understand about this I really like of justify format but now I decide to use align-left, thanks for your article, its great!

    Reply
  8. Agung Rangga

    Thank you for the tips. I will stop using the justified texts. 🙂

    Reply
  9. Harkiran Kaur

    My site uses fairly wide text areas rather than a lot of columns. So I prefer justified. Call me obsessive compulsive but I just have a certain uneasiness whenever I see the ragged right edge on my pages. The only places I can see where it creates a problem are the article headings. Since WordPress removed the justify option, I had no option but to insert it via CSS but I can’t seem to separate the headers from the body it seems to be either both or none… on the blog page anyway. When reading the full articles it’s fine. Granted I’m a graphic artist and not a web designer by training… but I’m doing the work myself on the site (which is for a small NGO I started).

    Reply
  10. Martin Jarvis

    Hi Harkiran.
    I agree that the article / post headings on your archive pages don’t look great. Does it not work for you when you use something like this in your custom css?…

    .entry-title, .entry-title a { text-align: left;}

    Reply
  11. Niels

    Apart from readability, the choice for me also depends on scalability. Justifying text on your website may cause scaling problems, as screen size and aspect ratios of different devices are not standardized. On some devices your beautifully justified text may appear with too many gaps between the words. In most of my cases justifying text on websites proofed to be a bad idea, especially on websites where a lot of new content was written on the daily.

    Reply
  12. Squiggly Wiggly

    Sorry but I am pro-fully justified all the way, ragged edges look so messy especially online. Perhaps like Harkiran I’m a bit OCD but when did we lose the motivation to tidy text? It should definitely be a standard of choice in modern day web making tools. Published books, newspaper articles, dissertations, publications, even a lot of cereal packets have justified text on them I object to this option being made obsolete, if anything it should be optioned and synchronised with all web tools. If I could justify this text online right now I would ! Forgive me while I shake my head in disgust !!

    Reply
  13. hardifal

    This is the problem and I’m having a hard time tidying up my web page so that the writing is left and right aligned. Now I know the problem from reading this good article. thank you for sharing

    Reply
  14. kilian

    could it possible to have “justify low” as like as “microsoft word” in wordpress?

    Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

You may also like…

How do canonical links work in wordpress?

How do canonical links work in wordpress?

Canonical links are used to indicate the preferred URL of a webpage that has multiple versions or duplicates of the same content. This article explains canonical links in depth.

Share This
Martin Jarvis

Martin Jarvis

I typically reply within an hour

We're here Monday - Friday during UK working hours. Drop us an email and we'll get back to you.

Martin Jarvis
Hi. It's Martin here. How can I help you?
Start Chat with:
chat