ページのソースコードに以下のメタタグを挿入します:
<meta name="apple-mobile-web-app-capable" content="yes">
↑, yes
に設定すると、フルスクリーンモードで実行され、ブラウザにリダイレクトせず、上下のツールバーも表示されません
<meta name="apple-mobile-web-app-status-bar-style" content="default">
↑, ステータスバーの色を設定します(最初のタグを追加する必要があります)。default / black-translucent / black
のいずれかを選択できます
説明(Apple 公式ドキュメントからの翻訳):
コンテンツをdefault
に設定すると、ステータスバーは通常表示されます。black
に設定すると、ステータスバーは黒い背景で表示されます。black-translucent
に設定すると、ステータスバーは黒い半透明になります。
default
またはblack
に設定すると、ステータスバーの下にウェブコンテンツが表示されます。black-translucent
に設定すると、ウェブコンテンツが画面全体に表示され、一部がステータスバーに覆われます。
デフォルト値はdefault
です。
インストールと使用方法:
Safari ブラウザ -> 共有 -> ホーム画面に追加
デスクトップ上のウェブサイトのアイコンをタップすると、ウェブサイトが新しいウィンドウで独立して実行され、ブラウザのブックマークとして開かれることはありません