FirefoxでWebページを保存する方法｜「完全」と「HTMLのみ」の違いと画像フォルダーの扱い

ネットにつながらない場所で読みたい攻略表や、サポートが終わりそうなメーカーの設定手順があります。ブックマークだけだと、ページが消えたり書き換わったりしたときに何も残りません。

Firefoxでは、ページを開いてCtrl＋Sを押し、「ファイルの種類」で「ウェブページ、完全」を選ぶと、HTMLと画像などの付随ファイルを保存できます。保存先には、HTMLファイルの横に「ファイル名_files」というフォルダーが作られます。この2つは組で、片方だけ別の場所へ移すと図が表示されなくなります。

操作はWindows 11のデスクトップ版Firefoxが対象です。「完全」と付いていても、サイト全体が手元で動くわけではありません。サーバーに問い合わせる検索や、保存していない別のページには届かないので、保存したあとに開き直して、必要な文章と図が読めるかを確かめてください。

出典：Firefoxソースコード contentAreaUtils.js・Firefox日本語UI文字列 contentAreaCommands.properties・Firefoxソースコード browser-sets.inc.xhtml・MDN ファイルの扱い方・MDN クライアントとサーバーの概要

形式「完全」と「HTMLのみ」は、画像を残すかで選ぶ

保存画面の「ファイルの種類」には、日本語表示のFirefoxで「ウェブページ、完全」「ウェブページ、HTML のみ」「テキスト ファイル」が並びます。図を見ながら使うページなら、選ぶのは「ウェブページ、完全」です。

Firefoxの実装では、「完全」と「テキスト」だけがページの内容を読み込んで保存し、「HTML のみ」はページのアドレスからHTMLだけを取得する形です。「完全」のときだけ、保存したファイルの名前に「_files」を付けたフォルダーが隣に作られます。

迷ったら、あとで見る内容に図が必要かで決めます。設定画面の図やボタンの位置が要点のページを「HTML のみ」で残すと、文章は読めても図が欠けます。短い注意書きをメモに写すだけなら、テキストでも足ります。

手順Ctrl＋Sで保存し、Ctrl＋Oで開き直す

1. 保存したいページをFirefoxで開き、必要な説明や図が画面に出ていることを確かめます。
2. Ctrl＋Sを押します。
3. 保存先に、そのページ専用のフォルダーを選びます。先にエクスプローラーで作っておくと整理しやすくなります。
4. ファイル名を付け、「ファイルの種類」で「ウェブページ、完全」を選んで保存します。
5. FirefoxでCtrl＋Oを押し、保存したHTMLファイルを選んで開き直します。

Ctrl＋SはFirefoxの「ページを保存」、Ctrl＋Oは「ファイルを開く」のショートカットです。HTMLファイルをダブルクリックすると別のブラウザーが開くことがありますが、FirefoxのCtrl＋Oから指定すれば、Firefoxで確認できます。

元のタブを見て確認を終えない

保存前から開いていたタブは、控えの確認になりません。Ctrl＋Oで開き直したタブのアドレスが「https://」ではなく、パソコン内のファイルを示す「file:///」で始まっているかを見ます。以前に保存した同名のファイルを開いて「今回もできた」と思い込まないよう、保存先のフォルダーも確かめてください。

保存先の親フォルダーには「周辺機器設定_1016」のように、用途と保存した日が分かる名前を付けると、ほかのページの保存一式と混ざりません。元のページのURLと、読んだ時点の日付は別にメモしておきます。保存日は自分の控えを作った日で、元の記事の更新日ではありません。

フォルダーHTMLと「_files」フォルダーは、組にして保管する

「完全」で保存すると、HTMLの隣に、HTMLと同じ名前に「_files」を付けたフォルダーができます。たとえば「setup.html」を保存すれば「setup_files」です。これは消してよい残骸ではなく、画像などの付随ファイルが入った、HTMLの一部です。

Webページの画像は、HTMLに書かれた「ファイルの場所」を頼りに表示されます。同じフォルダーの中か、下のフォルダーかといった位置関係が、そのまま指定になります。HTMLだけ別の場所へ移し、フォルダーを元の場所に残すと、参照先が見つからず、図が出なくなる原因になります。

整理するときは、次の4点を守ると取り違えが減ります。

• HTMLと「_files」フォルダーは、保存前に作った親フォルダーの中にまとめる
• 別の保存場所へ移すときは、親フォルダーごとコピーする
• 「_files」フォルダーの名前や中身のファイルを、個別に変えたり整理したりしない
• コピー先でHTMLを開き直し、必要な図を確かめるまで元の一式を消さない

これはファイルの参照関係を壊しにくくするための保管方法です。フォルダーをまとめても、保存内容が完全に再現されたことの保証にはなりません。

HTMLだけコピーして画像が消えたとき

まず、元の保存先に「_files」フォルダーが残っていないかを見ます。残っていれば、HTMLとフォルダーを組にしてコピーし直し、コピー先から開きます。名前や位置をどこまで変えたか分からなくなったら、ページがまだ開けるうちに、空のフォルダーへ「ウェブページ、完全」で保存し直すのが早道です。古い控えへ上書きせず、新しい控えで必要な図を確かめてから、古い方を整理してください。

オフライン読める内容と、動かない機能を分けて考える

保存したページに検索欄やリンクが見えていても、その先の処理まで手元に入ったとは限りません。サイト内検索やフォームの送信は、ブラウザーがサーバーへリクエストを送って結果を受け取る仕組みです。保存したあとにページ内で検索や送信をしても、手元にはサーバーがないので、新しい結果は取得できません。サーバー側のプログラムも保存されません。

つまり、保存済みの本文を読むことと、サーバーへ問い合わせる操作や未保存の別ページを開くことは、別の話です。手順が次のページへ続くなら、そのページも個別に開いて保存し、同じ親フォルダーに分けて置いておきます。

出かける前に確かめる項目

ネットにつながらない場所で使う予定なら、Wi-Fiを切った状態でも保存ファイルを開き、次の点を確かめておきます。通信中のゲームやダウンロードを止めてまで行う必要はなく、影響のないときで構いません。

• 冒頭だけでなく、実際に使う箇所と末尾まで読める
• 必要な画像、表の見出し、注意書きが揃っている
• クリックして開かないと見えない説明が、閉じたままになっていない
• 次の手順が別ページなら、その控えも開ける

基準は「保存が終わったか」ではなく、「自分が必要な内容を読めるか」です。攻略表を読むだけなのか、接続の復旧手順を最後まで進めたいのかで、そろえるページの数は変わります。

崩れる保存後に崩れたときは、最初からか移動後かで分ける

画像で補うときは、型番や注意書きを切り落とさないようにします。Windowsの撮影でPrintScreenの動作に迷うときは、PrintScreenとSnipping Toolの設定を確認する記事を参照してください。

まとめまとめ｜「完全」で保存して、HTMLとフォルダーを組で開き直す

図を含むページを残すなら、Ctrl＋Sの保存画面で「ウェブページ、完全」を選びます。できたHTMLと「_files」フォルダーは組にして保管し、コピーしたらCtrl＋Oでコピー先のHTMLを開き直してください。

「HTML のみ」は画像が残らず、「完全」でも検索や未保存の別ページは使えません。最後は、オフラインで必要な文章と図が読めるかで判断します。

あわせて読みたい

トラブル・設定

PrintScreenとSnipping Toolの設定

トラブル・設定

ブラウザーのダウンロード先を変更する方法