Full Page Screen Captureを初めて使ってみた
こんにちは！デザイナーの青木です。
狂ったようにハマっていたLALALAND熱がやっと覚めてきました。
ふつうにすきです。
早速ですが、サイトキャプチャをとる際って普段、何を使ってますか？
スクリーンキャプチャ、何でとるか
従来、私はFireFoxのPearl Crescent Page Saver screenshot toolを使ってました。
ブラウザのアクティブじゃない箇所を含めて、上から下までしっかりと収めてとってくれるところが便利ですよね。
余談ですがキャプチャって「撮る」ですかね？
「取る」？「録る」？？？
謎なので今回はひらがなの「とる」に統一したいと思います。
話を戻しますが、
他にもツールあるよね？？？？
と、急に思いました。
探してみました。
そこで見つけたのが、
Chrome拡張機能のFull Page Screen Captureです。
世の中ではもうこちらのほうが一般なのかな…
今さらかもですが、使ってみたのでレビューしてみますね！
拡張機能を追加する
まずはChromeに拡張機能追加。
早速使ってみました
拡張機能を追加したので、ツールバーにカメラのアイコンが表示されるようになりました。
スマホのキャプチャをとってみます。
まずはChromeのデベロッパーツールでスマホ仕様にします。
カメラのアイコンをクリックすると処理が開始されます。
パックマンマークが現れて、これが右端の箱まで食べきると処理完了です。
サイトによってちょっと時間がかかったり…
でもこれ、
処理中にブラウザの他タブを見たり、
他のことをしようものなら…
処理が一番初めに戻ります。
…え？こんなに待ったのに？？
ダウンロード
とりあえず進めます。
処理が完了すると新規ウィンドウにキャプチャ画像が表示されます。
右から二番目にあるダウンロードアイコンを選択すると、
キャプチャ画像の保存が完了します。
ですが…
これがブラウザ本体のダウンロード機能なんですよね。
なので、ここ押すと細かい設定なしにダウンロードフォルダに保存されてしまう。
細かい設定とかをする余裕のない時だと、これが結構うざかったり…
調べたところ、キャプチャ画像を右クリックもいけるそうです。
このやり方だと適宜保存先を選べます！
ファイル命名問題
ここでまた問題。
ファイル名が自動生成されるようです。
Pearl Crescentの時は各サイトのtitleタグがファイル名に反映されてました。
都度新しいファイル名が生成されていくので、同じページを重複してキャプチャしてしまった場合に気づきにくいんですよね。
Pearl Crescentもtitleタグなので、ページとtitle名があってない時もあります。
でも同じページをとってしまった場合、命名がtitleであるため、同名ファイルが複数作られることになるので、アラートが出ます。
これが結構便利だった…
まとめ
Pearl Crescentと同様ですが、パララックスを使用していたりとか、
ページの最後まで読みこまないと全要素がダウンロードされないページの場合は
一番最後まで読みこんでからとる必要があるようです。
また、下部固定のフッターとかも映り込みますね。。。
ページを分断するあいつです。
こいつは最後まで読みこんでからとってようが、関係ないのかも。
容赦なく写り込んできます。写りたがりめ。
色々文句をつけてきましたが…
命名ルールさえ目を瞑れば結構便利です。
ぜひつかってみてください！