html5 在手机桌面添加图标，手机有一个书签栏上可以将当前在浏览的网页添加到主屏幕，用户添加该选项之后，就可以从桌面上启动这个程序，让人看起来有点像web app一样，深受许多人的喜爱。但是很多人却不知道或者懒得去设置，本文将介绍一个提示用户添加到主屏幕。

的网页图标与传统的网页 favicon 相似, 处理方式也差不多, 下面会为你介绍几种处理方式.

为页面指定一个图标路径, 在网页的 head 部分代码如下:

在网页中为不同的设备指定特殊图标, 因为 和 iPad 的图标尺寸不一样, 需要 sizes 属性来进行区分, 如果没有定义 sizes 属性, 默认

如果没有图片尺寸可以匹配设备图标的尺寸, 存在比设备图标大的图片, 将使用比设备图标尺寸略大的图片; 如果没有比设备图标大的图片, 则使用最大的图片.

通过添加一个JavaScript代码来邀请用户添加到主屏幕，该库使用了的本地存储跟踪是否已经显示过了，以避免重复出现。

目前使用比较多和有在更新的一个库来自这里：

它可以在Safari或者Chrome移动版中出现如下的提示消息（有不同语言，中文等）

最后，如果你使用jqMobile，你还可以看看另外一个版本：

以上两个版本均有这个库的影响：