ITエンジニア/デザイナ向けにオープンソースを毎日紹介

今回のテーマはHTML構造化です。有名なところではshcema.orgやOpen Graphがあります。Googleの検索結果に追加情報を載せてトラフィックを増やしたり、FacebookやTwitterなどのソーシャルメディアで拡散する際に必要な情報源として使われています。

正しいSEOを行う上でも押さえておきたい技術になります。HTMLを実際にコーディングする方に限らず、システムから自動的にコンテンツを出力する場合のテクニックとしても必要でしょう。

技術

schema.org

Google/Yahoo/Microsoftが立ち上げた構造化データマークアップの共通仕様となっています。その意味では最もWeb検索エンジンと親和性の高い仕組みと言えそうです。規格としては後述するmicrodataが採用されています。

schema.org に関するよくある質問 - ウェブマスター ツール ヘルプ

Microformats

HTML4から利用できます。Twitterなどでリンク先のユーザ名を表す時に使ったりしています。

Microdata

HTML5から使える仕組みです。基本的にはMicroformatsと似た仕様のようです。

RDFa

Open Graphの元になっています。RDFaはHTMLの中にXMLネームスペースを使って組み込むのですが、Open Graphはmetaタグを使うようになっています。最近ではTwitter cardsなどもOpen Graphと同じような拡張になっています。

以下はプレミアムのみです。

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2