meta-seo-inspector_ecmg

マーケティング

基本的なSEOチェックに。DescriptionやOGPを確認できるChrome拡張META SEO Inspectorの使い方

メタタイトル、メタディスクリプション、OGP、alt属性・・・ゴニョゴニョ

はじめは意味の分からないギョーカイ用語だったこれらのワード。でもサイト運営を続けていくうちに、なんとなーく理解できて、自分なりに設定するようになりますよね。

SEOにどれだけの効果があるのか?何をどこまで厳密に設定するべきなのか?考え方も様々です。私はというと…【メタタイトル・ディスクリプションやOGPの設定、hタグエラーやalt漏れの確認】あたりまでは、記事ごとにざっくりと実践しています。

meta-seo-inspector_ins1

程度はともかく、これらの対策が必要だと判断し、同じように実践している人も多いでしょう。せっかく良かれと思って取り入れたなら設定のし忘れがないかの確認はしておきたいところ。

あ、でも大体でやってるんで。そこまでしなくていいかなー

まあ確認はしたいけど、いちいち編集画面に戻るのメンドクサイし

そんなことより、もっと大事な対策があるだろう!

どの意見にも共感するところがあります。でも、きっと取り組む意味はあるんだろーなー・・・とは思っているでしょう?つまり気軽に確認できればいいってことですよね。そうでなければ続けにくいですから。

じゃあ、ブラウザ拡張機能でサラッと確認できるようにしましょう。ここではChromeの拡張機能【META SEO Inspector】を紹介します。彼と一緒にできることは主に以下のとおり 

主な機能

メタタイトル・ディスクリプション・キーワードの確認

Facebook用OGP・Twitterカード形式等の確認

alt属性抜けなど、ページ内の注意点の確認

nofollowリンクを視覚化して確認

いずれも調べたいページを表示している状態で即!確認できるようになります。

スポンサーリンク

META SEO Inspectorの導入

まずは以下からChromeに追加します。利用者も多く評価も高いので安心です。もちろん無料。

Chrome ウェブストア 

インストールするとこんな可愛らしい電球さん  がアドレスバー横に表示されます。

meta-seo-inspector_01

これだけでOK。もう使用できます。設定も必要ありません。

各項目の確認

調べたいページを表示した状態で電球さんをクリックすると、そのページの詳細が現れます。

meta-seo-inspector_02

ファースト・インプレッションは「ややこしそう・・」でしょう。大丈夫です。

メタタイトル・ディスクリプション・キーワードの確認

まずは一番上。メタタイトル、メタディスクリプション、メタキーワードが確認できます。

meta-seo-inspector_02-1

補足 – ちょっとした私見

WordPressユーザーの場合、メタ情報はプラグインで設定していることも多いと思います。「All In One SEO Pack」などが有名ですね。

このサイトでも利用しているTCDテーマでは、デフォルトでメタタイトルとメタディスクリプションを設定できる独自項目が用意されています。

つまりプラグイン自体不要なのですが、この記事公開時点では念のため、プラグインとあわせ両方に設定していました。上の画像でディスクリプションが2つ表示されているのはそのためです。本来はテーマ付属の機能のみ設定すれば問題ありません。

とにかく小手先を気にし過ぎないことも大切だと考えます。

Facebook用OGP・Twitterカード形式等の確認

その下ではFacebook用OGP設定の確認ができます。

meta-seo-inspector_02-2

アイキャッチ画像もちゃんと指定されていますね。クリックすればデータの確認もできます。

meta-seo-inspector_02-3

meta-seo-inspector_03

これらは設定漏れを確認するためだけでなく、「あれ?ディスクリプション、どんなこと書いてたっけ?」な場合にも重宝します。さらにその下ではTwitter用の設定も確認できます。

meta-seo-inspector_02-4

シェアしてもらった際の体裁確認もラクラクですね。

ページ内の注意点を確認

とはいいつつも。それはそれは便利ではあるけども。自分でひとつずつ項目確認していくのであれば、まだメンドクサイ。(と思う人もいるはず)

大丈夫です。電球インスペクターさんはページ内で「ど忘れ事項」「注意事項」があった場合、赤文字でアラート表示してくれます

【問題】下の画像ではどんな注意点をアラートしてくれているでしょう?

meta-seo-inspector_07

でした。さすがにタイトルフザケすぎです的なツッコミ機能は残念ながら実装されていないようですが、英語表記でもすぐに慣れそうなインターフェイスですね。

hタグエラー、alt属性抜けもアラート

さて、下の画像に挙げる例は何の変哲もない、とある日常を綴った記事の抜粋です。

meta-seo-inspector_09

こんな微笑ましい記事においても、「ど忘れ事項」「注意事項」は存在しているのです。もちろん電球スペクターさんは見逃しません。

meta-seo-inspector_10

指摘されていること、分かりましたか?

h1タグは基本的に、サイトタイトルまたは記事タイトルのみに、ひとつだけ利用されるものです。h1タグをさらに記事本文内に使用してしまっているので、「too many h1 tags」と注意されている状態です。

またもう一つは「1 images with missing ALT attribute」つまり、上の(主人公の身体に褐色の稲妻が走ったランチメニューの)画像はalt属性が抜けている、という注意喚起になります。

文章を書くことに集中していると、こんな”ついうっかり”はよくあることです。なんて頼りになる電球でしょう。

バッジ表示で一目瞭然

META SEO Inspectorはこちらから能動的に「確認しにいかなければならない」ような面倒なツールではありません。上に挙げてきたような注意点の有無や注意箇所の数は、実は電球アイコンにバッジ表示されるので一目瞭然なんです。だから・・・

注意点が無い状態を表す【OK】が表示されていると、ちょっと嬉しくなります。

meta-seo-inspector_04

meta-seo-inspector_01

nofollowリンクを視覚化して確認

外部リンク先のページ内コンテンツが、(失礼ながら)少し低品質かもしれない。または規約違反をしているように見える・・・なんていう時には、nofollow属性を付けることも昔ながらのSEO対策としては定石です。

で、記事を仕上げた後に、「アレ?nofollow付けたっけ?」な事態もよくあることです。そんな時に役立つのがやはりMETA SEO・・・電スペさんです。

上部「options」から「Show nofollow links (pink outline)」にチェックを入れると、nofollow属性を付加しているリンクにだけ、ピンク色の枠が表示されます。

meta-seo-inspector_05

meta-seo-inspector_06

これも地味ながら助かります。確認するために記事編集画面に戻って、目をチカチカさせながら探す・・・といった必要が無くなります。

META SEO Inspectorの役割

meta-seo-inspector_ins2

もれなく必要!と言えそうなメタタイトルやメタディスクリプション、OGP設定の確認はもちろん、注意点をチェックしてくれる点など、かゆいところに手が届くのは大きな付加価値ですね

ただしこのツールに【OK】をもらえたからといって「SEO対策は完璧!」なわけではありません。むしろもっと注力する必要のあることの方が多いくらいでしょう。

このツールでチェック出来るのは【意識次第で出来ることを、出来ているか】の確認です。SEOの観点からも、この簡単な作業量に見合う価値は十分あると考えます。自分が「やっておいた方がいい」と思っていたのであれば尚更のこと

また、この拡張機能を使いはじめると、利用しながらSEOの基本的なルールの一端を覚えていくことにもなるので、サイト開設一年生にもとても有用です。もちろん高学年の先輩方も、他サイトの情報を参考にする使い方など、より有効に活用することが出来るでしょう。

ちゃんと設定出来ているか確認したかったけどなんとなく知らんぷりしていた人は、この機会にぜひ取り入れてみて下さい。きっと、安心感がぐっと上がるはずです。

関連記事

スポンサーリンク

記事が気に入ったら
Requ.logを "いいね!"
Facebookで更新情報をお届け。

Requ.log | レク.ログ

スポンサーリンク
スポンサーリンク

ピックアップ記事

  1. サイトデザインに合わせよう。TCDテーマ記事下にカード型「いいね!ボタン」をセン…
  2. 知っとかないと、後から大変!? WordPressメディア設定と画像サイズのキケ…
  3. 【基本編】スケジュール・タスク管理の大黒柱。万能ツールTodoistの使い方を徹…
  4. Todoistとも連携。複数のメールアカウントを一括管理するMac・iPhone…
  5. WordPressで子テーマを作る際に知っておくべき仕組みと注意点

関連記事

  1. tcd-theme-options_ecmg

    ワードプレス

    理想のWEBサイトを直感デザイン。「TCDテーマオプション」の使い方

    サイトレイアウトは、直感的に、簡単に。WEBサイトを立上げると、最…

  2. original-share-button_ecmg-ps
  3. retina-slider_ec

    ワードプレス

    【Retinaディスプレイ対応5】WordPressのスライダーやサムネイル画像を綺麗に表示させる設…

    スライダー嬢も、綺麗に。このサイトのトップページには、スライダーが…

  4. backup-all-in-auto_ec

    ワードプレス

    WordPressサイトを丸ごとバックアップ!BackWPupプラグインで自動保存のタイマー設定

    一度設定したら、後はおまかせ!せっかく作った自分のWEBサイトが、…

  5. retina-os-solution_ecmg

    ワードプレス

    【Retinaディスプレイ対応1】Macで綺麗に。Windowsでサクサク。ブログ画像をOSごとに適…

    簡単に、美しく。ページ表示速度の観点で考えると、画像においてはでき…

  6. tcd-mag_ecmg-ps
【Requ.log記事】魅力的なブログを、今すぐ作る。
tcd-mag
【Requ.log記事】魅力を活かす、カスタマイズまとめ。
tcd-mag

特集記事

  1. tcd-mag_ecmg-ps
  2. todoist-tips_ecmg
  3. todoist-extension_ecmg
  4. theme-change_ecrt
  5. tcd-theme-user-review_ecmg
  6. valuable-content-from-image_ec

タスク管理で、自己管理。

todoist

人気記事

  1. todoist-basic_ec-ps
  2. chrome-full-screen-capture-ecmg
  3. child-theme_ecmg
  4. media-setting_ec
  5. child-theme-mechanism_ecmg-ps
  6. compress-jpeg-png-images-ecmg

魅力的なブログを、今すぐ作る。

tcd-mag

ピックアップ記事

  1. child-theme_ecmg
  2. widgetoon-js-count-jsoon_ecmg
  3. dash_ecmg
  4. simple-image-sizes_ec-ps
  5. tcd-theme-options_ecmg
  6. enlarge-image-ecmg

ブログのRetina対応、始めませんか?

retina-os-solution

掘り出し記事

  1. unroll-me_ec
  2. screenpresso-initial-setting_ec
  3. favicon-generator_ecmg
  4. mergely-ecmg
  5. meta-seo-inspector_ecmg
  6. browzer-extension_ec

ゆっくり、フシギなGIFアニメ。

gif-animation

最近の記事

  1. firefox-full-screen-capture-ecmg
  2. chrome-full-screen-capture-ecmg
  3. enlarge-image-ecmg
  4. spark-tutorial-ecmg

とっておきのWordPressテーマ。

tcd-theme-selection

ピックアップ記事

  1. blog-theme-mag_ecmg-ps
  2. todoist-routine_ecrt
  3. dash_ecmg
  4. annotation-image-ecmg
  5. facebook-page-plugin_ecmg-ps
  6. tcd-theme-options_ecmg

CATEGORIES

Requ.log | Recommend

WordPressテーマ「MAG(TCD036)」
WordPressテーマ「Bloom(TCD053)」

特集記事

  1. todoist-tips_ecmg
  2. tcd-mag_ecmg-ps
  3. adjust-the-button_ecmg
  4. improvement-flow_ecmg
  5. todoist_ec
  6. retina_ecmg

人気記事

  1. chrome-font_ecmg-1
  2. media-setting_ec
  3. todoist-basic_ec-ps
  4. chrome-full-screen-capture-ecmg
  5. child-theme-mechanism_ecmg-ps
  6. screenpresso-initial-setting_ec
  7. compress-jpeg-png-images-ecmg

最近の記事

  1. firefox-full-screen-capture-ecmg
  2. chrome-full-screen-capture-ecmg
  3. enlarge-image-ecmg
  4. spark-tutorial-ecmg
  1. tcd-theme-selection_ecmg-ps

    ワードプレス

    【目的別】とっておきのWordPressテーマ比較。TCDテーマのおすすめメンバ…
  2. improvement-flow_ecmg

    マネジメント

    ”セルフマネジメント”の第一歩。忙しくても頭と心は軽くしておく、自己管理術と生活…
  3. tcd-theme-user-review_ecmg

    ワードプレス

    TCDテーマの強みとは?他テーマとの違いと基本機能をユーザー目線でレビュー
  4. valuable-content-from-image_ec

    ワードプレス

    「わかりやすいブログ」に必須の「伝わりやすい画像」の作り方
  5. retina_ecmg

    ワードプレス

    【保存版】知ったら戻れない、美しさの極みへ。WordPress画像のRetina…
PAGE TOP