Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

There's a great question about the input of opening hours but I want to ask specifically about displaying opening hours.

What is the most readable text alignment to use for displaying opening hours? One of the accepted ways seems to be left-aligned days with the opening and closing times both (separately) left-aligned. So basically everything is left aligned in its own column. Here's an example I found on the web:

enter image description here

When I started thinking about this question, I thought that right-aligning the days would work better. This way has only one alignment point, the colon between days and hours.

enter image description here

But that doesn't seem to be that normal for displaying times.

share|improve this question

2 Answers 2

up vote 4 down vote accepted

Your top example is way more readable. It's clean, spaced, and your eyes naturally flow through the days and times.

Here's several different ways the alignment and format could look:


business hours formats


Side Note:

Remember to use a monospaced or fixed-width font like Consolas or Courier so that everything lines up nicely.

share|improve this answer
    
Reason why it flows is because we read from left to right (in english). That's why left aligned text is easier to scan. –  Majed Jan 29 at 17:27
    
@Majed - This is true and if we were reading from right to left then the days and times would be swapped and right aligned to keep the flow. –  Code Maverick Jan 29 at 17:29

Left aligned text is easier to read than centered or right aligned text. This is because when you center or right align your text, the starting place of each line changes. This forces your users to work harder to find where each line begins to continue reading. Without a straight left edge, there is no consistent place where users can move their eyes to when they complete each line.

However, when your text is left aligned, a straight left edge appears. Users can read each line by simply moving their eyes to the left edge each time. This makes paragraphs or lines of text faster and easier to read because the user’s eyes don’t have to work as hard to find where the line starts each time.

enter image description here

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.