为何延后加载
一次加载会拖慢首屏。首屏快就显得快（Nielsen, 1993；Card et al., 1991），对无限滚动和轮播尤为有效。
实现与首屏例外
用loading="lazy"（web.dev, n.d.-a）或Intersection Observer（MDN, n.d.）。首次响应最敏感（Miller, 1968），主图应立即加载。
布局偏移与占位
为避免CLS（web.dev, n.d.-b）预设宽高，用模糊预览或骨架屏占位，并提供替代文本（WCAG 2.2 1.1.1）。
常见问题
- 所有图片都懒加载？
- 不，首屏图片需立即加载。
- 影响SEO吗？
- 标准实现可被抓取。
来源核查日期：2026-10-27
参考文献
- web.dev. (n.d.-a). Browser-level image lazy loading for the web. Google. loading=lazy的原理。
- web.dev. (n.d.-b). Cumulative Layout Shift (CLS). Google. 布局偏移指标。
- MDN Web Docs. (n.d.). Lazy loading. Mozilla. 懒加载的实现方式。
- Nielsen, J. (1993, January 1). Response time limits. Nielsen Norman Group. 响应时间极限。
- Card, S. K., Robertson, G. G., & Mackinlay, J. D. (1991). The information visualizer, an information workspace. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 181–186). ACM. 感知时间常数。
- Miller, R. B. (1968). Response time in man-computer conversational transactions. In Proceedings of the December 9–11, 1968, Fall Joint Computer Conference, Part I (pp. 267–277). ACM. 延迟与期望。
- World Wide Web Consortium. (2023). Web Content Accessibility Guidelines (WCAG) 2.2. 1.1.1替代文本。