Amazonで買ってよかったもの

記事内に広告を含む場合があります

ブラウザ拡張機能「SEO META 1 Copy」

「SEO META in 1 CLICK」みたいな拡張機能がFirefoxで見つけられなかったので、作ってみました。

SEO関連のメタ情報を簡単に確認できて、1 clickでコピーできる拡張機能です。

 

META情報や見出し、構造化マークアップ(JSON-LD, Microdata, RDFa)をすぐに確認できます。
また情報を簡単にコピーでき、Markdown形式やタブ形式でもコピーできます。

 

スポンサーリンク
この記事を書いた人:まちゃ
ガジェット好き 自作PC歴20年超え スマホゲームのエンジニア アニメ・ゲーム好き

公式ストア

拡張機能・アドオンのインストールは、各ブラウザの公式ストアから追加できます。

 

 

スポンサーリンク

各機能

 

まとめタブ

  • 基本情報
    • Title, DescriptionなどのHeadタグ内の情報を表示
    • 合計DOM要素数
    • Styleタグの数とバイト数
    • CMSがWordPressなら表示。テーマが分かる場合は、テーマも表示。
  • Page Speed
    • Navigation Timing APIから取得しています。
  • All StyleSheets
    • stylesheetタグに設定されているcssファイルの一覧
  • ALL LINKS
    • linkタグに設定されているファイルの一覧
  • ALL SCRIPTS
    • scriptタグに設定されているJSファイルの一覧
  • ALL METAS
    • metaタグに設定されているnameとcontentの一覧
  • Hxタグ、aタグのリンク数
  • 外部リンク rel設定別にリンク一覧

 

 

Page Speed

 

 

見出し タブ

  • H1 – H6タグまでをHTMLの登場順に並べています。
  • 階層ごとに色を変えて、インデントを付けて見やすくしました。
  • 右側の矢印ボタンで登場場所にスクロールします。
  • 一番下にはH1 – H6の使用数とリンク数の一覧を表示します。

 

 

JSON-LD タブ

  • Google推奨の構造化データJSON-LDを確認する機能です。
  • 設定内容の詳細も確認できます。
  • JSON-LDの仕様が正しいかはチェックしていません。
  • 構造化データの種類ごとのGoogleドキュメントへのリンクボタンを設置しました。詳細な仕様についてはリンク先を参照してください。
  • 下部にGoogleのリッチリザルトテストへのリンクも設置しています。JSON-LDの記述が正しいかはGoogleのツールで確認してください。

 

JSON-LD / Microdataデータが画像の場合は表示するように対応

 

Microdata タブ

  • 構造化データのMicrodataを確認する機能です。
  • 詳細も確認できます。
  • サポートが終了した「data-vocabulary.org」が使われていたら赤色の文字でお知らせします。
  • 下部にドキュメント、リッチリザルトテスト、スキーママークアップ検証ツールへのリンクも設置しました。

 

microdataの詳細を確認できます

 

RDFa タブ

  • 構造化データのRDFaを確認する機能です。

 

画像 タブ

  • 上部にimgタグを条件別に件数を表にまとめました。
    • ALT属性を設定していない件数
    • loading=”eager”が設定されている件数
    • loading=”lazy”が設定されている件数
    • JavasScriptでsrc属性を置き換えて表示させるタイプの画像数
      • data-srcが設定されているかで判定しています
    • noscriptタグにimgタグが記述されている件数
    • width, heightが設定されていないimgタグ数
    • 次世代の画像形式のwebp, avifの数
      • 拡張子ではなくcontent-typeで判別しています。APIで取得できない場合があるので、すべて画像をチェックできないかもしれません。
    • 特定のミリ秒以上かかった画像の件数
      • Resource Timing APIを使用しています。APIで取得できない画像については秒数を取得できないのでカウントできません。
    • 権利付き画像
      • IPTC、EXIF、XMPで設定できる著作権系のメタデータが埋め込まれた画像の件数
  • 各条件に一致した画像の一覧で確認できます。
    • サムネイル画像
      • data-srcが存在する場合はdata-srcの画像を表示します。
    • ファイル名
    • ALT属性の値
    • 画像の種類(拡張子ではなくcontent-typeで判別)
    • 画像のファイルサイズ
    • 画像の大きさ
    • 表示までにかかった時間
    • 存在する場合はdata-srcの値
    • 遅延処理
    • 権利付き画像

 

 

権利情報

誰が作成したかなどの著作権情報も確認できます。

Googleが推しているのはIPTCのようです。

ただしWEBPは IPTC を設定できないなど、画像形式によって状況が変わります。

 

確認できる権利メタデータ

  • EXIF
    • artist
    • copyright
  • XMP
    • creator
    • credit
    • rights
  • IPTC
    • By-Line
    • credit
    • copyright notice

 

 

スポンサーリンク

スクリーンショット

まとめタブではtitleやdescription、METAたぐなど基本的な情報を確認できます。

 

見出しタブでは、h1 ~ h6 の見出しタグを確認できます。

 

見出しはMarkdown形式や空白・タブをインデント指定してコピーできます。

 

ページ内の構造化マークアップのJSON-LDを確認できます。

 

プライバシーポリシー

この拡張機能は、Google Analyticsによって利用情報を収集しますが、個人情報やWebサイトの情報などをGoogle Analyticsに送信することはありません。

また、トラッキングにはクッキーが使用されます。

 

 

 

コメント

目次へ
タイトルとURLをコピーしました