こんにちは、ゆーすけです。
まずはポチっとお願いします。
MeasureIt!はブラウザ上のものさし
あなたは、自分のブログの記事枠が何ピクセルあるのか
把握していますか？
例えば私のブログは横幅630pxまでなら横にはみ出さずに
きちっと収まる構造になっているようです。
ちょっとできる人だったらCSSというブログやサイトの
レイアウトを決めるプログラムシートを見れば、サイズがどんな
もんかはわかりますが、なかなか普通の人は分からないでしょう。
MeasureIt!っていうプラグインを入れておくと
すごく簡単にブラウザー上のあらゆるものの大きさが
簡単に調べられます。
MeasureIt!を入れてみよう。
私はGoogle Chromeを使っていますが、firefoxにも
同じブラグインがあるようです。
ここではGoogle Chromeでの導入方法を紹介します。
[1]googleの検索窓に「measureIt chrome」と入力して検索
[2] 一番上に表示される「Chrome Web Store ? MeasureIt!」をクリック
[3] Chromeに追加をクリックして追加
お疲れ様でした。
バーの右側に下のアイコンが出てくればOKです。
以上でプラグインの追加が完了です。
MeasureIt!の使い方
[1]
をクリック
[2] 図りたい範囲をドラッグする
[3] 終了は
をクリック
使用例
こんな感じで範囲指定したところに
W：○○px H：○○pxとでてくる。
アイコンの大きさを調べるときなどもすごく重宝する道具ですね。
あとは、サイドバーにはどのくらいの大きさのイメージが貼れるかとか
CSSを確認すればわかりますが、もっと直感的に大体の大きさがわかれば
なんとかなるような作業にはもってこいのツールです。
なお、次のような使い方は意味がありません。
意味のあるツールの使い方をしましょう。
無料ブログでこれを応用させよう
さすがに、ここで終わるとあまりにも狙いすぎだ！
と言われそうなのでもうちょっと突っ込んでみましょう。
今日はちょっとインパクトを与えるために、
画像を使ってキャッチコピーを表示していますよね。
SEO的にはあまり良くないのですが、検索者のインパクトを
引くには、画像で文字を起こすのはもってこいなんですよ。
無料ブログの場合どうしても文字サイズの変更ぐらいしか
目立たせる方法が無いですからね。
同じ文言でもインパクト違うと思いますよ。
例えば、無料ブログで高額な案件であるエステとかを
扱う場合に、多くの人はフォントサイズでキャッチコピーを
目立たせているはずです。それでもいいのですが、ちょっと
下に幾つか作ってみました。
御覧ください。
〈例１〉文字のみ（フォントサイズ：２４ｐｘ）
念願のー３０ｃｍが達成出来ました！
〈例２〉SIRIUSのロゴ作成機能利用（横幅６００pxで作成）
〈例３〉Officeのワードアートを利用（横幅６２５pxで作成）
どのロゴがいいかは別として、
やっぱり純粋な文字サイズの変更よりは、イメージを使ったほうが
インパクトは上がりますよね
欠点はSEO?
皆さんの書いたブログはgoogleのロボットが巡回をして
検索エンジンに登録しているのですが、こまったことに
どんなに頭のいいgoogleのロボット（データ収集機）でも
文字情報しか収集はできないのです。
つまり、SEO的には上では〈例１〉が一番いいということになります。
〈例２〉〈例３〉は画像なので、googleのロボットには、画像データだ
ということは分かってもらえても何の文言が入っているかを分かっては
もらえないのです。
そこで、イメージタグにtitleとaltというのを挿入し、
「フレーズ・キーワード」を入れるのです。
<img title=”念願の-30cmが達成出来ました！” alt=”念願の-30cmが達成出来ました！” src=”goodtool3.png” width=”600″ height=”75″ />
altはマウスを画像に乗せると「それが何の画像なのか」
を分かるようにさせられます。
titleは文字通り「画像のタイトル」です。
こうすることでgoogleには
このイメージは『念願の-30cmが達成出来ました！』っていう画像だな・・・
と思わすことができるわけです。
今回は文言をそのまま入れましたが、ここに検索キーワードを入れてみたら
立派なSEOになりますよ。
（検索上位にくるというSEOではないですが・・・）
例えばalt=”ミュゼ 口コミ画像”と入れておくと、
googleイメージ検索で「ミュゼ 口コミ」で画像が表示させられる
ようになります。
これ地味に重要ですよ。
え？なぜ重要かわからない？？？
google検索の隣に画像があるからですよ。
何かの情報を手に入れる時に間違って検索ではなく
画像って押しちゃうことありませんか？
もし検索ではなく、画像を押した時にちゃんと
キーワードを押し上げることが出来れば・・・
ひょっとしたらクリックされるかもしれませんよね？
ちなみに、検索での１位と画像検索での１位は
全く違うサイトが表示されます。
これって美味よね？って私は思うのですが・・・。
まずはポチっとお願いします。
押してくれるとお礼＋３ランキングの応援ができます。
お礼のウインドウをOKすると３ランキングのマドは自動で消えます。
ゆーすけ 様
お世話になっております。
森山です。
当ブログへの訪問並びにコメント、
誠にありがとうございます。
measureItとFireBugは、
WEB屋の常識、便利です。
HTMLのルールとして、
altの記述は必須です。
空でもalt=””と記述しなければいけませんから、
であれば、画像の内容は記述した方がいいですね。
文字画像をコンテンツ内に入れる。
バラシちゃった…
ブログの記事は基本読まれていないことを、
前提にしないといけないので、
次の文章を読ませる施策としては効果がありますね。
私のレビューページでは、
絶対に使用する施策です。
意味深なキーワード…
私へのメッセージ性を強く感じます（笑）
応援完了です。
森山さん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
やっぱりWeb屋御用達のツールでしたか。
FireBugって初耳だたのでいま早速入れてみました。
なんかブラウザに虫ついてて見た目嫌ですね（ｗ
altは意外と知られてないですもんね。というか
私もよくalt=””さえいれないでimgつかっちゃいます（＾＾；
あまりこういうのをばらすのは良くないですかね（笑）
そんなに意味深なキーワードではない・・・はず・・？
応援ありがとうございました。
ゆーすけさん、おはようございます。
影太郎です。
いつもありがとうございます。
これは便利なツールですね。
cssで確認って結構面倒ですから。
これを使えば簡単に直感的に解かりますね。
間違った使い方。
おもいっきり笑わせてもらいました！
別の意味でサイズ計れるツールあったらいいな^^
画像を使った時のタグの使い方。
凄く参考になりました。
本日の応援完了です。
影太郎さん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
そうそう、結構便利なツールなんで私も
結構つかってますよ。SIRIUSでもどのくらいのサイズの
画像入れたらバランスいいかな？とかプレヴューと組み合わせて
使っています。
間違った使い方はね（ｗ
ドラゴンボールのスカウターも間違った使い方できそうですけどね。
応援ありがとうございました。
ゆーすけさん、おはようございます！！
いつもお世話になります。
何と便利なプラグインですか！！早速導入します！！
僕は画像に名前入れてないのですが、
地味に効果を発揮しそうなので、入れてみようと思います。
とっても参考になりました！
本日もポチポチ応援完了しました！
インフォ仙人さん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
そう今日の手法は本当に地味に効くもので即効性は・・・
無いともおもいます（笑）
ただaltは一応の４．０以降のルールらしいので
入れておいたほうがいいですね。
応援ありがとうございました。
ゆーすけさん、おはようございます！
バンコです^^
訪問・コメントありがとうございました！
お返事遅くなりまして申し訳ございません。
文字画像を入れるだけで、見た目のインパクトは
まったく違いますね！
ゆーすけさんの記事はいつも面白画像があって楽しいですし、
それだけでも十分かと思いましたが、文字画像でさらに興味が
惹かれました！！
「フレーズ・キーワード」もめっちゃ勉強になりましたし、
早いこと取り入れようと思います。
それにしてもあそこで下ネタが出てくるとは
思いませんでした^^
それではまた訪問させて頂きます！
応援ぽちです♪
バンコさん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
お、生きてましたか！お久しぶりです?
（失礼か！？）
毎回来ていただいて何か楽しく見ていただけたら
これ以上書物している人間としては嬉しいことはないです。
いろいろなところにいろいろな仕掛けをして・・・
ますます私はメルマガ向きの人間ではないかもしれない（笑）
シモネタは・・・適宜適切な場所で出てきますよ（＾＾；
応援ありがとうございました。
ゆーすけさん
こんばんわ＾＾
こんな便利なものさしツールがあるんですね。
早速、導入してみます。
画像のタイトルも勉強になりました。
変な物はかっちゃ、ダメですよ?( *´艸｀)ﾌﾟﾌﾟﾌﾟｗ
応援ポチです♪
バジルさん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
そうそう、便利なものさしなんですよ。
Web屋は必ず抑えておいたほうがいいツールですね♪
変なものほど測りたくなるわけですよ（ｗ
まったく意味を成さないけど(ﾉ´∀｀*)
（はじめての人がみたら引きますね・・・）
でもMeasureIt!は純粋に良いツールなんで使ってみてください。
応援ありがとうございました。
ゆーすけさん
こんばんは＾＾
そんな便利なツールがあるんですね！
華音は大きさっていつも
「だいたいこのくらいかな」って
適当にやってたのですがこれって便利ですね?！！
早速使ってみます！！
九州より心を込めて応援♪
華音さん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
そうそう、便利ツールの紹介でした（＾＾
私もコレを導入する前はだいたい・・・ってやってたんですが
これのお陰である程度正確にバナーやヘッダー作ることができましたよ。
使ってみて下さい。
応援ありがとうございました。
ゆーすけさん
こんばんは、ゆうぽんです。
MeasureIt!ってツール始めて知りました！
早速私も導入します＾＾
今日の記事も凄く勉強になりました。
応援です♪
ゆうぽんさん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
すごく便利な使い方ができるので
ネットのいろいろなものを測ってみるといいですよ。
レイアウトは上から何ピクセルかとかそういうのにも
つかえますからね（＾＾
応援ありがとうございました。
こんばんわ
TAKAです。
お世話になります。
今日の記事とても勉強になりました。
このツールはあると
とても便利ですね。
さっそく
使ってみたいと思います。
応援ポチです。
TAKAさん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
うまいこと気に入ったバナーなどのサイズをはかって
自分で作るときなどにすごく効果的です。
ぜひ試されて下さい。
応援ありがとうございました。
ゆーすけさん
こんばんわ、ＨＩＲＯです。
MeasureIt!便利ですね。
以前、ゆーすけさんからパクらせて頂いた
もじの動くやつ・・・（なんというかわからないｗ）
あれも横の幅が全く分かりませんでした（●＾o＾●）
これがあれば即分かりましたね♪
いいものご紹介ありがとうございます（*^_^*）
応援です。
HIROさん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
それはマーキーっていうタグを利用したやつですね。
あの横幅決めた時もこのツール使って作ったんですよ。
ただ、タグをある程度覚えてない人は使えないかも（汗）
応援ありがとうございました。
ゆーすけさん、こんにちは。
インフォマイスター 白井です。
いつもお世話になっております。
確かに、画像の大きさは重要ですよね。
人によって見やすい大きさは変わってきますからねえ……。
日々研究し、最適な大きさを探っていきたいです。
しかし、グーグルのロボットは文字しか認識できないのも難点です。
そういうときには、Altに文字をきちんと入れて分かるようにしておかないと。
本日も応援です。
ところで、あの応援ボタンは便利ですね。
ぜひともやり方を教えていただきたいですｗ
インフォマイスター白井さん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
画像の大きさとimgタグのサイズ指定をちゃんと
あげないとやっぱりブラウザに負担をかけてしまいますからね。
altもタグ打ちでやってしまうと見落としがちな点の一つですから
気をつけたいところです。
応援ボタン、後ほどメールします。
応援ありがとうございます。
ゆーすけさん
こんばんは、ジョニーです。
いつもありがとうございます＾＾
間違った使い方・・・
私なら確実にやります。
…っていうのは本気で・・・＾＾；
画像サイズいつも苦戦しているんですよ。
私はファイアーフォックスを使っているのですが
同じようなのがあるのですね。
とても参考になりました。
ありがとうございます。
早速使います＾＾
間違った方も・・・ってしつこいか＾＾；
では応援して行きますね☆
ジョニーさん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
間違った使いかた・・・
しかも本気かぃ！！！（＾＾
画像のリサイズとか以外に苦労されるかた
多いと思いますよ。
火狐つかってるなら同じくありますから
ぜひ使ってみてください。
ちゃんと正規の使い方でたのみますよｗ
応援ありがとうございます。
ゆーすけさん たぬきちです(´▽｀)ﾉ
森山さんのコメントをみて
ふたつのアドオンがweb屋の常識と聞いて
?(・д・ﾉ)ﾉ常識シランかった！！
とひとり凹んでおります(笑)
私の場合、画像サイズを測るときは
キャプチャソフトでサイズ測ってます(^^ゞ
考え方は一緒ｗ
altはSEOうんぬん以前に
W3CのHTML構文チェックにおいても
入れないと減点くらいます
キャッチコピーを画像にするのは
以前、私もやったことありますけど
今は装飾系はCSS3で行う用に意識してます
理由はテンプレ変えると・・
横幅変わったりして、収まりきらなくなって
びょーん！ってはみ出したり・・(゜ロ゜)ガクブル
ウエスト114・・ヒップ14・・？
絶対便秘がちだよね・・慢性的な便秘だよね！？
たぬきちさん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
そうそう、Web屋の常識ビビりました。
良いツールだなぁ?と思って紹介してもその道のプロからしたら
常識だ！へへへとニヤニヤされることでしょう（笑）
あ、キャプチャーソフトで画面キャプチャーして
測ってたんですか！それもそれであたまいいな！
その発想は全くなかったです。
前に一生懸命定規ではかったりとかいろいろとしてたんですが
ピクセル変換できねー！！って本気でやってたことありましたから。
altって以外にタグ打ちすると忘れません？
というか・・・最近はタグ打ちする機会もあまりないか・・・。
私も装飾のためにCSS３マスターしないといけないなぁーとは
思うのですが腰が重い。
でもそのテンプレ変えたりではみ出すのは怖いなぁ。
確かに便秘だ！（笑）
詰まりすぎてるｗ
あ、メールありがとうございました（＾＾
早速使わせていだきます♪
高山さん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
本当に簡単にできるプラグインで画像処理の
効率が上がることを考えたら入れて損はない
ものですし、いいと思いますよ（＾＾
応援ありがとうございます。
ゆーすけさん
こんばんわ、ぷぅです。
measureItって知りませんでした。
すごくいいツールですね！
SIRIUSのロゴ作成機能利用で
あんなに綺麗なロゴが出来るのも
知りませんでした。。
画面上の色を取得できる
FE – Color Palette
というツールも便利ですよｗ
応援ぽちり☆ですｗ
ぷぅさん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
そうそう、かなり便利な機能ですよ（＾＾
ぷぅさんは火狐派ですもんね。
SIRIUSのロゴ作成機能はかなりデキる子です。
文字のロゴが一番べんりですよ。
本当はPhotoshopかGIMPあたりつかえるといいですね。
FE-Color Pallette早速入れてみます！ありがとうございます。
応援もありがとうございます
ゆーすけさん
こんばんは。
お世話になってます！
私のブログは、
３カラムで幅が狭いのため、
画像を使うときは、
全て４５０ピクセル幅に統一していました。
しかし、MeasureIt!って便利ですね。
早速試してみましたよ。
ここからは脱線情報になってしまうのですが、、、
私は普段CoolNovo（以前はChromePlusと呼ばれていました。）を
使っています。
まぁ、Google Chromeと仕様が似ているのですが、
これではMeasureIt!はインストールしても使えませんでした。
もちろんGoogle Chromeでは使えましたよ(*^^*)
しかし、CoolNovoは
最近よくクラッシュして固まります(^_^;)
YouTubeなどは、
ホントによく固まって止まります。
そして、
最近、驚いたのが
アフィリエイトジーニアスのセールスレターは
開くことができず必ず固まっていました。
やっぱり、
Google Chromeの方がホンマモンのようですね(^_^;)
長々とコメント失礼いたしましたm(_ _)m
応援くりっく☆
たなべっちさん＞
こんばんは、ゆーすけです。
いつもお世話になってます。
そうそう、３カラムだとちょっと狭いんですよね。
でも４５０ってルールを決めているなら問題ないと思いますよ（＾＾
上でたぬきちさんも仰ってますが、テンプレート変える時が
一番の問題ですからね。
CoolNovoってはじめて聞きました！
Google Chromeの軽量版なんですね（＾＾
Youtubeでとまってアフィリエイトジーニアスでも止まるということは
動画ブラグイン関係がなにかおかしいのかな？
IEタブもプラグインで入れられるしGoogle Chromeを
使ったほうがミスがないかもですね！
いえいえ、こういう情報は検索者さんにも役立ちますから
（特にこのブログリピーターはハック好きが集まってるので）
どんどん教えて下さい♪
応援もありがとうございます