什么是 Alt 描述

在HTML代码中使用Alt 替代文字,也称为“alt属性”,“alt描述”,以及俗称但技术上不正确的“alt标签”来描述页面上图片img的外观和功能。

 

alt描述的使用:

1.在照片添加描述要以网页可阅读性为原则,让使用萤幕阅读器的视觉障碍用户,使用来阅读alt属性,可以以更好地理解页面图片。

2.如果无法下载图片档案时,Alt标签将会显示在图片的位置。

  1. Alt标签为搜索引擎爬虫提供更好的图片上下文/描述,帮助他们正确地索引图片。

程式码示例

 

<img src=”chocolate_cake.gif” alt=”巧克力蛋糕”>

最佳格式

描述的最佳格式具有足够的描述性,但不包含关键字填充,如果你能闭上你的眼睛,让别人阅读描述,并可以想像一个相当准确的图片描述,那么就是正确的。

 

好的描述:

 

白色餐盘上放了一块巧克力蛋糕,并放了一副叉子的图片,用来做alt描述的范例图

<img src=”chocolate_cake.gif” alt=”巧克力蛋糕”>

这描述只是“好”,因为它不是很具描述性。是的,这是一巧克力蛋糕的图片,但这幅图片还有更多值得一提的地方。

 

更好的描述:

 

<img src=”chocolate_cake.gif” alt=”白色餐盘放了一块巧克力蛋糕,并放了一副叉子!” >

这个描述是一个更好的方式,因为它更仔细的描述了图片中的内容,这不仅是一块”蛋糕”(作为第一个描述范例);白色餐盘放了一块巧克力蛋糕,并放了一副叉子!

 

不建议:

 

<img src=”pancakes.png” alt=””>

OR

 

<img src=”pancakes.png” alt=”蛋糕,蛋糕,巧克力蛋糕,好吃蛋糕,巧克力蛋糕”>

这两个例子都不推荐。代码的第一行实际上根本不包含任何描述(注意引号是空的),而第二个例子显示了描述中的关键字填充。

 

为什么alt描述是重要的?

1.无障碍

描述要以网页可阅读性为原则,它最初的(也是主要的)目的是让无法看到图片的访问者,藉由描述来描述,这包括无法看到图片的萤幕阅读器和浏览器,也包括视力受损或无法直接识别图片的用户,在您的图片中添加描述可确保所有用户(无论视觉能力如何)都能欣赏您网站上的内容。

 

2.图片SEO

在您的图片上使用描述可以带来更好的用户体验,也可能帮助您获得显式和隐式搜索引擎优化的好处,随著添加图片标题和文件命名的最佳做法,包括描述也可能有助于图片SEO。

 

尽管搜索引擎图片识别技术多年来已经有了很大的改进,搜索爬虫仍然不能在网页上“看”图片,所以将解释完全留给爬虫手中是不明智的,如果他们不明白,或者弄错了,那么你可能会排除到你不想排除的关键字,或者完全错过排名。

 

从这个意义上来说,描述为您提供了另一个曝光目标关键字的机会,由于网页内关键字的使用量仍然将搜索引擎的排名因素作为重要因素,因此创建替代图片的文字是最符合您重视的环节,如果可能的话,最好要包含您要的目标关键字或关键字相关词组。

 

我如何撰写好alt的描述?

1.尽可能详细地描述图片,描述:

初衷是设计用来为无法看到图片的用户提供图片的替代解释,如果一个图片没有真正表达任何意义与价值,只是出于设计目的,它应该是放置在CSS,而不是HTML。

 

2.保持(相对)较短:

大部分的萤幕阅读器会将约125个字符后的字符切掉,因此建议将其保留为不超过125字符数量。

 

3.使用您的关键字描述为您提供了另一个机会:

可以将您的目标关键字包含在网页上,从而有机会向搜索引擎发出信号,表明您的网页与特定搜索查询高度相关,虽然您的首要任务应该是描述图片并提供上下文,如果图片与关键字有相关意义,请将关键字包含在页面上至少一个图片的描述中。

 

4.避免关键字填充:

google不会把你的注意力停在写得不好的描述上,但是如果你用自己的描述来填充很多的相关关键字,那么你就会遇到麻烦,请专注于为图片提供上下文的描述性替代文字,当然如果可能的话,最好可以包含您的目标关键字。

 

5.不要将图片做成文字:

这不是对于文字的最佳作法,更不是的搜索引擎优化对于友善的网站开发原则, 由于搜索引擎无法读取图片中的文字,因此应避免使用图片代替文字,如果您必须这样做,请在照片的描述中说明的文字内容。

 

6.不要在您的描述放入「形象」「图片」等字眼:

它已经假定您的替代文字是指图片,所以没有必要在使用这些文字说明。

 

7.不要忘记可以使用longdesc = ” “:

longdesc =“”使用时机为,网页放入较复杂的图片时,需要更长的描述才可以说明,此时可以指定档案文件方式说明。

 

8.不要忽略表单按钮:

如果您的网站上的表单使用图片,因为它是“提交”按钮,给它一个ALT属性。图片按钮需要有一个alt属性来描述按钮的功能,如“送出”,“购买”,“注册”等说明。

 

 

发表回复

后才能评论