ウェブ制作ツールとは?
|
ウェブ制作・ウェブ開発に役立ちそうなGoogle Chrome拡張機能です。HTML・CSSのコーディングを手助けしてくれるものや、画像のプロパティを表示したり、閲覧サイトのCMSや技術的な情報を表示するものなど便利なChrome拡張機能を集めました。
[Chrome拡張機能] ウェブ制作ツール一覧
View Image Info (properties)
Chrome拡張
右クリックメニューから画像のプロパティ情報を閲覧できるようにするGoogle Chrome拡張機能。インストールすると、ウェブページ上にある画像を右クリックしたときに [ View Image Info (properties) ] という項目が表示され、これを選択すると画像の URL / 縦横サイズ / ファイル容量といったプロパティ情報を閲覧することができます。
HTTP/2 and SPDY indicator
Chrome拡張
閲覧中のサイトの通信が”HTTP/2”または”SPDY”プロトコルに対応しているかどうかを一目でチェックできるChrome拡張機能。Chromeで開いたサイトの”HTTP/2”や”SPDY”の対応状況を拡張機能アイコンの色の変化で視覚的にチェックできます。サーバーとの通信が”HTTP/2”プロトコルで行われていれば青色に、”SPDY”プロトコルで行われていれば緑色に変化するといった具合で、視覚的に一目でチェックできるのが特長。
Wappalyzer
Chrome拡張
閲覧中のサイトで使われているウェブサーバーやコンテンツ管理システム(CMS)、ベースとなっているプログラミング言語、Javascriptフレームワークやその他ウェブアプリケーション等を解析して一目で分かるように表示してくれるChrome拡張機能。Google Chromeにインストールしておくだけで、ウェブサイトを開いた際にアイコンで情報を表示。Firefoxアドオン版もあり。また類似のChrome拡張機能に「Chrome Sniffer」があります。
Chrome Sniffer
Chrome拡張
閲覧中のサイトが、どんな技術が使われて制作されているのかが一目でわかるGoogle Chrome拡張機能。本拡張機能をGoogle Chromeにインストールしておけば、ウェブサイトを開いた際にアドレスバー右端にアイコンが表示され、そのサイトで使われているCMSやJavaScriptライブラリといった技術的な情報を一目で得ることができます。100以上のCMSやJavaScriptライブラリ、その他有名ツールの検出に対応。
Image Size Info
Chrome拡張
Google Chromeで画像のプロパティを右クリックメニューから閲覧できる拡張機能。閲覧できるプロパティは、画像URL / 縦横サイズ / ファイルサイズ と必要最低限の機能はそろっています。Chromeでは右クリックメニューから画像のプロパティを確認できる機能が、ブラウザ自体に備わっていないので、本拡張機能をインストールすることでプロパティ情報を閲覧することができるようになります。
Toggle JavaScript
Chrome拡張
JavaScriptをワンクリックで有効化/無効化できるシンプルなChrome拡張機能。インストールするとChromeのツールバー上に本拡張機能のアイコンが表示されるので、これをクリックするだけでJavaScriptをON/OFFにできます。有効/無効の切り替え時に、現在開いているページを自動でリロード(再読み込み)してくれます(設定で無効にすることも可能)。
Clear Cache
Chrome拡張
ワンクリックでChromeのキャッシュを削除できる拡張機能。本拡張機能を導入すれば、ツールバーの拡張機能ボタンを押すだけでキャッシュを削除することが可能になります。キャッシュが溜まりすぎてChromeの動作が重くなったり、古いキャッシュが残っているせいでウェブページの表示が崩れたりするときに役立ちます。
Image info
Chrome拡張
ウェブページ上の画像にマウスオーバーするだけで、画像のプロパティ情報を表示してくれるChrome拡張機能。表示される情報は、画像の大きさとファイルサイズのみ。ページ上に貼られている画像の情報を素早く確認したいときに便利です。