图标Icon
一个向下箭头，到底是下载还是展开？
图标以简化图形表达对象、动作或状态，帮助快速识别。不同用户可能对同一符号有不同理解，因此实际操作还需要清楚名称、可见状态和适当文字，而不只是一张小图。
小图让你认得快，文字告诉你会发生什么。越重要或越容易误会的动作，越不能让用户靠试点猜。
地图上的符号配图例才能说明医院、停车场或出口；不是画得整齐就人人懂。
类比到这里为止：图形含义可能跨地区或场景变化。熟悉一个产品里的符号，不保证在另一个产品里也有同样意义。
下载规格书用明确的下载入口，展开参数用可读取的展开状态。删除按钮避免仅靠一个未说明的小叉号。
三个位置分别命名
- 纯图按钮
- 控件名称说动作，例如“下载规格书”。
- 文字旁装饰
- 保留文字即可，图形不额外制造重复名称。
- 状态符号
- 搭配文字说明，如“未保存”，不只换颜色。
小图也需要足够操作空间
图标本身可以小，按钮的点击与焦点范围仍应足够。将多个不同动作挤在几像素距离内，会增加误触。
本目录的图标预览是含义示意，不包含真正删除、下载或发送动作。
继续看项目应用与交付检查
图标 在项目中负责什么
- 什么时候用
- 少量重复动作或对象需要快速扫描，且名称与行为已有清楚定义时。
- 它解决什么
- 在不牺牲含义的前提下提供辅助视觉线索。
- 它不负责什么
- 悬停提示不能替代触屏和键盘用户的说明。装饰图标与旁边文字重复时，避免反复朗读。
- 放进真实项目
- 用放大镜表示搜索、下载箭头表示资料下载，但不只靠图标表达关键操作。
图标用来加速识别，陌生动作仍需文字或可访问名称
搜索、收藏、下载等常见动作可以配图标；行业专用的“创建报价”若只画一个抽象符号，用户很难猜。
- 01
优先使用用户熟悉且全站一致的符号。
- 02
关键或陌生动作同时显示文字。
- 03
检查线条、尺寸和对比度在小屏上可辨。
图形帮识别，名称讲动作，状态讲结果。
容易混淆的地方
图标不是按钮本身，应用图标代表应用，favicon 代表浏览器入口；角色由使用场景决定。
只有一个向下箭头的按钮，手机用户分不清是下载还是展开。怎样改进？
你可以这样告诉 AI Agent
“
我在处理这件事：用放大镜表示搜索、下载箭头表示资料下载，但不只靠图标表达关键操作。请以“图标”为主线，先说明它在这里负责什么、不负责什么；再列出必要输入、建议动作和可验证结果。用外贸独立站的业务语言回答，不确定的信息标为待确认。
内容依据与延伸
本站用原创中文解释把专业概念映射到外贸独立站；定义和机制继续以官方资料为准，业务例子再回到 外贸独立站询盘优化实战 验证。
本站整理说明：原创整理：Web 开发、产品设计、AI 协作与外贸独立站实践