In WordPress Settings>General, it is stated that “The Site Icon is what you see in browser tabs, bookmark bars, and within the WordPress mobile apps. It should be square and at least 512 by 512 pixels.”
I get that a site icon needs to be square, but I don’t know why it needs to be as large as 512×512 or larger.
Why the image would be used at a resolution higher than that of a favicon (which I understand to be 48×48px or smaller) and what would be the consequences of using a lower resolution image there?
However it isn’t essential that the image is greater than 512×512 pixels, it’s more important to be recognizable at 16×16 – but if it looks good at higher resolutions too, this is a great help for situations larger versions can be displayed.
WordPress 4.3 adds the ability for site owners to manage their site’s favicon on desktop and mobile. Site Icons work out of the box, are theme independent, and don’t require theme support. There are four sizes that WordPress supports by default:
- 32x32px favicon.
- 180x180px app icon for iOS up to the iPhone 6+.
- 192x192px Android/Chrome app icon.
- 270x270px medium-sized tile for Windows.
If you upload a lower image resolution size than 512 x 512, WordPress core will ask it to crop the small image to 512 x 512 size.
What is a favicon?
A favicon is a small icon that displays by your page title in the browser tab – It is also saved next to bookmarks, and can become a mobile home screen icon, or desktop icon if a bookmark is saved to these locations.
It makes sense to keep the file size down as it’s the first graphic that needs loading on every page of your site.