如何在html中标记图像的版权?

问题描述 投票:10回答:3

这是一个主要是语义的问题。我想在网站上放置带有版权的图片。我知道数字和figcaption元素,但figcaption似乎不是最好的标签。这是我需要的标题。如果我有这样的图像:

<figure>
  <img src="img/content/preview.jpg" alt="Alttext für das Bild" />
  <figcaption>Caption goes here</figcaption>
</figure>

我在哪里放版权?

编辑:版权文字必须可见。

html html5 semantics semantic-markup
3个回答
15
投票

In general

版权声明应包含在small element中:

[...]通常包含免责声明,警告,法律限制或版权。

如果版权声明适用于切片内容元素的内容(例如,article),请将small元素包含在属于此切片元素的footer element中:

footer通常包含有关其部分的信息,例如谁写了它,相关文档的链接,版权数据等。

如果它适用于整个页面,您可以在属于smallfooter中包含body元素(即,它不嵌套在切片元素中)。

<body>

 <article>
    <footer>
      <small><!-- if the license applies to the content of this article --></small>
    </footer>
  </article>

  <footer>
    <small><!-- if the license applies to the content of the whole page --></small>
  </footer>

</body>

When it contains a link to the license

如果版权声明包含许可证的链接(或更详细解释条款的页面),请使用license link type,例如:

<a rel="license" href="/license.html">Usage rights</a>
<a rel="license" href="https://creativecommons.org/licenses/by-sa/3.0/">CC BY-SA 3.0</a>

但请注意:此许可证将随后(仅)应用于页面的整个主要内容(由main element指示)。

In your case

figure是一个sectioning root元素,这意味着footer(和header)可以适用于它:

footer元素表示其最近的祖先切片内容或切片根元素的页脚。

所以你可以在footer中包含一个small元素(包含figure元素):

<figure>
  <img src="img/content/preview.jpg" alt="Alttext für das Bild" />
  <footer><small><!-- copyright noice --></small></footer>
  <figcaption>Caption goes here</figcaption>
</figure>

从结构上讲,此版权声明适用于figure元素的全部内容。 (也可以在footer中加入figcaption。)

(如果您有许可证的链接,只有使用license链接类型,如果此figure是主要内容,并且没有其他主要内容不应在同一许可证下获得许可。)

Leaving plain HTML: structured data

通过使用结构化数据(例如,RDFa,Microdata),您可以更具体。这将允许为每个网页指定不同的许可证。 Example in this Webmasters SE answer.


2
投票

我已经看到使用<small>Your copyright text</small>用于此目的。

来自HTML spec<small>

小元素表示小写,例如小字。

小字通常包含免责声明,警告,法律限制或版权。小字体有时也用于归属或满足许可要求。

以前,<small>元素用于显示具有较小字体的某个文本,但是现在所有样式都应该通过CSS完成,并且您的HTML应该只是作为名称建议的标记 - 标记。

您的浏览器默认样式表可能仍会显示具有较小字体大小的<small>元素的内容,因此您可能必须使用自己的CSS覆盖它。


1
投票

你应该使用<small>HTML5 Spec):

小字通常包含免责声明,警告,法律限制或版权。小字体有时也用于归属或满足许可要求。

© www.soinside.com 2019 - 2024. All rights reserved.