Website Branding - Adding A Favicon

How To Add A Website Favicon To WIX SQUARESPACE AND WORDPRESS.png

How To Add A Website Favicon To Wix & Squarespace

Adding a Favicon to your WIX or Squarespace site is one of the easiest ways of branding your site and making it easily recognizable to your site visitors. 

So what exactly is it? A Favicon is a small image that displays next to page titles, on some browser tabs, and bookmark folders. Adding a Favicon to your site, although a small detail in the overall design, helps it stand out from other websites and creates a more cohesive branding for your business.

The recommended file dimensions for Favicons are typically 100 x 100 to 300 x 300 pixels -- Ensure the image is saved as a .ico or .png file. Although, Favicon's will display in browsers as 16px × 16px.

Your Favicon file size should also not exceed 100 KB.

Keep in mind, however, that Internet Explorer cannot display a .png file as a Favicon, so some users accessing your site using that browser won't be able to view your Favicon. 

Website Favicon Example

ADDING A FAVICON TO SQUARESPACE

All Squarespace sites start with their default cube favicon. If you leave it as-is, people who know the icon will recognize that you're part of the Squarespace community. You can replace it with your image to better fit your site's brand.

Adding A Favicon To Squarespace

How to add your own Favicon to your SQUARESPACE site

1. In the Home Menu, click Design, and then click Logo & Title.

How to add Favicon To Squarepace
 

2. Scroll down to Browser Icon (Favicon) and then drag your image into the image uploader.

How to add Favicon Step 2
 

 3.After your image uploads, click Save.

How to add Favicon Step 3
 

How to add your own Favicon to your WIX website

1. Access your Site Manager

How to add Favicon To Wix Website
 

2. On the Site Address tab, Click on Manage

How to add Favicon To Wix

 3. Scroll down to "Favicon Image" and click on Upload or Change Favicon

How to add Favicon To WIX

TERMINOLOGY GUIDE

Pixel/File Dimensions: The total pixel dimensions of an image will tell you how many total pixels (dots) the image is made up of. For example, let’s say we have a digital image that is 1200x1800 Pixels (dots). That means our digital image is 1200 dots high by 1800 dots wide.

Digital Image Size: The size in inches of your digital image. 

DPI of a digital image: DPI means Dots Per Inch. This number is calculated using your digital image’s pixel dimensions and digital image size. Your image may display larger or smaller on your site depending on its container size. 

.ico: .ico files contain one or more small images at multiple sizes and color depths, such that they may be scaled appropriately.

.Png: This file format allows you to render images with millions of colors – much like a JPEG – but also offers the ability to preserve transparency.