商品详情
京麦后台，依次点击 商品 >> 商品列表 >> 修改商品 便进入产品修改页面。整个产品页面的结构大致如下：
- 商品信息
- 商品基本信息
- 商品属性
- 规格描述
- 商品图片
- 销售属性
- 商品描述
- 售后物流及其他
- 商品物流
- 商品服务
- 功能设置
我们一般所说的商品详情页面设计，具体对应的是“商品描述”这一个子栏目。在这个子栏目下，商品详情的设计，官方提供了三种工具：图文编辑、代码编辑、高级编辑。
图文编辑中又提供了“添加图片”和“添加文本”两种工作流程，但是根据观察，商家普遍没有使用“添加文本”这个工作流程。比较通用的工作流程是，先使用站外工具把设计图稿完成，导出为图片，然后通过“添加图片”完成上传、审核、使用。
这两天借着 Sound Rise II 的上线，研究了一下商品详情设计官方提供的第二种工具：代码编辑。具有前端设计基础的设计师可以很快容易上手，这个工作流程中提供了众多 CSS 相关代码，主要是针对通过 图片编辑 >> 添加文本 这个流程引入的纯文本进行格式设计，包括字体、字号、行距、颜色、内外边距等属性。
京东开放通过 HTML 进行页面编辑，这是值得肯定的进步，但是目前这一功能仍然存在限制和不足：
- 支持的 HTML/CSS 足够全面吗？
- 代码结构是否合理并易于维护？
- 通过“代码编辑”完成后的商品详情设计，除了原生的京东 App 支持之外，
微信 >> 服务 >> 京东购物小程序，经测试后发现并不支持相关 HTML/CSS 内容，所有经过“代码编辑”所设计的文本内容并不会显示在商品详情页面。
综上，调整之后的工作流程，大致如下：
- 本地使用 Neovim/VSCode/Cursor 完成 HTML/CSS 页面设计
- 使用 Edge/Chrome 把整个页面导出为长图片或者对整个页面进行截图
- 把导出得到的长图片进行上传、过审、使用