エンジニアからディレクターまで！職種ごとにオススメするChrome拡張機能7選
- 2016年8月12日
- 8,872
ferret編集メンバーが不定期で更新します。
Webマーケティング界隈の最新ニュースからすぐ使えるノウハウまで、わかりやすく紹介します！
>> 著者詳細はこちら
Web系のエンジニアであれば開発 ツール として ブラウザ をハードに使っているのではないでしょうか。日々使う ツール だからこそ、自分の好みにカスタマイズしたいという方も多いはず。
本記事では、最も ブラウザ でシェアを誇る Google Chromeの拡張機能についてまとめました。開発業務を効率化するためにも、便利な拡張機能は大いに利用していきましょう。
このニュースを読んだあなたにオススメ
Facebookをさらに便利に！オススメのChrome拡張機能12選
作業効率がアップ！オススメのChrome拡張機能20選
誰でも一瞬でできる！WordPressのプラグインを使ってAMPに対応する方法
必携の拡張機能4つ
まずは、SEやディレクターなど、エンジニア向けの拡張機能からご紹介しましょう。
1. Tag Assistant
https://chrome.google.com/webstore/detail/tag-assistant-by-google/kejbdjndbnbjgmefkgdddjlbokphdefk
ホームページやウェブサービスの開発において、アクセス解析サービスの Googleアナリティクス （ Google Analytics）や インターネット広告 サービスの Google AdWordsなど、複数のタグを使用することが多いです。
こういった タグ の管理に使えるのが、Tag Assistantです。 ページ に埋め込まれているタグを確認したり、それぞれのタグが正常に動作しているのかを確認することができます。ホームページを立ち上げた時、トラブルの検証にも活躍してくれるでしょう。
2. YSlow
https://chrome.google.com/webstore/detail/yslow/ninejjcohidippngpapiilnmkgllmakh
Yahoo!のパフォーマンス ツール をベースにしている拡張機能で、ホームページの表示速度をはじめ、パフォーマンスのチェックができます。各項目に沿って、 ページ のグレードが計算・表示されます。
ページ のパフォーマンスだけでなく、問題となっているポイント（ファイル）もリストアップしてくれるため、 ページ の改善にも活かしていきましょう。
3. EditThisCookie
https://chrome.google.com/webstore/detail/editthiscookie/fngmhnnpilhplaeedifhccceomclgfbg?hl=ja
ページ に保存されているCookie（ ページ に一時的に保存されている情報のこと）が閲覧できる拡張機能です。 ドメイン や名称、値、有効期限などの詳細なCookie情報が確認できます。閲覧以外にも、追加や編集、削除、保護、ブロックなどの豊富な機能が使えます。
なおCookie情報は、JSON形式でエクスポート/インポートをしたり、検索することも可能です。
4. ColorPick Eyedropper
https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg
写真などの画像素材に使われている、カラーコードが調べられる拡張機能です。 URL の横にあるアイコンをクリックし、カラーコードを調べたい要素にマウスオーバーすると、該当するカラーコードが表示されます。
エンジニア以外にもおすすめ！便利な拡張機能3つ
エンジニアやディレクターにオススメの拡張機能についてご紹介しましたが、ここからは非エンジニアにもオススメの拡張機能についてご紹介していきます。日ごろの業務を効率化できる優れものばかりのため、積極的に使っていきましょう。
5. Awesome Screenshot
表示しているページの キャプチャ （スクリーンショット）を撮るための拡張機能です。 キャプチャ は幅広い用途に使用できますし、Chromeを使っているのであれば、ぜひ活用したい拡張機能の一つです。個人用の記録として使ってもいいですし、インストラクションや ブログ 記事の作成にも活用できます。
フル ページ での キャプチャ が撮れることがAwesome Screenshotの特徴。スマホの登場によって縦長のWeb ページ が増えているため、 ページ 全体の キャプチャ が撮れるのは大きなメリットです。
また、撮影した キャプチャ に注釈（図形や文字など）をつけたり、モザイク（ブラーエフェクト）をかけることも可能です。
6. Evernote Web Clipper
クラウドにメモを保存しておくことのできるサービスとして、メジャーなEvernote。メモ以外にもさまざまなファイルをストックしておくことができます。例えば、写真の保存、ToDoを保存してタスク管理として使うこともできます。
Evernote Web Clipperは、閲覧しているページをEvernoteにクリップすることができる拡張機能です。気になった ページ を、手軽にストックしておくことができます。
ブラウザ のブックマーク機能を使ってもいいのですが、Evernoteを使う方が便利でしょう。クリップした ページ を分類したり、 タグ 付け、 キーワード での検索もできます。
なおクリップする形式は、「 ページ 全体」と「選択した範囲」、「簡易版」の3種類から選ぶことができます。
7. OneTab
https://chrome.google.com/webstore/detail/onetab/chphlpgkkbolifaimnlloiipkdnihall?hl=ja
Chromeを使っていると、ついタブの数が増えてしまうことがありませんか。 ブラウザ はメモリを結構使ってしまうため、PCが重くなることもあります。かといって、一度タブを閉じると開いていた ページ がわからなくなることも。さらに、間違ってタブを閉じてしまうことだってあるでしょう。
OneTabは、そういった悩みを解決してくれる拡張機能です。複数のタブを一箇所にリストアップし、まとめておくことができます。タブはいったん閉じられるので、大幅にメモリが節約できます。
タブを閲覧したい場合は個別に開くか、一気に全タブを復元することも可能です。タブのインポート/エクスポート機能もついているので、開いていたタブのバックアップとしても使えます。
まとめ
それぞれの職種ごとにオススメの拡張機能をご紹介しました。
Chromeは単なる ブラウザ ソフトではなく、いまや立派な開発 ツール の一つです。ご紹介した拡張機能を活用して、快適な開発環境をつくっていきましょう。
このニュースを読んだあなたにオススメ
Facebookをさらに便利に！オススメのChrome拡張機能12選
作業効率がアップ！オススメのChrome拡張機能20選
誰でも一瞬でできる！WordPressのプラグインを使ってAMPに対応する方法
