HTML itemscope globales Attribut

itemscope ist ein booleschesglobales Attribut, das den Gültigkeitsbereich der zugeordneten Metadaten definiert. Wenn dasitemscope-Attribut für ein Element angegeben wird, wird ein neues Element erstellt, das eine Reihe von Name-Wert-Paaren erzeugt, die dem Element zugeordnet sind.

Ein verwandtes Attribut,itemtype, wird verwendet, um die gültige URL eines Vokabulars anzugeben (wieschema.org), das das Element und den Kontexte seiner Eigenschaften beschreibt. In jedem der folgenden Beispiele stammt das Vokabular vonschema.org.

Jedes HTML-Element kann einitemscope-Attribut spezifiziert haben. Einitemscope-Element, das keinen zugeordnetenitemtype hat, muss einen zugeordnetenitemref haben.

Hinweis:Mehr überitemtype-Attribute finden Sie unterhttps://schema.org/Thing

Verwendungshinweise

itemscope id Attribute

Wenn Sie dasitemscope-Attribut für ein Element angeben, wird ein neues Element erstellt. Das Element besteht aus einer Gruppe von Name-Wert-Paaren. Für Elemente mit einemitemscope-Attribut und einemitemtype-Attribut können Sie auch einid Attribut angeben. Sie können dasid-Attribut verwenden, um einen globalen Bezeichner für das neue Element festzulegen. Ein globaler Bezeichner ermöglicht es dem Element, sich auf andere Elemente zu beziehen, die auf Seiten im gesamten Web gefunden werden.

Beispiele

Darstellung strukturierter Daten für einen Film

Das folgende Beispiel spezifiziert denitemtype als "http://schema.org/Movie" und gibt vier verwandteitemprop-Attribute an.

itemscope	Itemtype	Film
	itemprop	(itemprop Name)	(itemprop Wert)
	itemprop	Regisseur	James Cameron
	itemprop	Genre	Science Fiction
	itemprop	Name	Avatar
	itemprop	Trailer	https://youtu.be/0AY1XIkX7bY

html

<div itemscope itemtype="https://schema.org/Movie">  <h1 itemprop="name">Avatar</h1>  <span>    Director: <span itemprop="director">James Cameron</span> (born August 16,    1954)  </span>  <span itemprop="genre">Science fiction</span>  <a href="https://youtu.be/0AY1XIkX7bY" itemprop="trailer">Trailer</a></div>

Darstellung strukturierter Daten für ein Rezept

Im folgenden Beispiel gibt es vieritemscope-Attribute. Jedesitemscope-Attribut legt den Gültigkeitsbereich seines entsprechendenitemtype-Attributs fest. Dieitemtypes,Recipe,AggregateRating undNutritionInformation im folgenden Beispiel sind Teil derschema.org strukturierten Daten für ein Rezept, wie durch das ersteitemtype,http://schema.org/Recipe, angegeben.

itemscope	itemtype	Rezept
	itemprop	Name	Omas Festtags-Apfelkuchen
	itemprop	Bild	https://c1.staticflickr.com/1/30/42759561_8631e2f905_n.jpg
	itemprop	datumVeröffentlicht	2022-11-05
	itemprop	Beschreibung	Dies ist das Apfelkuchenrezept meiner Großmutter. Ich füge gerne eine Prise Muskatnuss hinzu.
	itemprop	vorbereitungsZeit	PT30M
	itemprop	kochZeit	PT1H
	itemprop	gesamtZeit	PT1H30M
	itemprop	rezeptAusbeute	1 9" Kuchen (8 Portionen)
	itemprop	rezeptZutat	Fein geschnittene Äpfel: 6 Tassen
	itemprop	rezeptZutat	Weißer Zucker: 3/4 Tasse
	itemprop	rezeptAnweisungen	1. Äpfel schneiden und schälen 2. Zucker und Zimt mischen. Zusätzlichen Zucker für saure Äpfel verwenden.
	itemprop	Autor [Person]
	itemprop	Name	Carol Smith
itemscope	itemprop[itemtype]	gesamtBewertung [AggregateRating]
	itemprop	bewertungsWert	4.0
	itemprop	rezensionsAnzahl	35
itemscope	itemprop[itemtype]	nährwert [NutritionInformation]
	itemprop	portionsGröße	1 mittlere Scheibe
	itemprop	kalorien	250 Kal
	itemprop	fettGehalt	12 g

Hinweis:Ein praktisches Tool zum Extrahieren von Microdata-Strukturen aus HTML ist GooglesRich Results Testing Tool. Probieren Sie es mit dem hier gezeigten HTML aus.

HTML

html

<div itemscope itemtype="https://schema.org/Recipe">  <h2 itemprop="name">Grandma's Holiday Apple Pie</h2>  <img    itemprop="image"    src="https://c1.staticflickr.com/1/30/42759561_8631e2f905_n.jpg"    width="50"    height="50" />  <p>    By    <span itemprop="author" itemscope itemtype="https://schema.org/Person">      <span itemprop="name">Carol Smith</span>    </span>  </p>  <p>    Published:    <time datetime="2022-11-05" itemprop="datePublished">      November 5, 20022    </time>  </p>  <span itemprop="description">    This is my grandmother's apple pie recipe. I like to add a dash of nutmeg.  </span>  <br />  <span    itemprop="aggregateRating"    itemscope    itemtype="https://schema.org/AggregateRating">    <span itemprop="ratingValue">4.0</span> stars based on    <span itemprop="reviewCount">35</span> reviews  </span>  <br />  Prep time: <time datetime="PT30M" itemprop="prepTime">30 min</time>  <br />  Cook time: <time datetime="PT1H" itemprop="cookTime">1 hour</time>  <br />  Total time: <time datetime="PT1H30M" itemprop="totalTime">1 hour 30 min</time>  <br />  Yield: <span itemprop="recipeYield">1 9" pie (8 servings)</span>  <br />  <span    itemprop="nutrition"    itemscope    itemtype="https://schema.org/NutritionInformation">    Serving size: <span itemprop="servingSize">1 medium slice</span><br />    Calories per serving: <span itemprop="calories">250 cal</span><br />    Fat per serving: <span itemprop="fatContent">12 g</span><br />  </span>  <p>    Ingredients:<br />    <span itemprop="recipeIngredient">Thinly-sliced apples: 6 cups<br /></span>    <span itemprop="recipeIngredient">White sugar: 3/4 cup<br /></span>    …  </p>  Directions: <br />  <div itemprop="recipeInstructions">    1. Cut and peel apples<br />    2. Mix sugar and cinnamon. Use additional sugar for tart apples. <br />    …  </div></div>