Why you should never center or right align your logo

Some food for thought in this brief article. It makes sense to left align but the designer in me always wants to try something different. So the questions is when do you follow a visitor’s expected UX versus breaking the rule in a way that adds and doesn’t subtract from the brand recognition?

1 Like

The brain wants to do zigzags with the eyes, so designers have to provide zigzag reading paths. That’s how we’re wired, that’s how we scan what’s in front of us. :slight_smile:

http://vincent.polenordstudio.fr/snap/hsqji.jpg

Now not placing the logo on the left, but for example is the center, is a way to differenciate the brand. It’s not a bad thing. Maybe it’s not super optimized for some aspects, but maybe “you should never” is a bit much :slight_smile:

Have you noticed how this site:

  1. uses hamburger menu
  2. uses TWO hamburger menus!
  3. put the hamburger menus on the left

http://vincent.polenordstudio.fr/snap/q4zln.jpg

Placing their burgers on the left is on par whith what they just wrote.

But still, they hide all their navigation between two icons. This will always be beyond my understanding, that most of the sites hide their PRIMARY nav entirely. I try to never. At least I try to keep the most important menu items directly readbale/ accessible

1 Like

Exactly! That’s why enjoy seeing heatmaps for sites. It’s very revealing. Now this makes me wonder about text alignment. When it comes to headers and paragraphs is there a proven tactic for when it is acceptable UX to center the text? I’m a sucker for symmetry so I constantly have to fight urges to center things before I seriously think it through.

Haha! :rofl: it’s the first time I’d visited the site and hadn’t seen the mobile layout either. That truly is bad UX for a site that is all about good UX.

1 Like

Interesting. All of the examples shown were very traditional, content heavy layouts though. On my own site, I decided to experiment a bit and center my logo. However, the whole layout does alternate to encourage the eyes to zigzag.

It is first time that I read about zigzag reading paths! I’m not sure about that.

This zigzag or F pattern is quite common for right-to-left languages. It’s not that you can’t or shouldn’t put content outside those zones. It’s just that the pattern should be taken into consideration for your important info and call-to-action for visitors in that “scannable” area.

Here’s another article that goes more in-depth.

thanks for sharing
suitekish

“Recall” is highly dependant on the visual hierarchy. In the test they were shown 4 different websites where the logo changed position, but that’s the only thing in the hierarchy that changed. It would be interesting to see if they tested against whole different layouts with layouts that were designed as centered compositions compared to left compositions. Given the left to right reading direction my guess is that the results would be the same, but it would be interested.