Web制作のお供に！おすすめChrome拡張機能９選
Web制作に携わっているとデベロッパーツールがとても便利なのでメインブラウザはChromeを利用しているのですが、何かちょっとした調べ物がある場合「デベロッパーツール立ち上げるほどでもないかな…」といったときに便利なChrome拡張機能を９つご紹介します。
現在も日常的に使っているものばかりですので、Web制作のお供として参考になれば幸いです。
検索効率アップに
検索オプションに期間を追加「Google Search date range shortcut」
Google Search date range shortcutはGoogleの検索結果ページにある検索オプションの期間指定に、「3ヶ月以内」「6ヶ月以内」など任意の選択肢を追加してくれる拡張機能です。
「期間を指定」から自分でも指定できるのですが、鮮度の高い情報の絞り込みをサクッと調べたいときなどにとても便利です。
検索結果横にプレビュー表示「SearchPreview」
SearchPreviewはGoogleの検索結果の一覧表示横にそれぞれのサイトプレビュー画面を表示してくれる拡張機能です。
事前にサイトの雰囲気がわかるのでリンクを踏んでから「思ってたサイトとなんか違う…」といったロスを軽減してくれます。
※プレビュー画面が古い場合も稀にあります
検索結果から不要なサイトを非表示に「uBlacklist」
uBlacklistはGoogleの検索結果ページに任意のサイトやページが表示されないようにしてくれる拡張機能です。
特定キーワードで検索するとあまり中身のないサイトが毎回上位に出てきてイラッとしてしまう…といった経験は誰しもあると思いますが、そんな場面を回避してくれるとても頼れる拡張機能です。
サイト分析の効率アップに
細かい色も拡大して調べることが可能「ColorPick Eyedropper」
ColorPick Eyedropperはサイト上にある任意の場所の色を調べる事のできるカラーピッカーです。
調べたい箇所を拡大表示してくれるので、調べたい箇所の色コードをピクセル単位で容易に抽出できる便利拡張になっています。
任意の距離を測定する定規ツール「Page Ruler Redux」
Page Ruler Reduxはサイト上のあらゆる距離を簡単に測ることのできる拡張機能です。
行間分含めたテキスト要素間など、デベロッパーツールでは測りづらい距離を調べる場合に重宝しています。
要素の幅や高さをサクッと表示「Designer Tools」
Designer Toolsはサイト上の要素の幅や高さをサクッと調べることのできる拡張機能です。
こちらはデベロッパーツールでも代替可能なのですが、ページ上の要素にホバーするだけで数値が表示されるので、デベロッパーツール開くまでもないなあといったときにサクッと調べることのできる便利なツールです。
その他時間短縮に
スクリーンショット＆動画録画も可能「Nimbus Screenshot & Screen Video Recorder」
Nimbus Screenshot & Screen Video Recorderはサイト上の任意の箇所だったりページ全体だったりを指定し画像保存できるスクリーンショットツールです。他にある同様のスクリーンショットツールと異なるのは、保存するキャプチャにテキストを注釈を入れたり簡単な図形を入れたりといった編集機能や、サイトの表示を動画として保存できたりといった豊富な機能を持ち合わさえています。
多機能が故に全機能をフル活用するには有料になっていますが、個人的には無料でも全く問題なく利用できています。
スマホ表示確認を素早く「The QR Code Extension」
長いURLをスマホのブラウザでちまちま打つのは面倒ですよね。The QR Code Extensionxを使えばそんなことをせずに生成されたQRコードを読み込むだけでサイトを表示することが可能です。
QRコードを生成してダウンロード可能なのも地味に助かっています。
※同様のツールはたくさんあるのでご自身に合うツールを選んだら良いかと思います。
長いURLをとりあえず短縮したいときに「URL短縮革命 短縮URL作成ツール」
Amazonの日本語が含まれる商品URLなど、めちゃくちゃ長いURLってペーストしただけでものすごい高さの領域を取られるので短縮できるに越したことはありません（特にスマホデバイス）。
短縮革命 短縮URL作成ツールはそんあサイトURLをワンクリックで生成してクリップボードにコピーまでしてくれる便利な拡張機能です。
生成されるURLは「https://0e0.pw/****」といった形です。短縮URLの利用が問題ない場合は積極的に利用させてもらっています。
さいごに
Web制作の現場で個人的に今現在も利用しているおすすめのChrome拡張機能を９つ紹介いたしました。
Web制作に限らず便利な拡張機能もありますので、今回紹介した拡張機能が誰かの時短や業務効率化に役立てば嬉しいです。
