What is a favicon?

A favicon is the small square image a browser shows beside your page title — on the tab, in the bookmark list, in history, and on a phone home screen when someone saves your site. It is usually a simplified mark or a single letter, not your whole shopfront sign.

Why it matters to a shop

A customer with eleven tabs open finds yours by its picture, not by reading titles. With no favicon a browser shows a blank grey page symbol, and your ordering page looks like the tab that got opened by mistake — so the regulars who bookmarked you are the ones who lose you first. It is a fifteen-minute job that keeps working every day after.

How to make one that reads at fingernail size

  1. Do not shrink your whole sign. At that size a shop name and a phone number turn into grey mush. Pick one element: the first letter, a bowl, a pair of scissors, a leaf.
  2. Make it square, high-contrast, and free of thin lines. Test it by shrinking the image on screen until it is about as tall as the letters in this sentence — if you still know what it is, it works.
  3. Upload it once in your site settings, publish, then open your hosted address in a new tab and look at the tab strip. Add the site to a phone home screen too, and check the icon there.

Common mistake: Uploading a wide logo with the shop name inside it — the browser squeezes it into a square and everyone sees a smear, while one bold letter would have been recognisable.