BLOG
セマンティックWeb
2015/2/28
Webサイトやその中に記述された内容について、それが何を意味するかを表す情報(メタデータ)を一定の規則に従って付加することで、コンピュータが効率よく情報を収集・解釈できるようにする構想です。
セマンティクスは、アクセシビリティ、SEO、再利用、開発者間のコミュニケーションに役立ち、それを支援します。
htmlをマークアップするための方法：microformats、microdata、RDFa、schema.org
microformats
ウェブページで使用されるシンプルな規則（エンティティと呼ばれます）で、レビュー、イベント、商品、会社、人物など特定のタイプの情報を表します。HTMLに現実のニーズに応じた意味拡張を施すことを目的としてる。HTMLのバージョンを気にせずに使える。class属性を使用します。
http://microformats.org/
hCardは名刺のようなmicroformatで、HTMLに埋め込むことができる個人や組織に関する情報を提供します。
作成された名刺データファイルには拡張子に「.vcf」がつき、Microsoft Outlookなどの一般的なメールソフトに添付して送ることができます。
例）
|
1 2 3 4 5 6 7 8 9 10 |
<div class="vcard"> <img class="photo" src="www.example.com/tokyotaro.jpg" /> <strong class="fn">山田太郎</strong> <span class="org">ABC社</span>の<span class="title">エンジニア</span> <span class="adr"> <span class="postal-code">123-XXXX</span> <span class="region">東京都</span><span class="locality">港区</span> <span class="street-address">六本木</span> </span> </div> |
microdata
特定の種類の情報（レビュー、人物、イベントなど）を記述するコンテンツにラベル付けする方法の1つです。
HTML5に新たに追加された仕様、HTMLのバージョンは(X)HTML5のみ使用可です。
例）
|
1 2 3 4 5 6 7 |
<div itemscope itemtype="http://data-vocabulary.org/Person"> 私の名前は<span itemprop="name">山田太郎</span>ですが、 みんなから「<span itemprop="nickname">タロウ</span>」と呼ばれています。 私のWebサイトは、 <a href="http://www.example.com" itemprop="url">www.example.com</a> です。 東京都港区に住んでおり、<span itemprop="title">エンジニア</span>として <span itemprop="affiliation">ABC社</span>に勤めています。</div> |
RDFa
コンテンツのメタデータを記述するためのフォーマットであるRDF (Resource Definition Framework) を、要素の属性（attribute）で指定できるようにした仕様です。メタデータをXHTMLで書かれた文書に埋め込むための仕様。OGP(Open Graph protocol)もRDFaをベースにしてます。
例）
|
1 2 3 4 5 6 7 8 |
<div xmlns:v="http://rdf.data-vocabulary.org/#" typeof="v:Person"> 私の名前は<span property="v:name">山田太郎</span>ですが、 みんなから「<span property="v:nickname">タロウ</span>」と呼ばれています。 私のWebサイトは、 <a href="http://www.example.com" rel="v:url">www.example.com</a> です。 東京都港区に住んでおり、<span property="v:title">エンジニア</span> として <span property="v:affiliation">ABC社</span>に勤めています。 </div> |
Tag:SEO