如何选择适合网站的图标大小？

Love The Way You Lie 2024-03-17 13:24 7阅读 0赞

网站图标（“收藏夹”和“图标”的组合）是用于快速识别网站的小图像。 这些可以在浏览器选项卡的左侧找到，也可以在移动设备的主屏幕上作为触摸图标找到。 要为网站制作网站图标，您可以使用品牌徽标或企业徽标。 由于网站图标的空间有限，它们通常最终成为徽标的一小部分或重新设计。 无论网站类型如何，大眼仔都建议添加网站图标。 网站图标为网站提供专业的外观，帮助用户更轻松地找到网站，并可以间接提高网站的 SEO 排名。

![93b2f2549d5d1c85634e0b35dac55f59.png][]

WordPress 网站图标

### 推荐的图标大小是多少？ ###

网站图标大小有严格的限制。 对于大多数浏览器，默认情况下建议使用 16 x 16 或 32 x 32 像素。 对于高分辨率屏幕，建议使用较大的网站图标尺寸，较小的网站图标可用于一系列不同的选项。 最好添加两种格式。

### Google 使用哪种网站图标大小？ ###

除了上面提到的两种不同的图标大小之外，还有其他格式可能更适合，具体取决于浏览器。 Google Chrome 使用 48 x 48 像素在其搜索结果中显示网站图标。 也可以使用此尺寸的倍数，例如 96×96 像素或 144×144 像素。 这些网站图标尺寸在 Android 系统上也很重要。 这是因为操作系统使用这种大小的网站图标作为主屏幕上的快捷方式。 对于屏幕分辨率更高的设备，您可以使用 192 x 192 像素。

### Apple 设备使用哪种图标大小？ ###

对于他们的竞争对手 Apple，情况要复杂一些。 网站图标大小因设备而异。 对于 iPhone，使用 60 x 60 像素尺寸。 您可以使用更高的分辨率，前提是它是该分辨率的倍数。 这允许网站图标以更高的分辨率更好地显示，然后在需要时缩小。 180 x 180 像素的图像是不错的选择。 另一方面，iPad 上的图标保存为 83.5 x 83.5 像素。 在 167 x 167 像素的现代 Retina 和 Super Retina 显示屏上。

### 最重要的网站图标尺寸是多少？ ###

网站图标大小因浏览器版本和终端设备而异。 以下是常见尺寸的列表：

<table> 
 <tbody> 
  <tr> 
   <td><strong>浏览器或设备</strong></td> 
   <td><strong>大小</strong></td> 
  </tr> 
  <tr> 
   <td>大多数现代浏览器</td> 
   <td>16 x 16 或 32 x 32 像素</td> 
  </tr> 
  <tr> 
   <td>谷歌和安卓</td> 
   <td>48 x 48 或 192 x 192 像素</td> 
  </tr> 
  <tr> 
   <td>苹果手机（较新的型号）</td> 
   <td>60 x 60 或 180 x 180 像素</td> 
  </tr> 
  <tr> 
   <td>iPad （较新的机型）</td> 
   <td>83.5 x 83.5 或 167 x 167 像素</td> 
  </tr> 
  <tr> 
   <td>Chrome&nbsp;应用商店</td> 
   <td>128 x 128 像素</td> 
  </tr> 
  <tr> 
   <td>Google TV</td> 
   <td>96 x 96 像素</td> 
  </tr> 
  <tr> 
   <td>Internet Explorer 9</td> 
   <td>24 x 24 像素</td> 
  </tr> 
  <tr> 
   <td>iPad 主屏幕</td> 
   <td>72 x 72 像素</td> 
  </tr> 
  <tr> 
   <td>iPhone（旧型号）和 iPod Touch</td> 
   <td>57 x 57 像素</td> 
  </tr> 
  <tr> 
   <td>iPhone 4 主屏幕</td> 
   <td>114 x 114 像素</td> 
  </tr> 
  <tr> 
   <td>Opera 快速拨号</td> 
   <td>195 x 195 像素</td> 
  </tr> 
 </tbody> 
</table>

### 哪些文件格式可用于网站图标？ ###

您可以为网站图标使用不同的图像格式。 Windows 图标 .ico 被广泛使用，因为它受到一系列浏览器的支持。 .png 格式特别适用于触摸图标等较大的图像。 您还可以使用 .svg 或 .gif 格式。

### 如何为 Wordpress 网站添加网站图标？ ###

生成器是创建网站图标的绝佳工具，尤其是当您希望在第一时间确保格式正确时。 生成器会指导您创建网站图标的每一步，并确保您的网站图标尺寸适合所有相关浏览器。

<table> 
 <tbody> 
  <tr> 
   <td> <p>1<br> 2<br> 3<br> 4<br> 5</p> </td> 
   <td> <p>&lt;head&gt;<br> &nbsp; &nbsp;&nbsp;&lt;meta charset="UTF-8"&gt;<br> &nbsp; &nbsp;&nbsp;&lt;title&gt;大眼仔旭&lt;/title&gt;<br> &nbsp; &nbsp;&nbsp;&lt;link&nbsp;rel="icon"&nbsp;href="./image/favicon.ico"&gt;<br> &lt;/head&gt;</p> </td> 
  </tr> 
 </tbody> 
</table>

一般情况下，收藏图标的文件名为“favicon.ico”，可以将该文件放置在网站根目录下。如果需要使用其他文件名或路径，需要相应地修改“href”属性的值。

给网站添加一个图标是非常有必要的，可以提高网站的品牌形象、用户体验、专业性和流量，同时还有助于提高搜索引擎排名。

[93b2f2549d5d1c85634e0b35dac55f59.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/bb397d423f474b3fa9bf45bebcce5fc2.png