其实这个功能早在 2.x 版本就加入了，那时候对 PWA 并没有什么概念。好想换 iPad Mini (new)
目前 3.x 只改了启动图，适配了 iPad 横屏和 iPhone 全面屏（普通屏和plus后续加）。之前看到苹果对 PWA 持拒绝态度我是震惊的，你 tm 早就给 safari 加入了这个功能，也有相关meta配置（包括”识别为WebApp“），然后你告诉我这东西不是 PWA？
本来确实想支持 PWA 的，想到除了要 manifest.json，还要搞定对应生成 service worker，使用不是很友好，所以取消计划。这部分添加功能就是一个尝试的甜点，所以也没有拿出来说。目前 3.x 开启 pjax 然后添加到桌面，阅读体验还是挺好的。
所以这次打算讲讲「苹果式网页应用安装」，其实挺简单的。
meta
这里没有列出所有关于 safari 支持的 meta，只针对这个功能部分。
<meta name="apple-touch-fullscreen" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-title" content="Colmugx's Blog">
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<link rel="apple-touch-icon" sizes="72x72" href="icon.ico">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="icon.ico">
<link rel="apple-touch-startup-image" media="(device-width: 375px)" href="apple-launch-1125x2436.png">
<link rel="apple-touch-startup-image" media="(orientation: landscape)" href="apple-touch-startup-image-2048x1496.png">从上到下分别是：
- 添加到主屏幕后，是否全屏显示
- 是否显示 safari 菜单
- 应用默认名称（在添加的时候可以修改）
- 打开时，顶上状态栏应该呈现什么颜色（白色，黑色，透明）
- 设置 icon (72x72, 114x114)，图标在「书签」也可适用
- 设置启动画面（这里只设置了手机与平板横置）
apple-touch-startup-image
其他的没什么坑点，只是apple-touch-startup-image会复杂一些。它分成很多分辨率，设置不清楚的话就不会显示。而且它不能像图标一样设置size。只能用media一行一行写。
比如 iPad，设置倒是不需要跟手机一样那么多图片，只需要准备一张垂直一张水平。垂直 768x1024，水平748x1024，水平图也需要摆成垂直的，也就是1024x748，当然内容也是横直，相当于顺时针 90°。接着就考虑一下屏幕用的是二倍图还是三倍图了。
参考文章：Adding Custom iOS Splash Screens To Your Progressive Web App