サイトアプリ化をMacで進める手順｜選定から動作確認まで

サイトアプリ化をMacで調べている時点で、状況はだいたい決まっています。タブが横に並びすぎて、毎朝同じ3つを目で探している。作業そのものは10分ほどで終わり、技術的に難しい部分はほとんどありません。手間が増えるとしたら、順番を飛ばして作り直す場合です。ここでは、どのサイトを選ぶかから、作ったあとに何を確かめるかまでを、実際に手を動かす順番で並べます。

手順に入る前に決めておく2つのこと

最初に決めるのは、対象を1つに絞ることと、そのサイトに何を求めるかの2つです。ここを飛ばすと、思いついたサイトを次々に包んでしまい、Dockが第二のタブバーになります。

対象の目安ははっきりしています。1日に3回以上開き、しかも閉じると作業が止まるサイトです。カレンダー、社内の管理画面、チャット、メールがここに入ります。逆に、週に1回しか開かない請求サイトや、調べ物のたびにURLが変わるサイトは向きません。開く回数が少ないものをアプリにすると、Dockに常駐するのに使われないアイコンが増えるだけです。

もう1つの「何を求めるか」は、次の4つのどれかに落ち着きます。

• 独立した窓が欲しい。ほかのタブと一緒に閉じてしまうのを止めたい
• 同じサービスの2アカウントを、切り替えずに同時に開きたい
• 通知をDockのバッジで受け取りたい
• アイコンで見分けたい。Command+Tabの並びで迷いたくない

この4つのうちどれが本命かで、あとで選ぶ道が変わります。求めるものが「窓を分けたいだけ」なら、macOSに含まれている機能で足ります。「2アカウント」や「アイコンの差し替え」まで欲しくなると、道具の側に選択肢を求めることになります。

手順の全体像を先に並べる

全体は5つのステップに分かれます。実際の作業時間より、確認と試運転のほうが長い点が特徴です。

ステップ	やること	目安の時間	つまずきやすい点
1 選定	対象のサイトを1つ決める	5分	候補が多すぎて絞れない
2 準備	ログインとアカウントを整理する	10分	2段階認証のコードが手元にない
3 作成	作り方を1つ選んで作る	3分	メニュー項目が見つからない
4 確認	動作を6項目たしかめる	15分	再起動後にログインが切れる
5 定着	1つだけで1週間使う	7日	作ったまま使われない

急いでいるときに削りたくなるのはステップ4ですが、ここを飛ばすと、使い始めて数日たってから困りごとに気づきます。数日たった時点では、原因が包み方にあるのか、サイト側の仕様なのかが切り分けにくくなっています。

手順1 包む前にブラウザ側を整えておく

包む作業そのものよりも、この準備で結果が変わります。理由は、作ったアプリがログイン情報をどこから引き継ぐかが、作り方によって違うからです。

Safariの機能で作った場合、そのアプリはSafariとCookieや設定を共有しません。つまり、作った直後に必ずもう一度ログインする必要があります。Chromeの機能で作った場合は、いま使っているプロファイルのセッションをそのまま引き継ぐため、多くの場合そのまま開けます。専用の道具で作った場合は、道具ごとに独立した保管場所を持つのが一般的で、こちらも初回のログインが必要です。

準備としてやることは3つです。パスワードマネージャをすぐ開ける状態にしておくこと。2段階認証のコードを出す端末を手元に置くこと。そして、そのサービスで複数のアカウントを使っているなら、どのアカウントをそのアプリに入れるかを先に決めておくことです。

3つ目は後回しにされがちですが、あとから変えるのが最も面倒な部分です。1つのアプリの中でアカウントを切り替える運用にすると、切り替えを忘れて別のアカウントで送信する事故が起きます。用途ごとにアプリを分け、アプリの名前にアカウントの用途を入れておくほうが、結果として直しの回数が減ります。

手順2 作り方を1つ選んで作る

macOSで選べる道は大きく3つあります。ここでは選び方ではなく、実際の操作の入口だけを並べます。

Safariで作る場合は、対象のページを開いた状態で、メニューバーの「ファイル」から「Dockに追加」を選びます。名前を入力して追加すると、その時点でアプリとして保存されます。この機能はmacOS Sonoma 14以降で使えます。

Webアプリがホームフォルダの「アプリケーション」フォルダに保存され、DockやSpotlightからも開けるようになります。 出典: support.apple.com

保存先がホームフォルダの中である点は覚えておく価値があります。あとで消したくなったときに探す場所がここになるためです。

Chromeで作る場合は、右上のメニューから該当の項目を選びます。版によって「ショートカットを作成」「アプリとしてインストール」など呼び名と場所が変わるため、メニューの文言が資料と違っていても慌てる必要はありません。ショートカットを作成する側を選んだときは、「ウインドウとして開く」のチェックを入れないと、ただのブックマークになります。

専用の道具で作る場合は、URLを渡すか、用意された雛形から選ぶ形になります。アイコンや、リンクを外のブラウザに逃がすかどうかといった設定を、作る時点で決められるのがこの道の特徴です。

手順3 作った直後にたしかめる6項目

作った当日のうちに、次の6つを通しておきます。どれも数分で終わり、あとで気づくと原因の切り分けが難しくなるものばかりです。

• Macを再起動しても、ログインが残っているか
• 通知が届き、Dockのアイコンにバッジが出るか
• アプリの中のリンクを押したとき、窓の中で開くのか、ブラウザに飛ぶのか
• ファイルをダウンロードしたとき、どこに保存されるか
• 印刷とPDFの書き出しが通るか
• コピーと貼り付け、ファイルのドラッグが期待どおりに動くか

3つ目は業務用のサイトで特に効きます。社内の管理画面から外部のヘルプに飛ぶ設計になっている場合、窓の中で開いてしまうと戻る手段が乏しくなります。逆に、すべてブラウザに逃げる設定だと、アプリの中で完結させたい操作まで外に出ます。どちらが正しいかはサイトによって違うので、実際に押して確かめるほかありません。

1つだけ当日には分からないものがあります。数週間で切れる種類のセッションです。14日後に再ログインを求められる設計のサービスでは、その日が来るまで挙動が確認できません。だからこそ、最初は1つだけ作って様子を見る順番に意味があります。

手順4 名前とアイコンと開き方を決める

ここは見た目の話に見えて、実際には毎日の操作回数に効く部分です。

名前は、Spotlightで打つ2文字か3文字で一意に決まるものにします。同じサービスを用途別に2つ作るなら、「メール 社内」「メール 顧客」のように用途を入れておくと、Command+Tabの並びでも取り違えません。アイコンが既定のファビコンのままだと、小さく表示されたときに見分けが付かず、切り替えのたびに一瞬止まります。

開き方も決めておきます。毎朝必ず使うものは、システム設定からログイン項目に追加しておくと、Macを開いた時点で立ち上がっています。反対に、集中を切らせたくないチャットは、ログイン項目には入れず、必要なときだけDockから開く形にしたほうが働きます。

Dockに置く位置も固定しておく価値があります。位置が毎回変わると、アイコンを目で探す時間が戻ってきます。よく使う順に左から並べ、その並びを変えないだけで、探す動作が減ります。

手順5 1つだけで1週間使ってから増やす

作ったあとにやることは、増やすことではなく、1つを7日間使うことです。

判断は単純です。この1週間、同じサイトをブラウザのタブでも開いてしまった回数を数えます。ゼロに近ければ、そのサイトはアプリにする価値がありました。半分以上をブラウザで開いていたなら、そのサイトは検索やリンクから入る使い方が主で、独立させても定着しません。

2つ目以降を増やすときも、この基準をそのまま使います。経験的に、この形で長く残るのは1人あたり3つから5つの範囲に収まります。それを超えると、Dockの中で目的のアイコンを探す時間が発生し、タブを探していたときの状態に戻ります。

業務のサイトで追加になる確認

対象が社内システムや取引先の管理画面である場合、個人で使うサービスにはない確認が3つ増えます。ここを飛ばすと、作った本人だけが使える状態で止まります。

1つ目は認証の方式です。社内システムはシングルサインオンや、証明書を使う認証を挟んでいることがあります。ブラウザに入れた証明書や、ブラウザの拡張機能に依存する認証は、包んだアプリの中では動かない場合があります。判定は簡単で、包んだアプリでログインを最後まで通せるかを1回試せば分かります。

2つ目は、社内の規定です。業務データを扱う画面を、承認されていない道具で包んでよいかは、情報を扱う部署の判断が要る話です。macOSやブラウザに標準で含まれる機能だけを使うのか、外部の道具を入れてよいのかを先に確かめておくと、あとで作り直しになりません。

3つ目は、同じ手順をほかの人が再現できるかです。1人が手元で作っただけでは、隣の人の環境では別の見た目になります。どのサイトを、どの道で、どんな名前で作ったかを1行ずつ書いた覚え書きを1つ置いておくと、増員のたびに同じ調査をやり直す手間が消えます。

手順が止まる場面と、そこからの戻し方

つまずく場所はおおむね3つに分かれます。

1つ目は、メニューに項目が見つからない場合です。SafariでDockに追加が見当たらないなら、macOSのバージョンがSonoma 14より前である可能性があります。Chromeでメニューの階層が資料と違う場合は、版が変わって項目が移動しています。

2つ目は、作ったアプリが白いまま何も表示されない場合です。ブラウザの拡張機能に依存していたサイトや、Cookieを厳しく制限する設定にしているとき起こります。この場合は、いったん別の作り方で作り直すほうが早く終わります。

3つ目は、消し方が分からなくなる場合です。Safariで作ったものはホームフォルダのアプリケーションフォルダに入っているので、そこからゴミ箱へ移します。専用の道具で作ったものは、道具の側の一覧から消すのが確実です。

いずれの場合も、失敗しても元のサイトには何も起きません。作り直しの費用がほぼゼロである点が、この作業を気軽に試せる理由です。

対応の一覧と料金から、次の一手を決める

道具の側を検討する段階に入ったら、機能の一覧より先に見ておくと判断が早くなる情報が2つあります。

1つは、想定されている使い方です。この種の道具の対応サービス一覧には300を超える雛形が並ぶものもあり、その並びを見れば、チャットとメール中心なのか、社内の管理画面まで想定しているのかが分かります。どんな設定を持つかはできることの一覧で確認でき、実際の作業の細かさは使い方ガイドを見れば見当が付きます。包みたいサービスが名前で並んでいるかは対応サービス一覧で先に確かめておくと、作ってから引き返す手間が減ります。300以上のプリセットからすぐ作れる形になっていれば、URLを調べて手で入力する工程がまるごと省けます。

もう1つは費用の形です。買い切りか継続課金か、対応するmacOSのバージョンがどこまでかを料金で先に見ておくと、あとで乗り換える手間が減ります。判断に迷う細かい点の多くはよくある質問に整理されているため、作り始める前に一度目を通しておく価値があります。

そして、この3つの道は排他ではありません。通知が要るものはSafariの機能で、拡張機能が必要なものはChromeで、アイコンとリンクの扱いまで決めたいものだけ専用の道具で作る。実際に長く残っている構成は、この混在型がほとんどです。