How To Add A Favicon To Your Squarespace Website
New to Squarespace and wanna try it out? You can sign up for a free trial here << Yes, that’s an affiliate link - thanks for supporting my book obsession, my kindle and I thank you ;)
What is a favicon?
A favicon (also known as a browser icon in Squarespace) is the tiny little graphic at the top of your browser window. You see it to the left of your site name & page name.
For example on my website - She Is Moxie, it looks like this:
Why is a favicon important?
When you browse around the internet going from website to website, you likely don't pay much attention to a website's favicon. It's a little branding detail that sometimes gets forgotten and it's only then that the majority of people even notice. Since we are so used to every website having one, the lack of one or having the same favicon as other people can be a little jarring.
For instance, when someone doesn't update their favicon on a Squarespace website, Squarespace automatically leaves their site with their default favicon - a gray cube, like this:
If you're browsing the web and go to a few websites you're bound to notice people's favicons, even subconsciously.
Then when you see the same gray cube on multiple websites, it stands out. And not in a good way.
That's why I encourage everyone to upload their own personal favicon to their website. And luckily Squarespace makes this really easy to do.
How to create a favicon in Canva
Now that you know what a favicon is and why it's important, it's time to create your own.
If you've hired someone to do your business's branding/logo then a lot of the time they might also supply you with a logo submark or icon that you can use as your website's favicon.
But if you're DIYing your website and logo then the easiest way to create your own favicon is by using Canva.com.
Canva is an online design tool that you can use to help create graphics for your business. It has both a free plan and a paid plan.
If you're doing this yourself then I would suggest making your favicon really simple. A square background, in your brand colours, with your business initials is a great, simple design for your own favicon.
In Canva:
Create a new design in Canva with the dimensions 400px by 400px for your square.
Choose one of your brand colours for the background colour of the square.
Add your business initials in your brand font to the design
Center the text and then increase the size until it fills the square (remember favicons are really tiny when viewing them in a browser window so you want to make sure it's legible. You can just use just 1 letter from your business name too - it doesn't have to be all the initials, if that looks better).
Download the image. Make sure to download as a png if you need a transparent background.
Use https://tinyjpg.com to compress your image before you upload it to Squarespace. It compresses both jpeg and png files.
If you want to use an icon graphic or circle as a favicon then you'll need the paid plan in order to download your graphic with a transparent background. (Don't worry, you can upgrade to the paid plan for free for 30 days).
How to add your favicon in Squarespace 7.1
From the main Squarespace navigation go to:
Design > Browser Icon > And upload your favicon
You'll be able to drag and drop your file in the browser icon section or select 'upload file' and choose your favicon from your list of files.
How to add your favicon in Squarespace 7.0
From the main Squarespace navigation go to:
Design > Logo & Title > Scroll down past where you upload the logo and you'll see where you can upload your browser icon (favicon)
You'll be able to drag and drop your file in the browser icon section or select 'upload file' and choose your favicon from your list of files.
Do you have your favicon uploaded on your website? Don’t forget to add your own now that you know an easy way to create one.
LIKE THIS POST - THEN YOU’LL ALSO LOVE…
Have I made you curious? You can sign up for a free Squarespace trial here << Yes, that’s an affiliate link - thanks for supporting my book obsession, my kindle and I thank you ;)
