最能代表一个公司或品牌的东西之一就是它的徽标，这就是为什么它应该出现在网站图标或图标中，以便当访问者浏览我们的页面时，它会被保存在收藏夹中或链接会保存在移动设备上，出现我们公司的标志。
目前，大多数网站已经使用浏览器的图标，但尚未针对其他设备或系统优化其余图标。接下来，我们将了解为所有设备和操作系统指定图标的正确方法。
如何为浏览器创建图标
我们假设我们的公司徽标采用 512px x 512px 的 .png 图像，因此我们必 手机号码数据 须生成.ico 格式的 16px x 16px 图像，这是我们最终用作网站图标的图像。
要为浏览器或网站图标生成此图标，我们可以使用免费的在线工具，例如DynamicDrive提供的工具，该工具还为桌面版本的 Windows 生成相应的图标，这样，如果有人将浏览器图标拖到桌面上，他们就会使用较大的版本，以便可以正确看到。
为了标准化，生成的图像必须称为 favicon.ico，并且必须放置在我们网站的根目录下。例如，在我们的网站上，它位于https: //www. con.ico。现在我们只需在页面 HTML 的 <head> 部分中指示图标所在的路径，为此，我们将使用以下代码：
<link rel=”shortcut icon” href=”/favicon.ico” type=”image/x-icon” />
默认情况下，大多数浏览器会检查根目录中是否存在 favicon.ico 文件，而不指定上述代码，但最好指定它，以防浏览器不这样做。
目前，浏览器已经支持 .png 或 .gif 格式的图标，但建议继续使用 .ico 格式以与旧版浏览器兼容。
如何为 iPhone、iPad 和 Android 创建图标或网页剪辑
Apple 发明了一个规范来声明iPhone 的图标，后来他们在所有设备上 改进的 SiteGround 电子邮件营销工具 采用了该图标，并且 Android 从 2.1 版开始支持该图标。
<link rel=”apple-touch-icon” href=”/apple-touch-icon.png” />
该图像必须是 57px x 57px .png。 iOS 设备会自动应用效果，使其 by 列表 看起来像按钮、圆角、应用阴影等。最后一种格式与 Android 设备不兼容，因此我不建议使用它。如果您不希望应用这些效果并支持Android，则必须将代码更改为以下内容：
在 <head> 部分中指定的代码如下：
<link rel=”apple-touch-icon-precomposed” href=”/apple-touch-icon-precomposed.png” />
随着Apple设备分辨率的扩大，图标需要越来越大，以便它们能够在视网膜显示屏上正确显示并且看起来不像素化。为此，Apple 引入了先前代码的变体，其中指定了图标的大小，以便不同的设备可以选择最适合其屏幕分辨率的图标。Apple 的图标大小规范是通过“sizes”属性完成的。
