信頼はずっと、挑戦はもっと。

お問い合わせ
TEL:03-3496-3888

BLOG コアテックの社員ブログ (毎週月曜~金曜更新中)

2012

9

10月

【Google Chrome】WEBディレクターが入れておくべき拡張機能

テクログ

 ふと見るとiPhoneの電源が落ちている なかむ です。

テクログ公開にあたってデザイナーや開発、ディレクターとブログを分けようと思ったのですが、
面倒くさいのでやめました、すいません・・・

ディレクター(ディレクターじゃなくてもいいですけど)なら入れておいて損はないChromeの拡張機能をご紹介します!

 

◯Awesome Screenshot

  Awesome

ページ全体やページの一部のキャプチャーPNG形式で保存できる。FLASHもキャプってくれる優れもの。注釈もつけれます。
キャプチャーの拡張機能は多々ありますが、一番しっくりきました。

 

https://chrome.google.com/webstore/detail/alelhddbbhepgpmgidjdcjakblofbmce

 

◯Chrome Sniffer

  Sniffer

 

サイトがどんな技術が使われているか教えてくれる拡張機能。

 

こんな感じでアドレスバーに表示
(テクログはWordpressで構築しているのでWマークがでてます)

色んな発見があって勉強になります。

 

https://chrome.google.com/webstore/detail/homgcnaoacgigpkkljjjekpignblkeae

 

◯Color Picker

ColorPicker

 

 

知りたい色のカラーコードを抽出できる拡張機能。
カーソルの先に色を合わせてクリックするとカラーコードが簡単にコピーできるのが便利です。

 

https://chrome.google.com/webstore/detail/ohcpnigalekghcmgcdcenkpelffpdolg

 

◯Drag & Drop Search

Drag & Drop Search

 

記事を見ている際、あーこれすぐに検索したいって思った時にドラッグして検索したいサービスですぐに検索できますヒャッホイ
オプションでサービスを変更できます。

 

https://chrome.google.com/webstore/detail/njdeknfopjeielabfoglnmbggkegcanm

 

◯Facebook Social Plugin

Facebook Social Plugin

 

 

サイトや記事がどのぐらい「いいね!」されてるかひと目で分かります。
クリックすれば「いいね!」もできます。いいね!

 

https://chrome.google.com/webstore/detail/hdmclgnbhdiklglmmdcaelggigiiigpm

 

◯FireMobileSimulator for Google Chrome

FireMobileSimulator for Google Chrome™

 

 

携帯やスマートフォンの動作を確認できる拡張機能。
最新機種も追加可能です( ^,_ゝ^)ニコッ
※ちょっと確認したい時に使います。基本的には実機で確認します。

 

https://chrome.google.com/webstore/detail/mkihbloiacgiofaejgagokalpeflnmbe

 

◯HTML5 Powered

HTML5 Powered

 

 

HTML5でマークアップされているかひと目で分かる拡張機能。
色んな発見があります。

こんな感じでアドレスバーに表示
(テクログはHTML5でマークアップしてます)

 

https://chrome.google.com/webstore/detail/klleofbhhghgacodijohlacbfhfcefom

 

◯Image Properties Context Menu

Image Properties Context Menu

 

 

画像の大きさとか重さとか調べたいなぁーって時に重宝します。
右クリックで簡単に調べることができます。

https://chrome.google.com/webstore/detail/khagclindddokccfbmfmckaflngbmpon

 

◯Page Ruler

pageruler

 

 

閲覧中のページでこの高さどのぐらいかなぁー困ったなぁーって時に
ささっとサイズが調べられます。CSSで確認するのがメンドーな時によく使ってます。

https://chrome.google.com/webstore/detail/jlpkojjdgbllmedoapgfodplfhcbnbpn

 

◯QRcode maker

QRcode maker

 

 

ガラケーやスマートフォンでWEBサイトを確認する際に、直接URLを打ち込むのがメンドーな時に
便利なのがこの拡張機能。
今開いているページURLのQRコードを表示してくれます。ダウンロードもできます。

 

https://chrome.google.com/webstore/detail/mljeoehehjjniajneijpcnmapmmhilgj

 

◯文字数カウンタ

文字数カウンタ

 

 

ここ何文字ぐらいあるのかなぁー困ったなぁーって時にコピペだけで文字数を表示してくれます。
文字数制限があった場合、とても便利☆

 

https://chrome.google.com/webstore/detail/inhhfghhfjpmhleoidodhcgeecicfbep

 

こういう拡張機能あったよ!という方は教えてください!
Chromeが重くならない程度に試してみます♪

この記事を書いた人

マスオさん

coretech

所 属:
WEBインテグレーション事業部
出身地:
渋谷
仕事内容:
Web制作