规范图片文件名是html seo的关键环节，需用小写英文、连字符分隔的描述性短语准确反映内容，嵌入真实相关关键词，并保持命名逻辑一致，避免无意义命名、堆砌虚构词及技术错误。
规范图片文件名是HTML SEO中常被低估却极其关键的一环。搜索引擎在解析页面时，会先读取文件名再读alt文本——它就像图片的“第一张名片”，直接影响爬虫对内容的初步判断。
用描述性短语替代默认命名
避免使用相机或手机自动生成的“IMG_2045.jpg”“Screenshot-1.png”这类无意义名称。它们不传递任何语义，等于主动放弃一个SEO信号。
正确做法是用小写英文、连字符分隔的简明短语，准确概括图片核心内容：
- ✅ red-wireless-headphones-product-shot.jpg（含颜色、品类、用途、类型）
- ✅ macbook-air-m2-dashboard-ui.png（设备型号+场景+界面类型）
- ❌ product-001.jpg（无信息量）
- ❌ headphones_1234567890.webp（含时间戳，仍无语义）
关键词要自然嵌入，不堆砌不虚构
文件名中的词必须真实反映图片内容，且与页面主题强相关。比如页面讲“夏季防晒霜选购指南”，配图文件名可为mineral-sunscreen-ingredients-infographic.jpg，其中mineral、sunscreen、infographic都是页面真实覆盖的关键词。
切忌为塞词而失真：
- ❌ best-sunscreen-cream-SPF50-organic-natural-vegan-free-shipping.jpg（冗长、虚构属性、与图不符）
- ✅ zinc-oxide-sunscreen-ingredient-closeup.jpg（真实成分+拍摄视角）
保持一致性与可维护性
同一类图片建议采用统一命名逻辑，便于团队协作和后期维护。例如电商产品图可固定为：[颜色]-[品类]-[视角/场景].[ext]：
- navy-cotton-tshirt-front-view.jpg
- beige-cotton-tshirt-flat-lay.jpg
- navy-cotton-tshirt-detail-sleeve.jpg
这种结构既利于人工识别，也方便CMS批量处理或脚本校验。
注意技术细节
文件名不区分大小写但建议全小写，避免空格、中文、特殊符号（如#、%、&），这些可能在URL中被转义或导致路径错误；扩展名需真实匹配内容格式（.webp文件不能命名为.jpg）；上传前重命名，而非依赖CDN或CMS自动改名——很多系统会截断或替换连字符。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
