CLIP STUDIO PAINT EXを購入orアップグレードすると公式ガイドがもらえるキャンペーン中CLIP STUDIO PAINT EX

画像サイズを知る|Google Chromeの拡張機能

茂み

Google Chromeの拡張機能というものを知っているでしょうか。

今更ながら自分は先日初めて知りました。

Google Chromeはブラウザに新しく機能を追加してカスタマイズできるそうなのです。

 

自分は元々パソコンのウェブブラウザはInternet Explorer(IE)を使用していたのですが、Google関連の機能はIEではうまく使えないことがあるらしく・・・

最近ようやくパソコンでもChromeを利用するようになり、その後色々検索していくうちに「拡張機能?何それ???」となったのです。

拡張機能の追加

Chromeは『Chromeウェブストア』にある色々な拡張機能の中から好きな機能をインストールしてカスタマイズできます。

(有料のものもあるようなので注意が必要ですが)

拡張機能の追加は、Chromeウェブストアで利用したい拡張機能を選んで、右上のCHROMEに追加をクリックします。

確認画面が出るので「拡張機能を追加」をクリックすると追加されます。

※Chromeウェブストアヘルプの「拡張機能をインストールする、管理する」を参照

最初はブログなどで他の人のおススメを参考にして選ぶと良いと思います。

拡張機能を追加するとアドレスバーの右にアイコンが出ます。

拡張機能アイコン

削除する時は、このアイコンを右クリックし「Chromeから削除」を選びます。

画像サイズを知るのに利用した便利な拡張機能

まだまだどんな拡張機能があるのかわかっていませんが、画像のサイズを知りたい時にとても便利だったのが以下の二つの拡張機能です。

 

View Image Info 

 コンテキストメニューを使用して、カーソルが指している画像のプロパティ(寸法、URL、ファイルサイズ、ファイルタイプ情報など)を取得します。

Page ruler 

 ピクセルの寸法と位置を取得し、任意のWebページ上の要素を測定するルーラーを描画します。

  ※説明書きはChromeウェブストアの英語説明をGoogle翻訳で訳したものです。

 

View Image Infoの使い方

画像の上にカーソルを置いて右クリックし、「View Image Info(properties)」を選びます。

view Image Info

下のような画面が出てきて、サイズなどがわかります。

view Image Info

Page Rulerの使い方

注意
ここに書いた「Page Ruler」は使用できなくなったようです。現在では「Page Ruler Redux」「Page Ruler(同じ名前の別のもの)」などが同じような機能を持っていると思われます

 

まず、ブラウザ右上の「Page Ruler」のアイコンをクリックします。

page ruler

サイズを図りたい場所でドラッグ&ドロップします。

薄い青になった部分の情報が上の方に出てきます。

下図は端をきれいに合わせてないので半端な数字ですが、約320px×320pxの画像ということがわかります。

他の情報は今のところあまり見ていませんが、本格的にデザインしたい時などに使うのでしょうか。

もう一度アイコンをクリックすると元の画面に戻ります。

page ruler

 

まだまだ便利な拡張機能がたくさんありそうです。

色々試してみたいですね。