HTML5 ¿qué es el atributo itemscope y qué hace en términos simples?

89

Solo quería saber para qué se usa básicamente el atributo de itemcope de HTML5.

html delimitar
fuente
2
Esto debería poder explicárselo en términos sencillos
Šime Vidas

Respuestas:

67

El [itemscope]atributo es un atributo booleano para definir el alcance de los metadatos contenidos dentro del elemento.

Está definido en la API de microdatos HTML5 :

Cada elemento HTML puede tener un itemscopeatributo especificado. El itemscopeatributo es un atributo booleano.

Un elemento con el itemscopeatributo especificado crea un nuevo elemento , un grupo de pares nombre-valor.

En otras palabras, es una forma de asociar metadatos con un nodo DOM en particular.

Esto es utilizado por la API de Schema.org para asociar datos para motores de búsqueda y redes sociales. Google+ utiliza el esquema como forma de proporcionar títulos, miniaturas y descripciones de las páginas compartidas por los usuarios.

También debe tenerse en cuenta que [itemscope]y [itemprop]son compatibles con el protocolo Open Graph de Facebook al proporcionar metadatos para una página web. Los mismos metadatos se pueden enumerar para los motores de búsqueda, Facbook y Google+ en un solo conjunto de <meta>elementos en lugar de tener que enumerar la misma información más de una vez:

<html itemscope itemtype="http://schema.org/WebPage" xmlns:fb="https://www.facebook.com/2008/fbml">
  <head>
    <title>An Example Title</title>
    <meta content="An Example Title" itemprop="name" property="og:title" />
    <meta content="Lorem ipsum dolor sit amet" itemprop="description" name="description" property="og:description" />
    <meta content="http://www.example.com/image.jpg" itemprop="image" property="og:image" />
    <meta content="http://www.example.com/permalink" itemprop="url" property="og:url" />
    <link rel="canonical" href="http://www.example.com/permalink" />
  </head>
  <body>
    ...content...
  </body>
</html>

Tenga en cuenta que en el ejemplo, [itemscope]se agregó al <html>elemento. Esto significa que los [itemprop]atributos de <head>y <body>son parte del WebPageelemento.

zzzzBov
fuente
1
Parece que se ha separado del HTML5 final: w3.org/TR/microdata
Ciro Santilli 郝海东 冠状 病 六四 事件 法轮功
34

Los motores de búsqueda, incluidos Bing, Google y Yahoo! ahora están usando itemscope y friends para identificar datos semánticos en páginas web. En el sitio web schema.org , tienen una explicación de cómo usar itemscope con esquemas predefinidos para mejorar los datos que se proporcionan a los motores de búsqueda.

http://schema.org/docs/gs.html

Bryan
fuente