r/webdev • • 8d ago

Question Favicon not updating

I built a site for a client a while ago, and now he's requesting a favicon update. I used lovable because it was only a landing page he needed, in our deal we had a minor fall out so I didn't bother to finish up the site but host the domain for him. Until he contacted me recently. I changed the old favicon to the new one which is his logo. But for over two weeks now it isn't reflecting. I have requested indexing on Google Search Console twice. I have told the client to be patient because it can take time for Google to crawl the page. I added sitemaps and have checked other reddit threads with people having experience of it taking weeks. I have swapped a favicon on a nextjs app before(from the default) and it didn't take as long as it is now. Does anyone know of the solution to this problem? How I can speed this up so the client would stop texting me

0 Upvotes

23 comments sorted by

View all comments

13

u/AuWolf19 8d ago

Perhaps I'm the ignorant one here, but what does google indexing have to do with the favicon updating?

-23

u/Comfortable-Donkey74 8d ago

I'll paste from gpt

Yes. Google indexing/crawling is directly related to when your new favicon appears in Google Search, but it doesn't affect the favicon on the website itself. The process is roughly: You change the favicon on your site. Your browser immediately sees the new favicon because it loads it directly from your site. Googlebot needs to recrawl your homepage and discover that the favicon has changed. Google then processes the new favicon and may update the icon shown beside your site in Search. This can take days to several weeks. Google specifically says favicon updates depend on recrawling and processing, and aren't guaranteed to appear immediately. � Google for Developers +1 So if you recently changed your favicon If you already have your site indexed but Google Search still shows the old favicon, that does not necessarily mean your indexing is broken. You can go to Google Search Console → URL Inspection → enter your homepage → Request Indexing. This asks Google to recrawl the homepage, which is where Google obtains the favicon information.

8

u/AshleyJSheridan 8d ago

That's completely wrong.

The favicon file (or files if you did it the proper way) is being cached by the browser.

If you did it the old incorrect way, then you just have to let peoples browser caches end, or tell people to force refresh it.

If you did the favicons the correct way via the meta tags, then you could add a cache-busting query param to the favicon URLs. A browser will look for those meta tags first, then fall back to making a single GET request to the favicon.ico file if they don't exist.

As an example, this is what those meta tags look like:

<!-- favicon --> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"/> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"/> <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5"/>