简体   繁体   English

如何使用HTML微数据和schema.org引用博客文章?

[英]How to cite a blog post using HTML microdata and schema.org?

My goal is to cite a blog post by using HTML microdata. 我的目标是使用HTML微数据引用博客文章。

How can I improve the following markup for citations? 如何改进引用的以下标记?

I am seeking improvements on the syntax and semantics, to produce a result that works well with HTML5 standards, renders well in current browsers, and parses well in search engines. 我正在寻求语法和语义的改进,以产生与HTML5标准一致的结果,在当前浏览器中呈现良好,并在搜索引擎中进行良好的解析。

The bounty on this question is for expert advice and guidance. 这个问题的赏金是专家建议和指导。 My research is turning up many opinions and snippets, so I'm seeking clear answers, complete samples, and canonical documentation. 我的研究提出了许多意见和片段,所以我正在寻找明确的答案,完整的样本和规范的文档。

This is my work in progress and I'm seeking advice on it's correctness: 这是我正在进行的工作,我正在寻求有关它正确性的建议:

  1. Use <div class="citation"> to wrap everything. 使用<div class="citation">来包装所有内容。

  2. Use <article> with itemscope and BlogPost to wrap the post info including its nested info. 使用带有itemscopeBlogPost <article>来包装帖子信息,包括其嵌套信息。

  3. Use <header> and <h1 itemprop="headline"> to wrap the post name link. 使用<header><h1 itemprop="headline">来包装帖子名称链接。

  4. Use <cite> to wrap the post name. 使用<cite>包装帖子名称。

  5. Use <footer> to wrap the author info and blog info. 使用<footer>包装作者信息和博客信息。

  6. Use <address> to wrap the author link and name. 使用<address>包装作者链接和名称。

  7. Use rel="author" to annotate the link to the author's name. 使用rel="author"来注释作者姓名的链接。

  8. Use itemprop="isPartOf" to connect the post to the blog. 使用itemprop="isPartOf"将帖子连接到博客。

This is my work in progress HTML source: 这是我正在进行的HTML源代码:

<!-- Hello World authored by Alice posted on Bob's blog -->
<div class="citation">
  <article itemscope itemtype="http://schema.org/BlogPosting">
    <header>
      <h1 itemprop="headline">
        <a itemprop="url" href="…">
          <cite itemprop="name">Hello World</cite>
        </a>
      </h1>
    </header>
    <footer>
      authored by
      <span itemprop="author" itemscope itemtype="http://schema.org/Person">
        <address>
          <a itemprop="url" rel="author" href="…">
            <span itemprop="name">Alice</span>
          </a>
        </address>
      </span>
      posted on
      <span itemprop="isPartOf" itemscope itemtype="http://schema.org/Blog">
        <a itemprop="url" href="…">
          <span itemprop="name">Bob's blog</span>
        </a>
      </span>
    </footer>
  </article>
</div>

Related notes thus far: 迄今为止的相关说明:

  • The <cite> tag W3 reference says the tag is "phrase level", so it works like an inline span, not a block div. <cite>标签W3引用表示标签是“短语级别”,因此它的作用类似于内联跨度,而不是块div。 But the <article> tag seems to benefit from using <h1> , <header> , <footer> . <article>标签似乎从使用<h1><header><footer>受益。 As best I can tell, the spec does not give a solution for citing an article by using <cite> to wrap <article> . 据我所知,规范没有给出引用文章的解决方案,使用<cite>来包装<article> Is there a solution to this or a workaround? 是否有解决方案或解决方法? (The work in progress fudges this by using <div class="citation"> ) (正在进行的工作通过使用<div class="citation"> )来捏造这个

  • The <address> tag W3 reference says the content "The address element must not be used to represent arbitrary addresses, unless those addresses are in fact the relevant contact information." <address>标记W3引用表示内容“地址元素不得用于表示任意地址,除非这些地址实际上是相关的联系信息。” As best I can tell, the spec does not give a solution for marking the article's author's URL and name, as distinct from the article's contact info. 据我所知,规范没有给出标记文章作者的URL和名称的解决方案,这与文章的联系信息不同。 Is there a solution for this or a workaround? 是否有解决方案或解决方法? (The work in progress fudges this by using <address> for the author's URL and name) (正在进行的工作通过使用<address>作为作者的URL和名称来捏造这一点)

Please ask questions in the comments. 请在评论中提问。 I will update this post as I learn more. 随着我的了解,我会更新这篇文章。

If you'd ask me which markup to use for a list of links to blog posts ( OP's context ), without seeing your example, I'd go with something like this: 如果您问我使用哪个标记作为博客帖子的链接列表( OP的上下文 ),而没有看到您的示例,我会选择以下内容:

<body itemscope itemtype="http://schema.org/WebPage">

<ul>
  <li>
    <cite itemprop="citation" itemscope itemtype="http://schema.org/BlogPosting">
      <a href="…" itemprop="url" rel="external"><span itemprop="name headline">Hello World</span></a>, 
      authored by <span itemprop="author" itemscope itemtype="http://schema.org/Person"><a href="…" itemprop="url" rel="external"><span itemprop="name">Alice</span></a></span>,
      posted on <span itemprop="isPartOf" itemscope itemtype="http://schema.org/CreativeWork"><a href="…" itemprop="url" rel="external"><span itemprop="name">Bob’s blog</span></a></span>.
    </cite>
  </li>
  <li>
    <cite itemprop="citation" itemscope itemtype="http://schema.org/BlogPosting">…</cite>
  </li>
</ul>

</body>

Using the sectioning content element article , like in your example, is certainly possible, although perhaps unusual (if I understand your use case correctly): As article is a sectioning content element, it creates an entry in the document outline, which may or may not be what you want for your case. 使用分段内容元素article ,就像你的例子一样,当然也许是可能的,虽然可能不常见(如果我理解你的用例正确):由于article是一个分区内容元素,它在文档大纲中创建一个条目,可能会或可能不是你想要的情况。 (You can check the outline with the HTML5 Outliner , for example.) (例如,您可以使用HTML5大纲查看大纲 。)

Another indication that a sectioning content element might not be the best choice: Your article doesn't contain any actual "main" content. 分段内容元素可能不是最佳选择的另一个迹象:您的article不包含任何实际的“主要”内容。 Simply said, the main content of a sectioning content element could be determined by stripping its metadata: header , footer , and address elements. 简单地说,分段内容元素的主要内容可以通过剥离其元数据来确定: headerfooteraddress元素。 (This is not a explicitly specified, but it follows from the defintions in Sections .) (这不是明确指定的,但它来自章节中的定义。)

However, not having this content is not wrong . 但是,没有这个内容没有 And one could easily imagine (and maybe you intend to do so anyway) that you'll quote a snippet from the blog post (making this case similar to a search result entry ), in which case you'd have: 你可以很容易想象(也许你打算这样做),你会引用博客文章中的一个片段(使这个案例类似于搜索结果条目 ),在这种情况下你会有:

<article>
  <header></header>
  <blockquote></blockquote> <!-- the non-metadata part of the article -->
  <footer></footer>
</article> 

I'll further on assume that you want to use article . 我将进一步假设您要使用article

Notes about your HTML5: 关于HTML5的说明:

  • Semantically, the wrapping div is not needed. 从语义上讲,不需要包装div You could add the citation class to the article directly. 您可以直接将citation类添加到article

  • The header element is optional if it just contains a heading element (this element makes sense when your header consists of more than just a heading element). 如果header元素 只包含一个heading元素,那么 header元素可选的 (当你的header 不仅仅包含一个heading元素时 ,这个元素才有意义)。 However, having it is not wrong, of course. 但是,当然,拥有它并没有错。

  • I'd prefer to include the a element in the cite element (similar to the fifth example in the spec). 我更喜欢在cite元素中包含a元素(类似于规范中的第五个例子)。

  • The span element can only contain phrasing content , so address isn't allowed as a child. span元素只能包含短语内容 ,因此不允许将address作为子级。

  • The address element must only be used if it contains contact information. 只有在包含联系信息的情​​况下才能使用address元素 So if this element is appropriate depends on what is available at the linked page: if it's a contact form, yes; 因此,如果这个元素是合适的,取决于链接页面上可用的内容:如果它是联系表单,是; if it's a list of authored blog posts, no. 如果它是一个创作的博客帖子列表,没有。

  • The author link type might not be appropriate, as it's defined to give information about the author of the article element. author链接类型可能不合适,因为它被定义为提供有关article元素作者的信息。 But, strictly speaking, you are the author. 但是,严格来说, 是作者。 If the article would consist only of the blog post author's actual content, using the author link type would be appropriate; 如果article仅包含博客文章作者的实际内容,则使用author链接类型是合适的; but in your case, you are writing the content ("authored by", "posted on"). 但在你的情况下,你正在写内容(“由”撰写,“张贴在”)。

  • You might want to use the external link type for all external links . 您可能希望对所有外部链接使用external链接类型

Notes about your Microdata: 关于你的微数据的说明:

Taking your example, this would give: 举个例子,这会给出:

<body itemscope itemtype="http://schema.org/WebPage">

<article itemprop="citation" itemscope itemtype="http://schema.org/BlogPosting" class="citation">
    <header>
      <h1>
          <cite itemprop="headline name"><a itemprop="url" href="…" rel="external">Hello World</a></cite>
      </h1>
    </header>
    <footer>
      authored by
      <span itemprop="author" itemscope itemtype="http://schema.org/Person">
          <a itemprop="url" href="…" rel="external"><span itemprop="name">Alice</span></a>
      </span>
      posted on
      <span itemprop="isPartOf" itemscope itemtype="http://schema.org/Blog">
        <a itemprop="url" href="…" rel="external"><span itemprop="name">Bob’s blog</span></a>
      </span>
    </footer>
</article>

</body>

(All things considered, I still prefer the section -less variant.) (考虑到所有事情,我仍然更喜欢无节的变体。)

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM