A Complete Guide To The Favicon On Wix

Updated: Jul 12

Everything You Need To Know: From Wix Add Favicon & Wix Change Favicon Questions to Correct Sizing and File Types for Favicon Settings.


A Complete Guide to the Favicon on Wix by NB Media Solutions

Let’s start with the basic question: What is a Favicon?

Favicon is short for “Favorites Icon”. It is also known as a shortcut icon, website icon, tab icon, URL icon, or bookmark icon.

It is the small icon graphic that appears next to the URL in a web browser windows address bar. Take a look at the Google Chrome website tab below showing our NB logo set as the Favicon:

Favicon | NB Media Solutions Google Chrome Web Browser Bar

The first Favicon appeared in 1999 when Microsoft launched Internet Explorer 5.

Favicons are important for site identification and branding. As more browsers utilize tab-based structure, a Favicon ensures that each website's tab is easily identified.

Favicons are not directly responsible for your Search Engine Optimization but they are an important tool for improving your ranking on search engines.

Below are three examples of how you can improve SEO by having a graphic designer add favicon to Wix website:

1) User Experience - User Friendly Websites Lead to Increased Use

2) Bookmarks - People remember images more than URL links!

3) Branding and Visibility

Google crawls billions of web pages every day, even so, it can take days to months before they get to your site. Every time they crawl your site Google checks and updates your favicon.

Google is progressively rolling out a new look for search results which includes Favicons in SERPs.


Google Favicon Search Result Examples
Google Mobile Search Results Showing Favicon Images

The website name and its Favicon will appear at the top of the results card, as shown in the image above.

“With this new design, a website’s branding can be front and center, helping you better understand where the information is coming from, and which pages have what you’re looking for.”

Google says this new look is helpful to searchers as they can easily scan the page of results and instantly decide which source to get their information from.


Favicon Icon Graphic

Tips for the Best Favicon

  1. Make it recognizable

  2. Use your logo or branding

  3. Keep it clear - You have a very small space.

How to add a favicon to your Wix site


Wix sites automatically include a standard default Favicon, but you can customize it by upgrading to a Premium Plan and connecting your site to a domain.


You can easily change your Favicon on your Wix site:

  1. In your site’s dashboard, go to Settings.

  2. Click Manage next to Favicon.

  3. Click Upload Image. If you have created a favicon - select an image or click on Upload Media to upload a favicon image from your computer.

  4. Click Add to Page. Now, you will see a preview of what your Favicon would look like on your browser tab.

  5. Click Save. Now your website has a Favicon. It will appear on your website’s tab once you hit publish.

Favicon File Type

The preferred file format for a favicon is JPEG or PNG file. The preferred format for Favicon icon is .ico. With most favicon generator tools, if you upload the image in PNG, JPG, or GIF file format, it automatically converts it to the ICO format.


Favicon Wix Size - Recommended Icon Sizes

Your Wix favicon size should be a 1:1 image ratio (a square shape).

Wix Favicon

Make sure your favicon looks good at a resolution of 16 x 16 pixels as Google rescales favicons to that size. Google recommends a multiple of 48px square, e.g. 48 x 48px, 96 x 96px, 144 x 144px etc.


Bottom Line when it comes to favicon size wix - Place your desired image in a SQUARE!



Are you interested in learning more? Check out this Favicon Cheat Sheet.


Is your Wix Favicon Blurry?

Maybe your Wix Favicon is not showing up?


Sometimes different operating system’s requirements for displaying icons can make a favicon appear blurry and that doesn’t look impressive at all!


Using an advanced method and the attributes rel="icon" sizes="space-separated list of icon dimensions" within a <link> tag. Multiple icon formats, including formats that are compatible with Microsoft and MAC files, may be provided by including the icon's content type in the format type="file content-type" within the <link> tag.


Creating a proper favicon is a science.


Contact NB Media and we can help your brand become a noticeable favorite.

Favicon in Web Browser


1,115 views

Recent Posts

See All