2018.5.29

便利なGoogleChromeの拡張機能まとめ 〜web制作者向け〜

web制作者向けの便利なGoogleChromeの拡張機能を中心に紹介します。

サイト閲覧時に使える拡張機能

ページ上部に戻るボタンを全てのサイトで - Scroll To Top

Scroll To Top
Scroll to top and vice versa in a window.

トップに戻るボタンをどんなサイトでも表示してくれます。また、設定を変更すればボタンの位置や、ページ下部に戻るボタンを追加したりなど、意外と細かくカスタマイズすることが出来ます。

検索結果を1クリックで1年以内の記事のみに

-

ato-ichinen

ato-ichinen
Activeにしている間、Google検索結果を1年以内のものに限定します。

Googleの検索結果一覧のページで、手軽に1年以内の記事のみを表示させることが出来ます。記事の絞り込みの機能はもともとGoogleChromeの機能に備わっていますが、それをワンクリックで実行してくれる便利な拡張機能です。

検索結果にサイトのサムネイルを追加 -

SearchPreview

SearchPreview
Enhances your search pages by inserting preview images and popularity ranks.

Googleの検索結果一覧にサイトのサムネイルが表示されるようになります。

web製作時に使える拡張機能

シンプルなスポイトツール

-

ColorPick Eyedropper

ColorPick Eyedropper
An eye-dropper & color-picker tool that allows you to select color values from webpages.

サイト上の色のカラーコードを簡単にコピー出来るスポイトツールです。スポイトツールの拡張機能は何個かありますが、これは反応が早くて必要最低限の機能しかないのでとても使いやすいです。

開いているタブのURLを一括コピー

-

Copy All Urls

Copy All Urls
Copy tabs URL to clipboard (formats : text, HTML, JSON or custom). Paste to open multiple URL at one go.

URL関係の2つの機能があります。

  • 開いているタブ全てのURLをコピー
  • クリップボードにコピーされているURLを全て開く

複数のURLをコピーしたり、一気に開きたい時にとても重宝する拡張機能です。

マークダウンファイルをプレビュー

-

Markdown Preview Plus

Markdown Preview Plus
Converts and previews markdown files (.md, .markdown) to HTML(include TOC) right inside Chrome and support live reload

マークダウン形式のファイルをブラウザ上で開いたら、スタイルが適用された状態で表示してくれます。

 

コーディング時にデザインと差分が無いかをチェック

-

PerfectPixel by WellDoneCode

PerfectPixel by WellDoneCode (pixel perfect)
This extension helps develop your websites with pixel perfect accuracy!

コーディング時に、デザインカンプと差分が無いかをチェックする時に便利な拡張機能です。サイト上に画像を表示させ、位置や透明度を自由に変えることが出来ます。

QRコードを生成

-

The QR Code Extension

The QR Code Extension
Binibigyang-daan upang bumuo ng isang QR Code para sa kasalukuyang pahina at i-scan ang isang QR Code gamit ang webcam.

開いているサイトのQRコードを表示させてくれます。スマホでサイトを確認したいときに便利な拡張機能です。

その他

開いているタブを一元管理

-

OneTab

OneTab
Save up to 95% memory and reduce tab clutter

複数のタブを開き過ぎたりして動作が重くなった時に使える拡張機能です。

開いているタブを一気に閉じてブックマークのような形でひとつの専用ページにまとめてくれます。まとめられた後は、ページを個別で開くことも出来るし、まとめられたページ全てを一気に開くことも出来ます。

普段使うサイトにjsを適用

-

ScriptAutoRunner

ScriptAutoRunner
Injects to any Script into a Website. It can be autorun as well.

任意のサイトにのみJavaScriptを自動で実行させる拡張機能です。普段使うサイトでちょっとした機能を追加したい時や、ライブラリを追加したい時などに使えます。

まとめ

今回はweb製作者向けに紹介した拡張機能ですが、やはり人によっては使いやすい、使いにくいはあると思います。機能が似ている拡張機能はいくつもあるので、この記事を参考に自分にあった拡張機能を探してみてはいかがでしょうか。

シェアする
フォローする
Web-Guided - web業界で働く方を少しだけ手助けするメディア