Image title attribute or link title attribute or both?

妖精的绣舞 提交于 2019-11-26 21:57:16

问题


Let's say I have a list of images on the page, that are wrapped within links. So when u click an image it gets you to a page that displays the larger image

How should I handle title tags here?

Do I put the image title on both the image and the link, or just the image? Does it matter if the title is the same as the "alt" attribute?

<a title="image description" href="#"><img title="image description" alt="image description" src="image.jpg"></a>

回答1:


The image title attribute should describe the image.

The link title attribute should describe the target of the link.

<a title="view larger version" href="#">
  <img title="image description" alt="image description" src="image.jpg">
</a>



回答2:


HTML5 defines guidelines for alt usage. See the section "A link or button containing nothing but an image":

When an a element that is a hyperlink, or a button element, has no text content but contains one or more images, include text in the alt attribute(s) that together convey the purpose of the link or button.

So your alt attribute content could include something like "Open larger version of …".

(You may also be interested in my answer to the question on UX SE: What should the ALT text be for an image that is also a link?)


You should never have the same content for alt and title. See the general guidelines (from the W3C Candidate Recommendation of HTML5) (Update: In the W3C Recommendation of HTML5, this section got changed, and it no longer contains that quote.):

A corollary to this is that the alt attribute's value should never contain text that could be considered the image's caption, title, or legend. It is supposed to contain replacement text that could be used by users instead of the image; it is not meant to supplement the image. The title attribute can be used for supplemental information.



来源:https://stackoverflow.com/questions/19755928/image-title-attribute-or-link-title-attribute-or-both

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!