アラサー主婦のWEBデザイン奮闘記

Web制作 制作お役立ち

作業がはかどる!オススメのGoogle Chrome拡張機能5選

投稿日:

こんにちは、ぶちこです。

いきなりですが、みなさんはGoogle Chromeの拡張機能、使いこなしていますか?

私は今までScreen Captureくらいしか拡張機能は使っていなかったのですが、他にも調べていろいろと使ってみたところ、今まで時間のかかっていた作業を格段に効率化できるようになり、とても感動しました。
こんなに便利ならもっと早く使っていればよかった…!

ということで今回は、Webデザイナーにおすすめの拡張機能を厳選して5つご紹介したいと思います。

 

Page Ruler

 

最初にご紹介する「Page Ruler」は、WEBページ上の画像やコンテンツのサイズを測れる拡張機能です。

図った部分は薄い青色になり、ページ上部に、幅、高さ、左右上下の位置などの情報が表示されます。

ちなみに</>Elementsをクリックすると、任意の位置のサイズではなく、瞬時に要素単位で計測してくれるようになるので更に便利になります。

 

Fontface Ninja

Webサイトで使われているフォントの情報を調べられる拡張機能です。

文字の上にカーソルを合わせるだけで、「フォントの種類」「大きさ」「文字の間隔」「行の高さ」「カラー」の情報が表示されます。

 

ColorZilla

こちらは、閲覧しているWEBページ上の色を抽出することができる拡張機能です。

カラーを知りたい箇所にカーソルを当てると、カラーコードが表示されます。

さらにクリックで、カラーコードをコピーしてくれますよ。

 

OneTab

製作時、気づいたら参考サイトでタブがいっぱい…なんてことはありませんか?

そんな時は、OneTabという拡張機能がとても便利です。

OneTabのアイコンをクリックするだけで、開いていた複数のタブを一瞬で1つにまとめてくれます。
さらには、作成されたタググループに名前をつけて保存ができたり、Webページとして共有ができたりもします。

 

Image Downloader

こちらのImage Downloaderは、表示しているWebページで使用されている画像を一気にダウンロードできる拡張機能です。

もちろん、欲しい画像だけを選択したり、サイズなどの条件をつけて画像を絞ってダウンロードすることも可能です。

これは、サイトリニューアル時などにぜひ使いたい拡張機能ですね!

 

まとめ

いかかでしたでしょうか?

拡張機能1つでも作業時間や、やりやすさが圧倒的に変わると思います。

すでに知っているものもあったかと思いますが、もし他に気になったものがあればぜひ使ってみてください。

 

-Web制作, 制作お役立ち

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

参考になるクオリティの高い政治家サイト4選

こんにちは、ぶちこです。 制作会社に入社して約半年、毎回さまざまな業種のデザインに携わらせてもらっていますが、今回初めて政治家の方のサイトを手がけることになりました! とは言えなかなかイメージがつかず …

超便利!アイコンフォントを一括検索できる「GlyphSearch」のご紹介

Webサイト制作では、出番の多いアイコン。 私は以前まで画像のアイコン素材を使用していましたが、その存在を知ってからはアイコンフォントに頼りっぱなしです まずアイコンフォントについて簡単に説明すると、 …

【Photoshop】レイヤーマスクを複製する方法

今回は久しぶりにphotoshopのテクニックについてご紹介したいと思います。 いきなりですが、私の会社では有料サイトの画像を使用する場合はまずカンプ画像を使い、その後クライアントからOKが出たら画像 …

終わらない修正のループにはまらないために…参考にしたい記事3選

細部の調整も終わり、デザインがほぼ完成していた状態で、クライアントからの膨大な修正依頼。それもデザインの作り直しになってしまうような大きな修正だったり…。 こういった経験、デザイナーのみな …

コーディング初心者におすすめの記事まとめ

こんにちは、ぶちこです。 最近の私はと言うと、仕事で先輩に教わりながらコーディングを行なっています。 ですが、ちょっとしたコードすら自分1人では正確に書けず悪戦苦闘中。。スラスラとコードが書ける先輩方 …