本文主要讲解网站建设中图片地处理方法，让搜索引擎，让客户体验更加地好：北京（jīng）网站制（zhì）作

壹. 用结构化数据写产品图片ALT

我们很（hěn）容易（yì）使用照相机默（mò）认地图片编号当（dāng）做（zuò）图片（piàn）们地（dì）命名，这样地话对（duì）于搜索引擎来说，可能就没有办法辨识图片地内容，从（cóng）而我（wǒ）们就失去啦从图片搜索那块儿带来地流量，这是非常可惜地，特别是当你地产品有数以万计地话。通常我（wǒ）们可以制定结构化数据规则（zé）让技术人员设计程序批量替换图片地alt属性，而无需我们手工操（cāo）作。

我们要思考壹下，访客（kè）地搜索习惯是神（shén）马？会搜索哪（nǎ）些重要词语？最好可以再看壹下谷歌统计里面地重要词语数据，看看有无遗漏。基本（běn）上来说，访客更倾向（xiàng）于搜（sōu）索品牌词+产品系列地词组组合和变化，那（nà）么（me）alt标签地结构化规则就（jiù）出来啦，可（kě）以写为：alt=”{品牌词}{产品系列}-{产（chǎn）品（pǐn）型号}”。对于产品图片（piàn）地描述来（lái）说，不建议写过多（duō）冗余内（nèi）容，保持数据结构化，做到重要词语（yǔ）辨识度高，重要词语（yǔ）信（xìn）息丰富就可以啦，千万（wàn）不要（yào）做（zuò）重要词语（yǔ）堆积。

贰. 图片拍摄角度问题

基本上（shàng）拍（pāi）摄（shè）产品照片不会只拍（pāi）壹个角度，访客（kè）肯定不会满足于只有壹张（zhāng）正（zhèng）面照，多角（jiǎo）度地去展示图片才能更好地吸引访客在（zài）你地（dì）网站上停留更多地时间，才可以去激发起他们地购买欲望，所以自然需要拍摄物体地正面，背面，侧面，细节等等，这个（gè）时候如何（hé）写alt标（biāo）签？

最好地方（fāng）法也是保持（chí）alt标签地结构化，继承主图地格式，千万不要去给这（zhè）些图片壹个全新地写法，正（zhèng）确地写法如下，

alt={品牌词}{产品系列}-{产品型号}-正面

alt={品牌词}{产（chǎn）品系列}-{产品型号}-背面

alt={品牌词}{产品系（xì）列}-{产品型号}-侧（cè）面

保持主干“{品牌（pái）词}{产品系列}-{产品型号}”不变，可以让搜索引擎充分确认（rèn）当（dāng）前图片系列或是页面就是关（guān）于那个（gè）重要词（cí）语，从而让这（zhè）些图片被图片搜索引（yǐn）擎搜索到地几率大大增加。单枪匹马壹（yī）定倒下。
叁.关于大图地显示问题

如果你希望提供更大地图片让用（yòng）户爽壹（yī）下，这个思路很好，但要非常（cháng）小心，不建议将大图直接放在网页上然后用css将图片缩小（xiǎo），虽然你看上去图（tú）片变小啦，但是图片地尺寸还是实实在在存在地，这会影响（xiǎng）加载速度。相反（fǎn），你可（kě）以先放壹张较（jiào）小地图片，然（rán）后提供查看（kàn）大图（tú）功（gōng）能（néng）地选项（xiàng），不（bú）管是（shì）点击弹出大图还是另外新页面显示，都ok。

当然，还有壹些人会（huì）把大图切（qiē）成壹张张小图做拼接（jiē），这样做可以让图片快速显示，但同时壹张图片切成小图之后，服（fú）务器地请（qǐng）求数会增（zēng）加，从（cóng）而会影响网页加载速（sù）度。所以，如果图片地体积实在（zài）过大地话，建议为图片专门（mén）配置新服务器。

肆. 正确看待缩略图

大部分电（diàn）商网站都有缩略图（tú）展示，它（tā）可以让访客迅（xùn）速地扫描到尽可能多地商品样式而不需（xū）要再（zài）去点击（jī）壹个额外地页（yè）面（miàn）。
缩（suō）略（luè）图很棒，但是要小心，他们可能是你网（wǎng）站地速（sù）度杀手。他们通常会出现在关键地购物流程（chéng）之中，若因此影响啦（lā）购物流程地流（liú）畅性，额… 那你就（jiù）可能又损失啦壹个顾客。关于缩略图，我个人有如下两（liǎng）点建议：

尽可能压缩缩略图体积，缩略图地图片不要过高地追求显示质量，当用户点击到（dào）下壹层详情页面（miàn）地时候再给他壹张（zhāng）高质量地图片。尽量不要为缩略图设置alt标签，通（tōng）常我们并不希望搜索引擎索（suǒ）引地是缩略图而应是产品详情页地（dì）高质量原图。

伍（wǔ）. 用对图片格式

目前（qián）有（yǒu）叁种非常流行地图片格式，他们是JPEG，GIF，和PNG。让我们来看看他们有何不同，
JPEG (或者说 .jpg) 是最常用地图片压缩格式（shì），支（zhī）持（chí）最高级别地压缩。通常，对于显示（shì）要求比较（jiào）高地图片（piàn）来说，JPEG格式展示地图片效果较GIF和PNG有明显地优势。

GIFs (.gif) 地图片显示质量要比JPEGs逊色很多，通常用作非常简单地图片展示，比如素材或者装饰（shì）性图案，gif也可（kě）以用来制作（zuò）动（dòng）画。gif不适合用作高显示质量地（dì）图片（piàn）。

PNG图片是比gif更好地选择，因为（wéi）PNG图片支持（chí）地色彩要比GIFs多。此外，和JPEG壹样，PNG反复保存也不会影响（xiǎng）图片质量，而（ér）且对于小图来说，PNG占用地（dì）体积极小（xiǎo），PNG完美支持透明背景，所以（yǐ）壹般logo或壹般装饰性图案都会（huì）选择PHG格（gé）式（shì）。注意PNG-贰肆图片体积要超叁倍地大于同样情况（kuàng）下地（dì）PNG-捌版本，对待PNG你要十分小心，看仔细啦（lā）。
通过对比相同体积下（xià）（都是贰肆（sì）kb）不同格式地图片显示（shì）效果，经过测试可以（yǐ）看（kàn）到，JPEG 是获胜者，在同样地体积下，GIFs和PNGs必须以牺牲图片质量为代（dài）价。不过话又说（shuō）回（huí）来，如果对于非常小地图（tú）片来说（比如小于（yú）伍K），PNG是比较好地选择（zé），相比GIF，PNG可以（yǐ）在（zài）体积很（hěn）小地情况下依然（rán）不会让图片失真。

当我们选择图（tú）片格式时，如下（xià）壹些tips供大家参考，

对于电商网（wǎng）站来说，产品图片地质量要求极高，JPEGs毫无（wú）疑问是首选，他们有相对高质量地图片显示且（qiě）不会占用太大地（dì）体积。绝对不（bú）要用GIFs来当做产品（pǐn）大图。不然地话文件尺寸会非常大（dà），也没有很好地办法去压缩它（壹压缩就失真）。可以用GIFs做动画或是装饰性小图。PNG可以作为JPEGs和GIFS地替代（dài），如果你想把产品图片做成PNG格式，尽（jìn）量用PNG-捌（bā）而非PNG-贰肆。PNGs同时（shí）也擅长处理简单（dān）地装饰图而只需很小地体积，PNG将会变得越来（lái）越流行。
顺便提壹句，大部分地图片编辑软件可以转换以上叁种（zhǒng）形式（shì）地图片格式。