Web制作

Google Chromeお勧め拡張機能一覧

今回はWeb制作時にあったらいいなと思うChromeの拡張機能の記事となります。

どれも有効活用する事でWeb制作の力強い味方となります。

是非こちらの記事を参考にしていただきWeb制作が少しでも楽になれればと思います。

各拡張機能のリンクも掲載しますので、そちらからインストールしていただけます。

ColorPick Eyedropper

こちらの拡張機能はWebサイト上のカラーコードを確認することができます。

起動するとマウスカーソルの形が変わり、マウスカーソルを合わせた部分のカラーコードが表示されます。

クリックするとクリックした部分のカラーコードが表示されますので、そのままコピーすることができます。

サイト模写をする際に必要な拡張機能の一つだと思いますので、是非インストールしてみてください。

https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg

Image Downloader

こちらの拡張機能はWebサイト上の画像を一斉にダウンロードすることができます。

模写に必要な画像を一括ダウンロードできるのは非常に便利です。

拡張機能を立ち上げて【select all】を選択してダウンロードボタンを押すだけでダウンロード完了です。

https://chrome.google.com/webstore/detail/image-downloader/cnpniohnfphhjihaiiggeabnkjhpaldj

WhatFont

こちらの拡張機能はWebサイトのフォントを調べることができるものです。

WhatFontを起動し、調べたいフォントをクリックするとフォントの種類、太さなど様々な情報が取得できます。

模写を行う上で必要な拡張機能の一つです。

https://chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm?hl=ja

GoFullPage – Full Page Screen Capture

こちらの拡張機能はWebサイトを丸々スクショできます。

模写を行う上で、Webサイトを丸々みてどう組み立てていくのかが割と重要だったりします。

そんな時にこの拡張機能があると非常に便利なので是非入れておきたい拡張機能の一つです。

https://chrome.google.com/webstore/detail/gofullpage-full-page-scre/fdpohaocaechififmbbbbbknoalclacl?hl=ja

UI Build Assistant

こちらの拡張機能はHTMLの構造が丸裸になる拡張機能です。

YouTubeでしまぶーのIT大学チャンネルを運営されてるしまぶーさんが作られた拡張機能です。

公式の動画を見ていただいた方が内容を把握できると思いますのでリンクを貼っておきます。

https://chrome.google.com/webstore/detail/ui-build-assistant/clbhieamajlakjobcoiheklaoldcjhjf?hl=ja

WPSNIFFER – WordPress Themes Sniffer

こちらの拡張機能はWordPressで何のテーマを利用しているかがわかる拡張機能です。

このサイトいいなと思った時に、アイコンがオレンジになっているとWordPressで作成されたサイトであることの証になります。

アイコンをクリックするとテーマ名が出てきます。

テーマ名がサイト名とイコールになっている場合は、自作テーマで、Snow MonkeyやSWELLやTCDだと有料のテーマが使われてるとわかります。

あくまでも目安程度の拡張機能ですがあると便利です。

https://chrome.google.com/webstore/detail/wpsniffer-wordpress-theme/kihhefcbenhkjgjhchanjfhhflaojldn?hl=ja

以上となります。

私が知らない拡張機能もまだまだたくさんあると思いますので、色々探してみてください。

良い拡張機能があればご教示いただけると嬉しいです。

それでは良きコーディングライフを!