确定图片规格

真正要定的只有宽度

详情页图片里真正需要决定的值只有宽度。高度由内容决定，体积则是两者的结果。可是很多人把顺序弄反，先纠结纵向多长，做完才发现宽度不对，只好全部重画。

定宽度只有一个标准：要上传的地方把图片显示成多少像素宽。做得比它大，浏览器会缩小显示，白白浪费体积；做得比它小，就会被拉伸，看起来发虚。

makeinfo 的默认画布宽度是 860px。纵向很长的详情页图片普遍会用到这个宽度，拿来当起点很合适。

这个数字不是从桌面屏幕尺寸来的。详情页大多在手机上看，购物 App 会把图片拉伸到屏幕宽度。860px 是在拉伸后仍不发虚、同时体积又不至于过大的折中点。

不过这终究只是起点。要上传的地方另有规定宽度时，以它的值为准 — 各平台不同，同一平台也会改规则。

想更清晰的话，不要加大作业宽度，而要提高导出倍率。编辑仍按 860px 进行，只把成品文件导成 2 倍（1720px）。把作业宽度直接设成 1720px，字号和留白的手感全都要重新适应；只调倍率的话，屏幕上看到的就是原样，只是分辨率翻倍。

"详情页要做 72dpi 还是 300dpi"是常见的问题，但对要放到网页上的图片来说，dpi 什么都不会改变。

dpi 只是文件里记录的一条备注，写着这张图印在纸上时每英寸打多少个点。它只是个数字，既不增加也不减少像素。浏览器和购物 App 不读这个值，只看像素数。1000×1000 的图片，无论存成 72dpi 还是 300dpi，在屏幕上完全一样。

所以网页用图不必在意 dpi，要看的是横向像素数。反过来印刷品的 dpi 决定实际输出尺寸，那时就必须认真对待 — 那是另一回事。

高度由内容决定。不过一直往长了做，会撞上三件事。

切分时最重要的是切在哪里。切在段落中间或商品照片正中，图片之间那道细缝就会像划痕一样显眼。makeinfo 的分割 PNG 会先找区块之间的空白，在那里下刀。自动定的位置不满意时，可以自己移动切割线。挑选位置的标准在切分很长的详情页里详细说明。

撞上体积限制时，先削宽度是最后的手段。在那之前先看这些。

先看这些	说明
切分	如果限制是按单张算，切分就能直接解决，而且完全不损画质。
导出倍率	如果在用 2 倍导出，试试改成 1 倍。体积大约变成四分之一。
文件格式	照片多的话 JPG 比 PNG 小得多。反过来，单色底加大量文字的图，PNG 更小而且文字更锐利。
放进去的照片大小	把 4000px 的原图放进 300px 的位置，那份重量会留在成品里。makeinfo 在添加时会自动缩小，但用其他工具做的素材需要自己确认。

把这些都试过还是不够，才轮到削宽度，因为宽度直接影响清晰度。

下面是普遍通用的数值。不过各平台会调整规定，实际上传前请务必确认该平台的公告或上传页面的说明。这张表只当作开工时的起点来用。

类别	常用数值
详情页正文	宽 860px。平台另有规定宽度时用它的值。
主图（缩略图）	正方形，常用 1000×1000px 左右。在列表里显示得很小，所以要放文字就得放大。
众筹项目正文	正文宽度有时比详情页更宽。先在编辑页面确认实际显示的宽度。
社交正方形	1080×1080px
社交竖版	1080×1350px（4:5）。在信息流里占的纵向空间最多。
社交横版	1200×675px（16:9）

怎么确认 — 商品上传页面的图片附件栏里，通常用小字写着推荐尺寸和体积限制。那里比公告页更常保持最新。

把详情页原样发到社交平台，多半会被裁掉。信息流会把纵向长图折起来，而人们不会去展开。

宣传图必须一张定胜负。留下商品照片、名称、价格、售卖时间，其余删掉。把详情页用的颜色和字体照搬过来，两张图就会看起来像一套，顺着链接进来的人立刻认得出是同一件商品。

在 makeinfo 里把画布宽度改成 1080px，只留需要的区块就行。复制详情页的项目再做减法，比从头重做更不容易让颜色和字体走样。