Seoxpert.io
Get started
lowBest Practices

Pages Missing Apple Touch Icon

Pages lack an apple-touch-icon, causing poor iOS home screen appearance.

By Seoxpert Editorial · Published

Why it matters

When users add your site to their iOS home screen, Apple Touch Icons provide a branded, professional appearance. Without this icon, iOS uses a generic screenshot, which can look unprofessional and diminish your site's mobile and PWA experience.

Impact

Sites without an apple-touch-icon appear less polished when saved to iOS home screens.

How it's detected

The Assets Agent scans each page for a <link rel="apple-touch-icon"> tag in the <head> section.

Common causes

  • •Omitting the apple-touch-icon link tag during site development
  • •Not providing a correctly sized icon file (180×180px recommended)
  • •Relying solely on favicon.ico, which is not used by iOS for home screen icons
  • •Using incorrect rel attribute values in the link tag

How to fix it

Add a <link rel="apple-touch-icon" href="/apple-touch-icon.png"> tag to the <head> of each page. Ensure the referenced image is 180×180px for best results. Place the icon file at the specified path or update the href to match your file location. This ensures iOS devices display your chosen icon when users add your site to their home screen.

Code examples

Missing apple-touch-icon (problem)

<!-- No apple-touch-icon link present -->
<head>
  <title>My Site</title>
  <!-- Missing apple-touch-icon link -->
</head>

Correct apple-touch-icon (fix)

<head>
  <title>My Site</title>
  <link rel="apple-touch-icon" href="/apple-touch-icon.png">
</head>

FAQ

What happens if I don't add an apple-touch-icon?

iOS will use a screenshot of your page as the icon, which may look unprofessional and unbranded.

What size should my apple-touch-icon be?

The recommended size is 180×180 pixels for optimal display on modern iOS devices.

Can I use my favicon as the apple-touch-icon?

No, iOS does not use favicon.ico for home screen icons. You need a separate apple-touch-icon image.

Do I need to add the apple-touch-icon tag to every page?

It's best practice to include it in the <head> of all pages, typically via a shared template or layout.

Found this issue on your site?

Run a scan to see if Pages Missing Apple Touch Icon affects your pages.

Scan my website →