logo design||||

Website Logo Mistakes – And How to Avoid Them

  • 6 min read



The logo is arguably the most essential aspect of any brand to get right. It’s purpose is to show the personality of a brand and instantly convey what the company does at a glance.

Website is the first place where your logo is presented to customers. It is the most critical place for your logo to be. By avoiding common logo mistakes, such as the logo appearing blurry, too small or too big, you can significantly elevate your brand awareness. 

In this article, we will cover some common mistakes that you should avoid when you are applying your logo on your website.

Logo placement

Think about some of the websites you visit every day – Youtube, Google, Facebook, Netflix – you’ll notice that every one of them has identical logo placement.

On all these websites the company’s logo is in the top-left corner. It is also a clickable button that brings the user back to the homepage.

Left corner has become a standard logo placement design choice. Also, you have probably seen logos in two other places: centered and in the top right.

The popularity of logo displaying in the top-left corner has been the trademark placement since the dawn of the internet.

Reason for that because we automatically look to the top left corner when searching for the homepage button. Also, the majority of the world reads from left to right, so that same instinct kicks in when we are browsing a website.

Centered logos can hurt website navigation according to research by Nielsen Norman Group. Returning to site’s landing page is six times harder when the logo is in the center of a page instead of the top-left corner.

They also found that users are 89% more likely to remember your brand if your logo is in the top-left corner on your website compared to the right.

Placing the logo in the center of the website is still fine, as long as your navigation is user-friendly and straightforward.



Too small or too big

In case your logo is too small, users visiting your site may not be able to distinguish your logo at a glance.

To avoid legibility problems, on the favicon and any small places try to use the version of the logo that consists of the symbol.

By standard rules of placement, the logo should be larger and more prominent than your navigation menu. You don’t want users to navigate your website without acknowledging your brand.

Blended into website

In case your logo is similar to the rest of your website theme, it could get lost in the background. On the homepage for The Well of Alternative Medicine, the company logo is placed on two different backgrounds and is too large.

Readability is poor against a colored background.



Do not place your logo on the colored background where it doesn’t stand out. You should use secondary colors for your website theme while logo should have a primary color in it. 

Blurry logo

Quality of your logo’s image file should be appropriately optimized. If the image is not optimized logo may become pixelated when scaled.

In that case, your logo text won’t be legible – which is a huge no-no.

It is good practice to test your logo for different sizes. To avoid blurry logos, you should use PNG file type instead of a JPEG. 


Nowadays, responsive design is a must-have if you want your business to be competitive on the market.

Users can visit your website from all sorts of devices: desktop computers, laptops, tablets, mobile phones. 

Your website should be responsive for all devices and should maintain the quality and appearance of your logo on all of these devices.

It is essential to keep an eye on logo alignment, whether it’s left justified or centered in the header.


While your logo should always be visible in the header, consider putting it elsewhere on your site. You can reinforce your brand by placing the logo in the footer, or it could be a part of the checkout experience.

It is also good to incorporate your brand’s colors in other areas of your website, like buttons, headlines or backgrounds.

Consistency is the key to online branding. Make sure your logo is visible, readable and consistent across all your website pages. If you need any help with designing your logo, contact us and get awesome results!


How useful was this post?

Click on a star to rate it!

Average rating 4.8 / 5. Vote count: 5

No votes so far! Be the first to rate this post.



Related articles