Back to all answers

/ Web design

What is a favicon and why does it matter?

A favicon is the tiny icon in browser tabs and bookmarks. It's a small trust signal — missing or generic favicons make a site look unfinished.

/ 01

The short version

Favicons are a rounding error in web design cost and time — but a surprising number of business sites still ship with default browser icons or blurry 16px logos. It's a free credibility win.

/ 02

Where favicons appear

Browser tabs. Bookmark bars. Mobile home screen icons (via web app manifest). Google SERPs on mobile. Browser history. Notification bells. Progressive Web App installs.

/ 03

How to do it properly

Generate a favicon set from a square SVG version of your logo (or icon mark). Use realfavicongenerator.net — it outputs every format you need. Include ICO for legacy browsers, PNG at multiple sizes, Apple touch icon, Android chrome icons, and a web app manifest.

/ 04

Common mistakes

Using a rectangular logo that becomes unreadable at 16×16. No dark-mode variant. Missing Apple touch icon (looks awful on iPhone home screens). Skipping the site.webmanifest for PWA support.

/ 05

Where RIOT fits in

We're a small Colchester studio helping UK SMBs get your favicon setup right without agency waste or freelancer flake. If you've read this far and you want a second opinion on your specific setup, book a 20-minute call and we'll tell you honestly whether it's worth doing anything at all.

We work with clients across Essex, Suffolk, London and the wider UK — and remotely with brands abroad. No lock-in, no monthly retainer minimums, no pretending your problem is bigger than it is.

/ FAQs

Common questions

Does favicon affect SEO?

Indirectly — Google shows it in mobile SERPs and it affects trust/CTR.

What size should a favicon be?

Master file should be 512×512 SVG. Generator produces all sizes from that.

Still not sure?

Book a free 20-minute call — we'll answer your specific version of this question with no sales pitch.

Book a call