建议
[建议] 避免为 img 添加不必要的 title 属性。为重要图片添加 alt 属性。
多余的 title 影响看图体验,并且增加了页面尺寸。可以提高图片加载失败时的用户体验。
[建议] 添加 width 和 height 属性,以避免页面抖动。
[建议] 有下载需求的图片采用 img 标签实现,无下载需求的图片采用 CSS 背景图实现。
产品 logo、用户头像、用户产生的图片等有潜在下载需求的图片,以 img 形式实现,能方便用户下载。
无下载需求的图片,比如:icon、背景、代码使用的图片等,尽可能采用 CSS 背景图实现。
img与alt区别
alt
alt属性是考虑到不支持图像显示或者图像显示被关闭的浏览器的用户,以及视觉障碍的用户和使用屏幕阅读器的用户。当图片不显示的时候,图片的替换文字。
alt属性值得长度必须少于100个英文字符
alt属性是img标签的必须属性,如果没有特别意义的图片,可以写alt=""
alt属性是搜索引擎判断图片与文字是否相关的重要依据,alt属性添加到img主要的目的是为了SEO
title
title属性并不是必须的。
title属性规定元素的额外信息,有视觉效果,当鼠标放到文字或是图片上时有文字显示。
title属性更多倾向于用户体验的考虑。