Icons for iOS & iPadOS

[00:00:00]
>> Maximiliano Firtman: So iOS, as we saw, work with the icon that you set in the manifest, which is perfectly fine. They will use an icon from the manifest, the same happens on macOS as well, not a problem at all. But if we want, we can specify an specific icon for Apple platforms using a link, that will override the one that you have in the manifest.

[00:00:25]
So Apple said that, yeah, they realize, I mean the excuse they gave us, that it's true anyway, because Apple got laid into the into accepting PWAs. Using the standards, actually, we remember that actually Apple created this, Apple was the first one. But then the Web App Manifest was something that appeared later, Chrome pushed the Web App Manifest, and Apple didn't implement the Web App Manifest initially.

[00:00:54]
So because they were late to the party, most of the icons for PWAs were optimized for Android because it was the platform supporting PWAs. When Apple started to implement the manifest, they said that they did a test on many PWAs and they realized that the icon didn't look good on iOS.

[00:01:16]
So they were not iOS optimized, they were targeting Android. For example, in iOS, we don't have transparent icons, you cannot use transparencies. And they said that they found transparencies, blah, blah, blah. But anyway, you can override the default manifest icon only for Apple using a link. Link rel apple-touch-icon.

[00:01:39]
So now you go to the HTML not to the manifest. And you specify a different one, if you want it's not mandatory, and you can provide a lot one for each resolution, for iPad they have different resolution. But if you wanna provide only one that's my recommendation you don't need at this point to provide several versions.

[00:02:01]
It should be 180 x 180, at this point, the largest resolution that actually an iPad Pro is using for an app cycle.