browser-773217_640swe

以前の記事で紹介した Web ツール「 snapito 」がサービス終了となっていた。それで、代わりになる Web ツールを探しているのだけれど、よいサービスがまだ見つかっていない。

なので今回は、Web ブラウザ Mozilla Firefox 限定ネタだけれど、 Web ブラウザの機能を使って Web ページ全体をカンタンにキャプチャする方法を紹介。

1. Mozilla Firefox の環境を設定する

  1. Mozilla Firefox を起動する
  2. どの Web ページでもよいので表示する
  3. Web ページのどこでもよいので右クリックする
  4. コンテクストメニューの「要素を調査」をクリックする(下図〕
    「要素を調査」
    「要素を調査」
  5. Web ブラウザの画面が分割されて、要素ペインが表示される
  6. 要素ペインの上部にある「歯車(設定〕」アイコンをクリックする(下図〕
    「歯車(設定〕」アイコン
    「歯車(設定〕」アイコン
  7. 要素ペインを下方向にスクロールして、「ページ全体のスクリーンショットを撮影します」をチェックして、ツールバーにカメラのアイコンが表示されることを確認する(下図)
    「ページ全体のスクリーンショットを撮影します」をチェックして、カメラアイコンを確認
    「ページ全体のスクリーンショットを撮影します」をチェックして、カメラアイコンを確認

カメラアイコンをクリックすれば、Web ページ全体をキャプチャできる。

要素ペインはサイズの変更ができるので、Web ページが見やすくなるように、好みに応じてサイズを調整しておくとよいと思う、極端なハナシ、ツールバーだけが見えていればよいのである、

2. Mozilla Firefox を使ってキャプチャする

  1. キャプチャする Web ページを表示する
  2. 要素ペインのツールバーにあるカメラアイコンをクリックする(下図)
    カメラアイコンをクリックして Web ページをキャプチャする
    カメラアイコンをクリックして Web ページをキャプチャする
  3. Web ページがキャプチャされ、ダウンロードフォルダにダウンロードされる(上図・下図)
    キャプチャされた Web ページがダウンロードされている
    キャプチャされた Web ページがダウンロードされている

キャプチャする必要がなくなったら、要素ペインのツールバー左端の「☓」ボタンをクリックして、もとの表示にもどすとよいと思う。

3. まとめ

FireFox 限定だけれど、 Web ページ全体をカンタンにキャプチャするには、かなり有効な方法だと思う。なにより拡張機能(プラグイン)を必要としないのがよい。

キャプチャした Web ページのファイル名は「 Screen Shot 年-月-日 at 時.分.秒.png 」となる。わかりやすいし、管理もラクだね。

Google Chrome で Web ページ全体をキャプチャするには、「 Full Page Screen Capture 」という拡張機能が便利だと思う。お好みの Web ブラウザに合わせてどうぞ。