アラサー主婦の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

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

関連記事

【Illustrator】文字を斜体にする方法

Illustratorのテキストを斜体にして配置したい場合、英字フォントであれば「Italic指定」ですぐに斜体に変換できるものが多いですが、日本語フォントの場合は「Italic」がないですよね。 じ …

サイト内の画像を一気に取得できる「Image Cyborg」

今回は、サイト内の画像を一気に取得できる「Image Cyborg」をご紹介します。 画像の多いサイトのリニューアルの時などに便利なオンラインサービスです。   「Image Cyborg」 …

WebデザイナーがFeedlyに登録しておくべきブログ一覧

こんにちは、ぶちこです。突然ですがみなさんはFeedlyを使っていますか? まず、「Feedlyとは何?」という人のために簡単に説明すると、自動的にお気に入りのブログやWebサイトの最新情報を収集して …

かわいいデザインのサイトが集まったギャラリーサイト

一口に“かわいい系のサイト”と言っても、子供向けのポップな感じなのか、女性向けの柔らかい感じなのか…など、様々ですよね。 なので、WEBデザインでかわいいを表現するのはなかなか難しいなあとよく思います …

ゲーム感覚でベジェ曲線を練習できる「The Bezier Game」

イラストレーターの特徴とも言えるベジェ曲線について、「難しい」「上手く描けない」と思われている方は多いと思います。 私自身、まだまだベジェ曲線を使いこなせていなくて、苦手意識がすごくあります…。 そん …