Web制作に役立つChromeおすすめの拡張機能11選

 
世界のブラウザで圧倒的シェアを誇るGoogle Chromeですが、便利な機能拡張もいろいろ揃ってます。皆さんも自分好みの機能拡張を利用してると思いますが、Web制作の際にも作業効率をアップできる機能拡張も多くあります。そこで今回はWebデザイン制作時に役立つGoogle Chromeの機能拡張を厳選して紹介します。





おすすめ機能拡張




1

CSS Peeper

閲覧しているページのCSSを教えてくれる機能拡張。ブラウザのCSS Peeperボタンをクリックするとフォント・カラー・イメージ情報が表示されます。
2

Web Developer

Web制作では定番の機能拡張。解析・検証に役立つツールが揃ってます。
3

WhatFon

ソースを調べなくてもフォント情報を表示できる機能拡張。調べたいテキストにカーソルを合わせるとfont-familyfont-sizeline-heightといっフォントの情報が表示されます。
4

Clear Cache

ブラウザーのキャッシュをクリアしてくれる機能拡張。webサイトの更新確認などに地味に役立つ。
5

ColorZilla

シンプルなカラーピッカー。サイト上のカラーを調べたい箇所をクリックするだけでカラーコード(16進数)をコピーできます。
6

Page Ruler

その名の通りページ上のイメージや余白などを測りたい時に役立つ機能拡張。
7

xvg

SVGのアンカーポイントを表示させる機能拡張。
8

WhatRuns

Webサイトで使用しているCMS・プラグイン・JavaScriptなどを一覧表示してくれるサイト調査に役立つ機能拡張。
9

SimilarWeb

アクセス数や流入キーワードなどを解析できる機能拡張。SimilarWebのサイトに行かなくてもブラウザのボタンをクリックするだけで、サイトのアクセス解析ができます。
10

Full Page Screen Capture

ランディングページなど、長いページをキャプチャを撮りたい時に便利な機能拡張。
11

Session Buddy

調べものをしているとブラウザのタブがどんどん増えていくことがありますが、そのタブを保存できる機能拡張。セーブしておけばブラウザを閉じてしまっても、セーブしたタブを表示(復元)できます。

Web制作から調査まで、便利な機能拡張の紹介でした。Google Chromeの機能拡張は機能のオンオフ・削除が簡単にできるので、気になる機能拡張があれば試してみてください。

RELATED POSTS
  • 料金表のページをまとめたギャラリーサイト「Pricing Pages」
  • 【jQuery】レスポンシブ・フレキシブルなモーダルウィンドウ「iziModal.js」
  • Webサイトのページ表示速度を測定できる無料サービスまとめ
  • 画像に3Dブラーのホバーエフェクトを掛けられる「tiltfx.js」
  • 【jQuery】要素を3D回転させるプラグインTURNBOX.js
  • 【JS】物理法則に基づいたアニメーションライブラリ「Dynamics.js」
POPULAR POSTS
  • 【無料】漢字が使える日本語フリーフォント59選
  • 似たフォントを探したい!フォントを調べる時に役に立つツール・サイト10選
  • Youtubeの埋め込み動画をレスポンシブに対応させる方法
  • CSSグラデーションの作成に役立つジェネレーター・Webサービスまとめ
  • CSSで簡単に作れるおしゃれな見出しデザイン20選
RECENT POSTS
  • 無料で使用できるポップなフリーイラスト「illlustrations」
  • 宮崎県小林市が提供するお肉のフリー素材サイト「oniku images」
  • CSSでよく使うレイアウト・パターンをまとめたサイト「CSS Layout」
  • Neumorphismを簡単に作れるジェネレーター「Neumorphism.io」
  • マルチカラーグラデーションのコードをコピーできる「gradienta」