/

给网站添加保存到移动设备主屏的 icon

By adding an iOS icon, anyone who decides to save your webpage to the home screen of their iPhone, iPad, or Android will see a nice app-like icon rather than an image of your page.

Here is a table of the current iOS icon sizes from Apple:

iPhone 6/7, iPhone SE iPad / iPad Mini iPad Pro iPhone 6/7 Plus
120×120 152×152 167×167 180×180

For Android icons you’ll want to follow these specifications:

Android Regula Android Hi-Res
1128×128 192×192 
<link href="http://www.yoursite.com/apple-touch-icon.png" rel="apple-touch-icon" />
<link href="http://www.yoursite.com/apple-touch-icon-152x152.png" rel="apple-touch-icon" sizes="152x152" />
<link href="http://www.yoursite.com/apple-touch-icon-167x167.png" rel="apple-touch-icon" sizes="167x167" />
<link href="http://www.yoursite.com/apple-touch-icon-180x180.png" rel="apple-touch-icon" sizes="180x180" />
<link href="http://www.yoursite.com/icon-hires.png" rel="icon" sizes="192x192" />
<link href="http://www.yoursite.com/icon-normal.png" rel="icon" sizes="128x128" />

Make the first apple one the 120 x 120.

If you don’t want to create all these images, you should at least create the larger resolution ones. That way they’ll look good on the hi-res devices.

References: