“尽管来……伤害我的感情吧。”
这是在线商店经理威尔·诺特（Will Knott）在留言请求中提到的主题。显然，他理解我这种毫无保留的直言风格，因为他的留言最后写道：“朝我眼睛打一拳，把我的鼻子打出血……”
好吧，威尔，我并没有那么生硬（至少我自己不这么认为），但我非常尊重你迈出第一步——承认你的网站存在问题并希望我直入主题。
Old Will Knott Scales 销售各种类型的秤，从邮政秤和食品秤到测量我们令人畏惧的体重和身体质量指数（BMI）的设备。无论是手动、电子还是电池供电？威尔都有。然而，找到你真正需要的产品可能会很困难。
导航
该在线商店的核心导航通过按钮和菜单的布局显得合乎逻辑。但由于缺乏关键色彩和特殊形状的突出按钮，所有内容都混在一起。简而言之，由于所有元素都被归为一个整体，因此没有真正的行动号召。
标志简洁而经典。将店主的名字融入网站（和公司），并使用更现代化的西部风格字体，让顾客知道他们可以找到经典风格的秤和测量设备。
但在顶部标题栏以下，一切就开始混乱了。网页设计有一条经验法则：信息应该像报纸页面那样进行“区块化”。不幸的是，这个网站的区块过多，导致许多元素被埋没。
首页上的导航。
顶部导航栏的高度高达惊人的250像素，而平均导航区域应该不超过120像素。乍一看，shoppers似乎无法启动实时聊天，而且“查看购物车”和“结账”按钮显得十分拥挤。
下面的样机展示了更精简的顶部导航方案。请注意，这只是我用 PhotoShop 随意折腾了大约 10 分钟的结果。尽管如此，你应该能明白我的意思。
较小顶部导航的样机。
导航评分：C
首页
首页包含一个旋转滑块（顺便说一句，它是基于 CSS 的，非常酷）以及中间的方框分类。大量空间被标有“点击并查看类别”的按钮浪费了。人们应始终避免使用“点击”或“点击这里”这样的词语，因为指令应当显而易见。这些按钮完全可以省略。
首页局部视图。
BBB（美国商业改进局）认证图片也占据了过多空间，迫使社交图标和新闻更新下移（需要滚动才能看到 Facebook 链接）。
在页面最底部是“6款最热销商品”。人们甚至能浏览到这么靠下的位置的可能性微乎其微。
理想情况下，首页应重点展示您销售的商品——包括热门/新品类及具体产品。此处列出的27个父级分类（带图片）与分类树中的内容完全重复。
建议选择2-3个顶级分类和几款产品进行重点展示。确保所有重要内容均位于首屏可视范围内（无需滚动即可看到）。
首页评级：D
分类页
此页面存在大量空间浪费。
示例分类页。
这里最关键的是，顾客在需要滚动页面之前只能看到两个推荐商品。如果没有任何内容吸引访客，他们离开页面的几率就会增加。因此，将更多商品展示在首屏可视范围内是明智之举。
这些页面上的产品布局完全可以采用每行三个的排列方式，并配以“更多信息”或“详情”按钮（而非“点击查看”）。
分类页评级：C
产品页
示例产品页。
此布局极其令人困惑。页面上似乎列出了多个产品，且“加入购物车”按钮过大（其尺寸不应大于前一列中显示的产品图片）。“Old Will’s Price”这一在产品价格前的提示语暗示该商品通常售价更高。如果是这种情况，应显示零售价，并通过删除线或较小字体标注。
该页面需要为社交媒体分享按钮设置更合适的位置，并且应将唯一的大尺寸产品图片替换掉当前的小图片。
此页面还缺少用户评价或专家推荐，而这些对于帮助消费者做出购买决策至关重要。
产品页评级：D
搜索
搜索结果页面的布局与分类页面相同。将两者都改为推荐的三列显示并收紧布局会有所帮助。
不过还存在其他问题。默认情况下，搜索功能设置为加载前100个产品。这是一个相当大的负载，尤其对于网速较慢的用户而言。你可以按名称和价格排序，但不能按“最新”或“最受欢迎”等其他常用方式排序。
一个理想的功能是能够过滤搜索结果。例如，我搜索了“悬挂”一词，期望找到能挂起来的秤。但有几个电子秤带有挂钩（允许用户悬挂物品）。如果有过滤器，我可以按设定的价格范围缩小搜索，或者选择仅查看手动秤而非电子秤。这值得深思，因为我的初始搜索返回了多达255个结果。
搜索等级：C
结账
当商品加入购物车时，顾客会被直接带到一个过于杂乱的页面。
示例结账页面。
页面对顾客没有任何引导。复选框——任何更改生效所必需的选项——没有标签。产品名称未链接到可让顾客返回产品页面的链接，“编辑此产品”链接令人困惑（它实际上是用于编辑产品选项的）。
这里还有许多其他明显的问题，比如邮政编码输入框非常小，优惠券输入字段也没有合理地放置在结账按钮和订单小计附近。
最大的问题在于许多醒目的红色大按钮，红色是一种令人警觉的颜色，红色与大号字体组合起来仿佛在喊：“嘿，看这里……我很重要。”然而，页面上被标记为重要的元素太多了。哪些其实没那么重要呢？产品“移除”按钮（应改为较小的文本样式链接）、“计算运费”按钮（可改为粗体文本样式链接）以及优惠券输入框（如果用户有优惠券，他们自然会去寻找，因此最好不要过度宣传折扣的可能性）。“继续购物”按钮应使用不同的颜色（例如棕色）。
在填写账单和地址字段时，“州”下拉菜单默认为阿拉巴马州，“国家”默认为美国。最好使用
接着，情况变得复杂起来。完成联系信息后，顾客会被带到一个提示输入礼品卡或优惠券代码的页面。在单独的屏幕上放置优惠券提示会吸引过多注意力，让顾客疑惑自己为什么没有优惠券。由于顾客可能会去Google搜索优惠券代码，从而导致销售流失。
该商店接受所有主要信用卡，但也允许通过支票或汇票下单。没有使用任何服务——可以选择“支票”并获得收据。不幸的是，这在支付选择页面上并不清晰。顾客可能预期在下一个屏幕中输入路由和账户信息，而不是收到邮寄付款的指示。
结账等级：C
概述
该网站的核心设计（顶部横幅）符合其用途。不幸的是，此后每况愈下。虽然红色在许多网站上被成功地用作主色调，但在这里却不合适。相反，红色仿佛被用来让每个按钮向顾客大声呼喊。有太多元素不需要发出令人警觉的指令。
该网站的加载速度也比大多数网站慢。标准DSL/宽带连接下，平均分类页面加载时间超过30秒。最大的罪魁祸首是未压缩的脚本文件。
其他问题领域包括：
- 在关键时刻，几乎没有给购物者提供明确的指引。购物车和结账页面的标题应被用来为顾客提供指导。
- 字体和字号存在不一致的问题。
- 大多数页面有大量浪费的空间。
- 有很多类别，但没有对促销活动和完整产品列表进行突出展示（这些可以放在页面上其他位置的独立按钮中）。
- 该网站的社交功能不够积极，未能充分发挥其潜力。
Old Will Knott Scales 销售许多产品，几乎每个人都需要至少其中的一项。然而，如果不投入时间和金钱来打造真正令人印象深刻的界面设计和“引导式”体验，网站所有者可能永远无法实现这个电商平台的潜力。