Your logo is a visual representation of your brand. Ideally, customers will see your logo and immediately know what products or services it represents as well as what your brand is known for.
In this sense, it’s easy to understand the importance of branding and how a logo can impact it. But have you ever thought about the importance of integrating your logo and website design? Or how much impact well-placed website logos can have?
Your website is one of the first places customers will go to learn more about your brand. This is why homepage and overall web design must be done with branding in mind. Before we get into how to use logos on your website, let’s talk a few basics.
Using Logos on Your Website
File Type
The best type of logo file for digital use will always be a PNG. PNG files display millions of colors and allow for a transparent background. This makes your web page logo much crisper, and logo placement easier, than with a JPEG.
Logo Variations
Consider creating a second variation of your logo. Your primary version is your full logo in horizontal format. The secondary version could be a symbol, graphic, or monogram only, in a square format. These secondary versions become very useful in both web design and on social media platforms since they can be used in places that a full logo won’t fit or detail won’t be clearly visible.
Logo and Website Design
Where to Put Logos on a Website
Reinforce your brand by placing your logo in many places. Surprisingly, your logo’s position on your website can have a big impact on user experience. While it’s certainly not an exhaustive list, here are a few logo placement ideas to get you started.
Header
Your website header is the first location a logo will be spotted. The most common place for a header logo is in the top left corner.
Placing your header logo in any other location is one of the most common website design mistakes we see. This is because users expect your logo to be in the top left corner, and they expect that by clicking it they’ll be directed to your home page.
The Nielsen Norman group actually found that centered logos hurt website navigation, and that brand recall is 89% more likely when the logo is positioned on the left side of the header as opposed to the right.
Note: centered header logos are more expected, and thus don’t cause as much confusion, when they are used on a mobile web app.
Footer
Users know to scroll to your footer for links to important pages such as contact us, careers, terms of use, social media links, etc. This means that the footer is another great location for a logo. It gets more visibility than one might think.
Contact Page
Including your logo as a part of the contact form (or any form for that matter) will ensure that it’s one of the last things your users see before they hit “submit.”
Favicon
Often forgotten but oh-so-important, the favicon is the tiny icon next to the page name on a browser tab. This is the perfect place for the secondary version of your logo we discussed above.
Website Color Scheme and Logo
It’s a great idea to incorporate your brand’s color scheme into your web design. Logos should also include these colors, of course. Calls to action, headlines, buttons, and the like can all contribute to brand recognition simply by mimicking the colors (or even the font) seen in your logo.
Logos and Conversions
Don’t forget to consider the impact changes in logo placement can have on your conversion rates. It may sound silly, but simply moving your logo can impact user experience, which will have an impact on conversions. Depending on the change, it may be prudent to include testing it as a part of your Conversion Rate Optimization (CRO) plan.
Make the Most of Your Logo with a Site Designed by Hungry Media
Combining your business logo and website design doesn’t have to be a tricky task. Whether you’re starting with a blank slate or have some form of logo and website already designed, Hungry Media can help you make the most of them both. Our unique approach combined with years of experience with small businesses and startups makes us the perfect partner for all of your web design needs!
contributed by Melissa Lucas, senior staff writer
