带有语义标记的延迟图像加载
Posted
技术标签:
【中文标题】带有语义标记的延迟图像加载【英文标题】：Lazy image loading with semantic markup 【发布时间】：2013-04-16 05:12:40 【问题描述】：我有一个图片丰富的网站。为了为用户节省带宽，我想在图像进入视口时延迟加载图像。有assorted jQuery plugins 和类似的东西可以做到这一点。这是以放置实际图像 url 为代价的，而不是在 src 属性中，而是在其他地方。这使得标记不太好，更糟糕的是，搜索引擎爬虫难以理解。
有没有办法同时拥有延迟图像加载和语义、搜索引擎友好的标记？
【问题讨论】：
【参考方案1】：您无需将图像的src 放在其他位置。有一个没有。可用的插件。检查以下链接http://www.appelsiini.net/projects/lazyload
【讨论】：
这不正确，您链接的插件在src 中使用占位符，在data-original 属性中使用实际网址。
哦，我明白了，如果对您有帮助，请查看此链接：webmasters.stackexchange.com/questions/26190/…【参考方案2】：
请注意，现在 <img loading="lazy" 已标准化，因此您可以将 src 保留为实际来源，一切都与语义完美结合，更多详细信息请访问：How do you make images load lazily only when they are in the viewport?
【讨论】：
以上是关于带有语义标记的延迟图像加载的主要内容，如果未能解决你的问题，请参考以下文章