所以我正在做一些关于移动网站用户体验的研究，并偶然发现了整个 favicon.ico 已经完全过时的事实。
环顾四周，我发现我需要各种新的图像/图标集才能在各种移动设备（如 android、iphone 和 windows 手机）上正确呈现“favicon”。
现在这里的问题是，我有以下代码：
<link rel="apple-touch-icon" sizes="57x57" href="images/favicons/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="images/favicons/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/favicons/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="images/favicons/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/favicons/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="images/favicons/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="images/favicons/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="images/favicons/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="images/favicons/apple-touch-icon-180x180.png">
<link rel="icon" type="image/png" href="images/favicons/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="images/favicons/favicon-194x194.png" sizes="194x194">
<link rel="icon" type="image/png" href="images/favicons/favicon-96x96.png" sizes="96x96">
<link rel="icon" type="image/png" href="images/favicons/android-chrome-192x192.png" sizes="192x192">
<link rel="icon" type="image/png" href="images/favicons/favicon-16x16.png" sizes="16x16">
<link rel="manifest" href="images/favicons/manifest.json">
<meta name="apple-mobile-web-app-title" content="JoJo Productions">
<meta name="application-name" content="JoJo Productions">
<meta name="msapplication-TileColor" content="#00aba9">
<meta name="msapplication-TileImage" content="images/favicons/mstile-144x144.png">
<meta name="msapplication-config" content="images/favicons/browserconfig.xml">
<meta name="theme-color" content="#555555">
<link rel="shortcut icon" href="favicon.ico">
但对我来说，这只是一个太大的代码块，无法正确显示 favicon。所以我想知道我可以删除哪些内容，以及我绝对应该保留哪些内容才能在“大多数”移动设备上正确呈现。
大多数使用移动网站图标的其他网站只使用上述代码中的一小部分，即：57x57、72x72、114x114 和 144x144，这些都是 apple-touch-icons。那么图像/代码部分对 iPhone 或其他移动用户来说真的那么重要吗？或者是否有可能对其进行更优化？
无论哪种方式，感谢您提供的信息。
编辑
因此，通过一些进一步的研究，我得到了这个结果，这似乎在大多数现代设备上都可以正常工作：
<meta name="msapplication-config" content="images/favicons/browserconfig.xml">
<meta name="msapplication-TileImage" content="images/favicons/mstile-large.png">
<meta name="msapplication-TileColor" content="#ae8160">
<meta name="application-name" content="JoJo Productions">
<link rel="shortcut icon" sizes="16x16 24x24 32x32 48x48" href="favicon.ico">
<link rel="icon" type="image/png" sizes="32x32" href="favicon.png">
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
这对我来说当然更好，因为代码/图像的数量已经显着减少。只要它适用于大多数现代移动设备，我就很高兴。
结合这份“备忘单”、本教程和 Philippe B 的帮助，我设法做到了这一点。
无论哪种方式，感谢所有帮助，并希望在未来几年他们将为网站图标制定适当的标准！