Closed Bug 1837655 Opened 1 years ago Closed 1 years ago

Firefox seems to use apple-touch-icon for bookmarks (again?)

Categories

(Firefox :: Bookmarks & History, defect)

Firefox 114
defect

Tracking

()

RESOLVED DUPLICATE of bug 1772264

People

(Reporter: syfjhz33, Unassigned)

Details

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:109.0) Gecko/20100101 Firefox/114.0

Steps to reproduce:

  1. Load any website with both a normal favicon and apple touch icon.
  2. Bookmark the page.

Actual results:

Firefox used apple-touch-icon instead of svg icon, I can see this because svg icon contains a theme based <style>, when my browser is in dark mode it's supposed to be a white svg.

However, apple-touch-icon is a large png file, it does not change colour.

Expected results:

All other browser would choose to use default icon, not apple-touch-icon. Even Safari would not use apple-touch-icon.

FYI, I have seen this old ticket, so I thought this must be a bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1420435

The Bugbug bot thinks this bug should belong to the 'Firefox::Theme' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.

Component: Untriaged → Theme

I just tested on my person site, I tested with the following icons:
<link rel="icon" href="https://mysite.com/logo.png" sizes="any" />
<link rel="icon" href="https://mysite.com/logo.svg" type="image/svg+xml" />
<link rel="mask-icon" href="https://mysite.com/mask-logo.svg" color="#000000" />
<link rel="apple-touch-icon" href="https://mysite.com/apple-touch-icon.png" />
<meta name="msapplication-TileImage" content="https://mysite.com/logo_large.svg" />

When I bookmarked, logo.svg was not used since I can see the colour of svg did not change when using dark mode. If I remove
<link rel="apple-touch-icon" href="https://mysite.com/apple-touch-icon.png" />
then, Firefox would use logo.svg as favicon since I can see the colour changed...

Status: UNCONFIRMED → RESOLVED
Closed: 1 years ago
Resolution: --- → INVALID
Status: RESOLVED → UNCONFIRMED
Resolution: INVALID → ---

(In reply to BugBot [:suhaib / :marco/ :calixte] from comment #2)

The Bugbug bot thinks this bug should belong to the 'Firefox::Theme' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.

I think this is not a theme issue, the last similar ticket 1420435 belongs to 'Toolkit :: Places' component.

Component: Theme → Bookmarks & History

To make it easier for you to confirm, this website is using different favicon and apple-touch-icon at the time of this writing: https://universalis.app/

When bookmarked, all other browsers would use it's favicon shown on tab, only Firefox would use apple-touch-icon...

(In reply to Sola from comment #5)

To make it easier for you to confirm, this website is using different favicon and apple-touch-icon at the time of this writing: https://universalis.app/

When bookmarked, all other browsers would use it's favicon shown on tab, only Firefox would use apple-touch-icon...

This is not necessarily wrong. Since there is no specification around favicons, what other browsers do may not be the best choice, we try to optimize the icon choice for hi dpi screens
The site uses a 24x24 icon, we store it as 16x16 (we store 16, 32, and larger, and don't upscale). The site made poor choice of favicon sizes, a 32px icon would cover most of the cases.
When a favicon is requested by bookmarks we ask for an icon larger than 16x16. On my system (125% zoom) we'd ask for a 20px icon, on MacOS it would be 32x32... the only icon larger than the requested size at that point is the apple-touch-icon.
Would it be better to use the 16x16 in this case? Probably, and that's bug 1772264.

Status: UNCONFIRMED → RESOLVED
Closed: 1 years ago1 years ago
Duplicate of bug: 1772264
Resolution: --- → DUPLICATE

(In reply to Marco Bonardo [:mak] from comment #6)

(In reply to Sola from comment #5)

To make it easier for you to confirm, this website is using different favicon and apple-touch-icon at the time of this writing: https://universalis.app/

When bookmarked, all other browsers would use it's favicon shown on tab, only Firefox would use apple-touch-icon...

This is not necessarily wrong. Since there is no specification around favicons, what other browsers do may not be the best choice, we try to optimize the icon choice for hi dpi screens

Thanks for your reply.

However, this makes absolutely no sense. As you may known, standard apple-touch-icon is a 180*180 sized png specifically used for apple device homepage icon (https://developer.apple.com/design/human-interface-guidelines/app-icons). This has nothing to do with broswer at all. The website universalis is the a site I randomly found, which used a wrong sized icon (actually their color is also wrong, since apple devices will auto fill transparent background their apple-touch-icon would be a black mess in apple device.)

180*180 sized png usually are huge, can be in the range of 50-100kb or maybe even more. I don't really understand the ratinale of using such a large png for a small icon perpetually stored in your Firefox profile.

Actually, I just checked all other browsers, they don't even load apple-touch-icon since this html tag has absolutely nothing to do with non apple devices. I have no idea why Firefox would want to load it in the first place...

However, obviously what's good for Firefox is up to Firefox developers to decide.

Sometimes we need a larger favicon, for example for the New Tab Page, and then we use the touch icons.
It's also possible the site doesn't provide a usable basic favicon, and then the touch icon is better than nothing.
The logic should be fixed in bug 1772264 to prefer the non touch icon anyway.

(In reply to Marco Bonardo [:mak] from comment #8)

Sometimes we need a larger favicon, for example for the New Tab Page, and then we use the touch icons.
It's also possible the site doesn't provide a usable basic favicon, and then the touch icon is better than nothing.
The logic should be fixed in bug 1772264 to prefer the non touch icon anyway.

Thanks for your reply again.

I can understand the idea that something is better than nothing. However, apple-touch-icon together with msapplication-TileImage should be the least useable icon because these are designed to suit Apple homepage and windows startup page. Especially apple-touch-icon because apple icons have unique shape requirement and colour requirement that not applicable to anything else.

Currently, when apple-touch-icon is available it's the first choice, that's why I thought it made no sense...

Anyway, look forward to the fix, thank you for the great work.

You need to log in before you can comment on or make changes to this bug.