validator: link rel=apple-touch-icon no longer valid?

So, today I’m getting

Error: A link element with a sizes attribute must have a rel attribute that contains the value icon.

From line 1, column 642; to line 1, column 749

<link rel="apple-touch-icon" sizes="180x180" href="/assets/img/favicons/apple-touch-icon.png?1482192202570">

Is this a regression or is an intentional change?

About this issue

  • Original URL
  • State: closed
  • Created 8 years ago
  • Comments: 18 (14 by maintainers)

Most upvoted comments

This is still a problem <link rel="apple-touch-icon-precomposed" sizes="144x144" produces: Error: A link element with a sizes attribute must have a rel attribute that contains the value icon or the value apple-touch-icon.

It should not because “apple-touch-icon-precomposed” triggers the device to REMOVE effects. REF: https://mathiasbynens.be/notes/touch-icons

Please consider that some of us use this checker to validate and sometimes getting fully paid for work includes validation.

Thank you for your consideration in this matter.

I’m getting a “Bad value” error from the validator. What am I doing wrong?

You’re using invalid values for the sizes attribute.

See https://html.spec.whatwg.org/multipage/semantics.html#attr-link-sizes

From your screen capture, it looks like you have, e.g., 120×120 in the value; that is, you’re using the character × (U+00d7, ‘MULTIPLICATION SIGN’).

You need to instead use 120x120; that is, a lowercase letter x (U+0078).

It’s standard snippet from html5 boilerplate so my guess is that there are many people using the same. IIRC it’s for compatibility with old Safari yes.

In most of my projects I usually skip the markup and let the browser look for apple touch icon in root.