Icons on "new tab" shouldn't require any user help to resize them.

[OneOfMany07]

I was finally annoyed enough that the various icons on for the site's I've visited are sometimes nice and big, looking high quality.  And other times they're oddly small.  Even on popular big sites.  Many like Slashdot, Gmail, and my local Netgear router have a smaller icon.  Others like Audible, Reddit, and ArsTechnica are bigger.

I did a search and find a ton of posts about the same issue.  Generally with nothing useful or telling the user to manually modify the user CSS info.  Like this post from a year ago https://support.mozilla.org/gl/questions/1356680   There was another from 2 years ago, and many I didn't open.

I tried to search for how site creators should create this image correctly, but never found anything.  I don't even know what to call it.  Is this the "favicon"?  That is used when bookmarking a site (right?).  Or a different standard name and location?

Either way, Firefox needs to explain what would fix this...or it should adapt itself like the above post recommends (which seems to zoom a bit more in general, and zoom more at maximum).

I'll also mention that the new tab page being terrible was one of the final straws that made me start looking for a replacement (after switching away from Chrome when they prevented ad blockers with the new extension format).  I even installed an extension to enhance the "new tab" page, but it didn't change anything at the time (uninstalled again).

[Jon]

Thanks for submitting an idea to the Mozilla Connect community! Your idea is now open to votes (aka kudos) and comments.

[jscher2000]

Background on Site Icons (Favicons)

Websites traditionally saved a 16x16 pixel file named favicon.ico in the root directory of the site and browsers automatically used that. If the file was in a different location, or had a different name, sites could add a tag to each page similar to the following to point the browser to the file:

<link rel="icon" type="image/x-icon" href="/images/favicon.ico">

With the popularity of mobile browsers, sites now tend to include multiple link tags pointing to files of different sizes for different browsers. For example, you'll find a lot like this:

<link rel="apple-touch-icon" sizes="120x120" href="//www.redditstatic.com/desktop2x/img/favicon/apple-icon-120x120.png" />

Ref. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#providing_icons_for_different_usage_c...

Shortcuts on Firefox's new tab page

According to an older article, Firefox will prefer a site icon in SVG format, as those usually are readily scalable, or try to find a bitmap image that is at least 96x96 pixels. For one of my sites, to avoid scaling, I specified a 256x256 pixel icon:

<link rel="icon" type="image/png" sizes="256x256" href="https://www.userchrome.org/img/Fxcss_256.png">

Very often, Firefox only finds a small icon and shows that on a large background. As far as I know, the only way for end users to override Firefox's icon selection for a new tab page shortcut is to substitute your own image file for the site icon. (Hover the icon, click the ••• when it appears, then click Edit, then click "Use a custom image...".) The problem with this is that you need a URL for the alternate image, which may be hard to track down, or might not even exist.

It certainly would be nice if this could be customized a lot more easily!

And the Mozilla Support thread addresses the overabundance of white space around icons, limiting their size regardless of the source icon supplied by the website. It would be great if that were adjustable as well.