网页图片分类和ALT属性

对网页上图片的ALT属性值的内容应该是什么,这个问题其实一直很困扰,特别是文章的特色图片,由于这类图片不需要caption,就更不知道ALT属性的内容应该是什么了。

网页图片分类和ALT属性

WordPress的最新版本在处理图片属性的时候,多了一个小提示,如果图片仅作为装饰用,请留空。这个小提示是这样的:

wordpress对于ALT属性的提示

“如果图片仅作为装饰用,请留空。”

打开链接详情:https://www.w3.org/WAI/tutorials/images/decision-tree/

原来网页上的图片还有这么多分类,按照W3的建议,不同分类的图片的ALT属性设置也不尽相同。具体如下;

(1)信息类图片

这类图片在网页上的作用是提供信息,比如文章内页的图片,一般都是围绕文章主题的一些图片,图片本身含有要传递给读者的信息。这类图片的ALT属性内容应该包含此图片的核心信息。

(2)装饰类图片

这类图片的作用不是提供信息,而是装饰页面。典型如特色图片,一个与文章内容没有关系,可有可无的图片。这类图片的ALT属性内容应该就是空,alt=””。

(3)功能性图片

图片网页上的打印按钮,提交表单的按钮,可能就是图片,点击图片实现某种功能。这类图片的ALT属性应该是描述背后的链接的功能说明。

(4)有文字的图片

通过CSS或者JS技术,我们现在可以将文字直接浮在图片上面。W3的建议是,不要去使用有文字的图片,除非是LOGO图片;对于这类图片的ALT属性,跟图片上的文字一样即可。

(5)复杂图片

比如图表,各种曲线的图片等等。这类图片跟信息类图片相似,需要在ALT属性中写入这个复杂图片所传递的核心信息。

(6)图片组

如果多张图片传递的是相同的一个信息,每一张图片的ALT属性值都应该是这一个完整信息的描述。

(7)图片地图(有多个可点击区域的图片)

图片的ALT属性值应该是整个图片的内容核心,同时,每一个可点击区域的ALT值应该用来描述目的链接。

个人感觉,重点需要关注的第2类,装饰类图片的ALT信息。只有这一类图片的ALT建议是空!

这几年做站的经验,几乎所有的SEO教学内容都在说一个事情,所有的图片都需要有ALT属性值,这是必须的,而且里面还要放置关键词!现在可能就不这样认为了。

W3对网页图片做这样的分类,有一个目的,就是服务各类残障人士,比如看不见的人,他们使用屏幕阅读器(sreen reader)浏览网页,在遇到图片的时候,会将ALT属性值读出来,而如果这个图片只是装饰作用,读出来是没有意义的。

Google的指导文件说:”use text that fulfills the same function as the image”。看不见的人,在浏览网页的时候,完全可以忽略装饰性的图片,因此对这类图片的ALT属性值,应该设置为空!请参考这篇文章:https://varvy.com/titleandalttags.html#alt。

有没有被说服……

虽然各类SEO工具还会提示说,网页上有图片没有ALT属性值,但还是决定对装饰性的特色图片,使用alt=””。

未经允许不得转载:下一个课程 » 网页图片分类和ALT属性

赞 (0) 打赏

评论

6+5=

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏