发表新帖
发表新帖

HTML5 what is the itemscope attribute and what does it do in laymans terms?

前端 未结
关注
2 1083
南笙
南笙 2021-01-30 02:23

I just wanted to know what is the HTML5 itemscope attribute used for basically?

相关标签:
2条回答
  • 后悔当初
    2021-01-30 02:37

    The [itemscope] attribute is a boolean attribute to define the scope of the metadata contained within the element.

    It's defined in the HTML5 Microdata API:

    Every HTML element may have an itemscope attribute specified. The itemscope attribute is a boolean attribute.

    An element with the itemscope attribute specified creates a new item, a group of name-value pairs.

    In other words, it's a way of associating metadata with a particular DOM node.

    This is used by the Schema.org API to associate data for search engines and social networks. Google+ uses schema as the way to provide titles, thumbnails, and descriptions for pages shared by users.

    It should also be noted that [itemscope] and [itemprop] are compatible with Facebook's Open Graph Protocol when providing meta data for a webpage. The same metadata can be listed for search engines, Facbook, and Google+ in a single set of <meta> elements rather than having to list the same information more than once:

    <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>

    Note that in the example, [itemscope] was added to the <html> element. This means that any [itemprop] attributes in the <head> and <body> are part of the WebPage item.

    0 讨论(0)
  • 悲哀的现实
    2021-01-30 02:50

    Search engines including Bing, Google, and Yahoo! are now using itemscope and friends to identify semantic data in webpages. On the website schema.org, they have an explanation of how to use itemscope with predefined schemas to improve the data that is provided to search engines.

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

    0 讨论(0)
 看不清?
提交回复
热议问题