ブロサイ
2022.09.01

コーディング・Webデザイン時にも便利なGoogle拡張機能まとめ

今回は、コーディングやWebデザイン時にも役立つおすすめのGoogle拡張機能をご紹介します。

コーディング・Webデザイン時に使えるGoogle拡張機能まとめ

google拡張機能
Google拡張機能は、Chromeウェブストアから追加できるGoogle Chromeブラウザがより便利に利用できるように開発されたツールです。
数年前までは、有料の拡張機能がありましたが、現在ではすべて無料で利用できます。無料で数多くの高機能な拡張機能が利用できるので、たくさん使いたい方もいるかもしれませんが、多くの拡張機能を利用していると、ブラウザに負荷がかかる為、ブラウザの利用目的に合ったものを選別して拡張機能を利用されることをおすすめします。

Google拡張機能①「The QR Code Extension」

The QR Code Extension
最初に紹介する拡張機能は、閲覧しているWebサイトのQRコードを生成できる「The QR Code Extension」というツールになります。
主に下記のような場面で役に立ちます。

  • サイト制作の動作確認を行う際に、スマホやタブレット端末でQRコードを読み込むだけでサイトを表示できる
  • QRコードをpng形式で保存できるので、バナー等の一部として利用できる

※svg(パスデータ)での保存も可能ですが、2022年の更新で有料プラン限定に変更されました。

Google拡張機能②「FireShot」

FireShot
次に紹介する拡張機能は、閲覧しているWebサイトのスクリーンショットを保存できる「FireShot」というツールになります。
ただスクリーンショットを保存するだけでなく、表示されていないページ下部まで含めたヘッダーからフッターまでのスクリーンショットをから、表示部分のみのスクリーンショットも保存することが出来ます。
主に下記のような場面で役に立ちます。

  • サイト修正時の打ち合わせなどでコンテンツごとに細かい指示を記入したいとき
  • サイトのページ一部を説明、紹介したいとき

このツールはサイト制作時以外でも使える場面が多いのでおすすめです。

Google拡張機能②「Color Picker for Chrome™」

Color Picker for Chrome™
次に紹介する拡張機能は、サイトページ内の色を調べて、ピッカーに16進数でコピーできる、「Color Picker for Chrome™」というツールになります。
主に下記のような場面で役に立ちます。

・サイト内の色を確認したいとき

※「PICK」ボタンをクリックして、サイト上のコピーしたい色の上でクリックするだけでコピーされます。

まとめ

今回は、Google Chromeブラウザの拡張機能についてご紹介しました。上記に挙げた以外にも数多くの無料優良ツールが利用できますので、まだ使ったことが無い方は是非チェックしてみてください。

関連する記事