Replace Squarespace’s Black Box with a Custom Favicon
Introduction
Your business needs a favicon. Why? It's Important!
Some businesses are represented by a boring black square in a web browser tab. Don’t let this be you. If your business is going to beat the competition, you need to develop strong brand identity. One small detail —well, actually a big detail that is sometimes overlooked in website design—is the favicon. As a Squarespace web designer, I often get asked about the importance of favicons and how to add them to a Squarespace site. So, let's talk favicons.
What Is a Favicon?
Favicon stands for "favorite icon," a small icon that appears in a web browser tab. It's the symbol that represents a business’s brand. If you bookmark a webpage, view your search history, or save a website shortcut to the home screen of a mobile device, it is the favicon that represents the website or webpage. It’s a small square or circle with a business’s colors and symbol inside. A favicon reinforces your brand identity, and it helps site visitors easily identify the tab, bookmark, or shortcut that corresponds to your business.
Why Is a Favicon Important?
Brand Recognition: When someone has multiple tabs open in a browser, it is a favicon that quickly guides the user to your website. It’s the symbol that represents your brand and is associated with your business. A favicon makes it easy to locate your website in the sea of open browser tabs.
Professionalism: If you want to be viewed as the professional that you are, make sure your website has a favicon. A favicon lends credibility to your website, and it’s a touch of finesse that draws attention to you site. I know consumers, including me, who won’t consider a business if its Squarespace favicon hasn’t been customized to reflect its branding.
Consistency: Favicons are part of branding consistency across all platforms. If you want to create a cohesive look for your brand, include a favicon.
Add a Favicon to Your Squarespace Website in 3 Easy Steps:
It’s simple to add a favicon to your Squarespace website. Just follow these steps and you’ll add a new layer of polish to your brand.
Step 1: Create Your Favicon
Create your favicon. An image that is 300 pixels by 300 pixels is ideal. These dimensions will ensure that your favicon looks good on all devices. Use your logo or a different business icon as the basis for your favicon design. Your favicon is very small, but it still must be clear and recognizable. Many design software platforms will help you design your favicon. Personally, I find Canva to be versatile and easy to use. For reference, you can see my business logo in the website header, and then note my favicon in the tab for this page.
Step 2: Save Your Favicon as a .PNG File
Optimize your favicon image file for your Squarespace website. Save it as a .PNG file to preserve optimum resolution without affecting website loading times.
Step 3: Upload Your Favicon to Squarespace
In your Squarespace website’s Home Menu, click on the settings gear on the bottom left of the page (next to your picture).
Select Adjust Your Site’s Favicon from the menu. This is the fifth option in the website settings panel.
Upload your favicon file.
After the file is uploaded, click Save to apply the changes.
Summary
By adding a favicon to your Squarespace website, you’ve improved your brand’s professionalism and visibility. A favicon is often overlooked by novice and even professional web designers, but a favicon has a positive impact on how site users view your business (and your website). The steps for adding a Squarespace favicon are simple, but the rewards are great.
Need help with your Squarespace favicon or website? Get in touch!
