Why We’re Not Fans of Having The Logo in the Middle of Navigation
Putting the logo in the middle of navigation is a website design trend that can look pretty cool. You’ve likely seen websites that have two menu links on the left, the logo in the center, and two more links on the right. It can make for a nice, balanced design. But is it really a good idea for your website?
At Full Scope Creative, we’ve built websites with the logo in the center of the navigation before. And while they can look great, we’re not big fans of this layout. There are a few reasons we don’t recommend it, especially when thinking about how a website will grow and work on mobile devices.
A Centered Logo Can Look Great
One of the reasons designers like putting the logo in the center of a menu is how it looks. With the same number of links on each side, it makes for a balanced design.
And I’ll admit, some websites using this layout look great!
For a website with four main menu links, it can work pretty well. Two links go on each side of the logo and everything lines up nicely. The menu looks clean and the logo gets a lot of attention.
There’s more to a good website design than just how it looks. We need to think about how visitors will interact with the site and how the website will work as the business grows.
Your website should look great, be easy for visitors to use, and have room to grow with your business. At Full Scope Creative, we build websites with all of that in mind. Whether you’re starting a new website or redesigning your current one, we’d love to help.
What Happens When Another Menu Link Is Added?
This is one of my biggest issues with putting the logo in the middle of navigation. It limits how easily we can add new pages to the website.
Let’s say your website has four main menu links. You have Home and About on the left side of the logo. Services and Contact are on the right.
Everything looks great!
Now your business grows and you want to add a Portfolio page to show off your work. Where does that fifth link go?
If we put it on one side, the menu no longer looks balanced. We could move the links around, change the spacing, or even make the logo smaller. But now we’re changing the design just to fit one new page into the menu.
And what happens when you need to add a sixth or seventh link?
Your website should be able to grow with your business. As your business adds new services, products, or other information, your website should be growing too. We don’t want the location of your logo to make adding those pages harder than it needs to be.
The Centered Logo Effect Is Lost on Mobile Devices
Another big issue with this design is how it works on phones and other mobile devices.
On a desktop computer, there’s usually plenty of room for the logo and links to sit next to each other. On a phone, we don’t have that same space.
Most mobile websites use a hamburger menu. That’s the little icon with three lines that you tap to open the navigation. The links are hidden until someone opens that menu.
So what happens to that cool centered logo design?
It’s gone!
The logo might still be centered on the mobile header, but the links are no longer sitting on each side of it. The whole look that made the design unique is lost.
Many websites get most of their traffic from mobile devices. That means a large part of your visitors might never even see the design feature we spent extra time building.
A Centered Logo Can Make Responsive Web Design Harder
We need to think about what it takes to make the layout work across screen sizes.
Responsive web design means building the website so that it will adjust to the screen it’s being viewed on. The website must work great on a desktop computer, tablet, or phone.
With the logo in the middle of the navigation , the site may need to have one header built for desktop and another for mobile. That would mean extra code which can mean a longer load time. It would for sure be work to maintain the website.
It can also add code that isn’t needed and could slow down the website if it’s not built correctly.
There are ways to make centered logo navigation work well on all screen sizes. We’ve done it before. But why add more work and possible issues for a design that loses most of its effect on mobile devices anyway?
Keep the Logo on the Left Side of Your Navigation
Our recommendation is pretty simple. Keep your logo on the left side of the navigation.
It’s where most people expect to find it. And when someone visits your website, we want them to know how to use it without having to figure things out.
Having the logo on the left also gives us more room to work with the navigation links. If we