マイクロデータ
HTML5には、とりわけ、インターネットに少しのセマンティクスをもたらすように設計された標準があります。 もちろん、RDFやmicroformatsなどの標準はすでに存在しますが、microdataはそれらの間違いを考慮して開発され、ウェブマスターに多くの利点を提供します。 したがって、RDFは既存のデータの複製を意味し、データ量を考えるとコストがかかる可能性があります。 次に、マイクロフォーマットを使用すると、既存のドキュメントをマークアップできますが、
class
などの便利な属性を選択できます。
構文
html要素を
itemscope
ノードにするには、
itemscope
属性を追加する
itemscope
です。 名前を付けると便利です。これには、属性
itemtype="name_of_class"
、正確な特性評価には、属性
itemprop="name_of_property"
ネストされた要素
itemprop="name_of_property"
ます。 ただし、場合によっては、キー->値のペアでは不十分で、ネストされたノードが有効になります。 itemprop属性の後にそれらを示すには、itemscope属性と
itemtype
属性を追加する必要があります。
マークアップの例を次に示します(この記事):
<article itemscope itemtype="http://schema.org/Article"> <h1 itemprop="name"> Microdata</h1> <meta itemprop="inLanguage" content="ru" /> <section itemprop="articleBody"> «»! </section> <section itemprop="author" itemscope itmetype="http://schema.org/Person"> <span itemprop="additionalName">VlAleVas</span> </section> </article>
一部のプロパティにはいくつかのプロパティがあり、たとえばロシア語の使用が問題になる場合があります。 しかし、そのようなプロパティは
link
タグで識別できます:
<div itemscope itemtype="http://schema.org/Offer"> <span itemprop="name"></span> <span itemprop="price">$100500</span> <link itemprop="availability" href="http://schema.org/InStock"/> ! </div>
場合によっては、コンテンツはユーザーには表示されますが、写真などの検索エンジンにはアクセスできません。 次に、
meta
が入ります。
<div itemscope itemtype="http://schema.org/Offer"> <span itemprop="name"> 4GSTW</span> <span itemprop="price">$100500</span> <link itemprop="availability" href="http://schema.org/InStock"/> ! <div itemprop="reviews" itemscope itemtype="http://schema.org/AggregateRating"> <img src="five-stars.jpg" /> <meta itemprop="ratingValue" content="5" /> <meta itemprop="bestRating" content="5" /> <span itemprop="ratingCount">9000</span> <s></s> . </div> </div>
辞書
例では、クラス名としてURIを使用していることに気づきました。 他の誰かがあなたのクラスを知っていれば良いので、これはそれらを標準化します。 現時点では、 microformats.org 、 data-vocabulary.org 、およびshema.orgの 3つの辞書を知っています。 後者は、最大の検索エンジン(Google、Yahoo!Yandex、Bing)でサポートされており、たとえば同じdata-vocabulary.orgから他の多くの標準を収集するため、好ましい方法です。 各クラスは相続人を持つことができ、親のすべてのプロパティが相続人に渡されます。 すべてのクラスのリストはここにあります 。
Microdata DOM API
このAPIは、microdataノードでの作業を簡素化します;現在、
document.getItems([])
メソッドがあります。 パラメーターなしで呼び出されると、 ネストされたマイクロデータノードではないすべての要素が返されます。パラメーターとして指定することで、特定のタイプのノードを取得できます。
domElement.properties
はPropertyNodeList型のオブジェクトを返し、
domElement.properties
はitemprop属性を持つ要素の値を取得または変更できるようにします。 ただし、残念ながら、Microdata DOM APIはOperaでのみサポートされていますが、これも旧バージョンです。
UPD: termiは、Microdata DOM API を実装するJS ライブラリについて話しました。 ただし、たとえばDOMSettableTokenListを実装する別のライブラリが必要です。
必要ですか?
この質問があるかもしれません。 プロジェクトで既にmicroformatsなどを使用している場合は、さらに使用できます(ただし、検索エンジンでサポートされているという事実ではありません)。 プロジェクトにセマンティックマークアップがまだない場合は、追加することをお勧めします。
ありがとう、この記事がお役に立てば幸いです!