lowBest Practices

Broken Favicon / Apple-Touch-Icon

One or more favicon or apple-touch-icon URLs return 404 errors, causing missing icons in browsers and search results.

By Seoxpert Editorial · Published Apr 27, 2026

Why it matters

Favicons and apple-touch-icons are key for branding in browser tabs, bookmarks, and Google Search results. Broken icons display as generic placeholders, reducing site credibility and potentially lowering click-through rates. On iOS, a missing apple-touch-icon leads to a blurry screenshot when users add your site to their home screen.

Impact

Leaving this unresolved results in unbranded or generic icons in browsers and search listings, diminishing user trust and recognition.

How it's detected

A crawler checks the URLs specified in <link rel="icon"> and <link rel="apple-touch-icon"> tags and reports HTTP 404 or similar failures.

Common causes

•Renaming or moving the icon file without updating the <link> tag's href attribute.
•Deleting the icon file from the server.
•Incorrect file path or filename in the <link> tag.
•File permissions preventing access to the icon file.
•Typo in the icon file's URL.

How to fix it

For each broken icon URL, either upload the correct icon file to the specified path or remove the corresponding <link> tag. If you remove all <link rel="icon"> tags, browsers will still look for /favicon.ico—ensure a 32x32 PNG or ICO is present there. For apple-touch-icon, provide a 180x180 PNG as recommended. Use a favicon generator to create and download all necessary icon files and update your HTML accordingly.

Code examples

Broken favicon link example

<link rel="icon" href="/favicon.ico">
<!-- But /favicon.ico does not exist or returns 404 -->

Fixed favicon link example

<link rel="icon" href="/favicon.ico">
<!-- /favicon.ico is present and accessible -->

Broken apple-touch-icon example

<link rel="apple-touch-icon" href="/icons/apple-touch-icon.png">
<!-- But /icons/apple-touch-icon.png returns 404 -->

Fixed apple-touch-icon example

<link rel="apple-touch-icon" sizes="180x180" href="/icons/apple-touch-icon.png">
<!-- /icons/apple-touch-icon.png is present and accessible -->

FAQ

What happens if my favicon is missing or broken?

Browsers and search engines display a generic icon, reducing your site's branding and potentially lowering click-through rates.

Do I need both favicon and apple-touch-icon?

Yes, favicon is used in browsers and search results, while apple-touch-icon is used when users add your site to their iOS home screen.

Can I just remove the <link rel="icon"> tag if my favicon is broken?

You can, but browsers will still request /favicon.ico by default. It's best to provide a valid favicon at that location.

What size should my apple-touch-icon be?

The recommended size for apple-touch-icon is 180x180 pixels in PNG format.

Found this issue on your site?

Run a scan to see if Broken Favicon / Apple-Touch-Icon affects your pages.

Scan my website →