页面元素之「￥」符号的使用原则和技巧

转载自公众号：一鸣说 作者：一鸣 十二赞产品经理
在做页面设计的时候，难免需要展示「金额」、「价格」等跟钱有关的元素。有的时候需要在表示「钱」的数字前放上 ￥ 符号，有的时候不放，那么在使用的时候有什么讲究呢？

一般 ￥ 符号的使用原则是：如果表示「钱」的数字是页面元素的配角，则数字前加上 ￥ 符号提升该元素的展示重要级，如果表示「钱」的数字是页面的主角，则一般无需在数字前加 ￥ 。

这个环节中最重要的一步就是判断「表示钱的这个数字是否是页面的主角元素」，判定方法就是根据页面的定位，来判定元素的重要性。例如在商品详情页中，页面定位是展示商品的具体信息，表示钱的元素是「商品价格」，商品价格仅作为其中一个元素，并不是最重要的。因此需要在商品详情页的价格数字前加 ￥ 符号。在账户余额明细页中，页面的定位就是展示余额的变化情况，这个时候钱就是主角，此时无需加 ￥ 符号。

其实一条简单的宗旨就是：无法一眼看出某个数字是表示钱的，就价格 ￥ 符号让它看起来像钱；如果一整个页面都在讲这个钱的，就不要加 ￥ 符号多此一举了。

下面我们结合具体使用场景来谈谈 ￥ 元素的使用技巧。

（1）商品卡片和商品详情页。在表示价格的数字前加 ￥ 符号。例如： ￥29.9 ，这里需要注意的一点是，页面可能需要表示一个价格区间，例如从19.9元至29.9元，这时候的表示方法是： ￥19.9 ~ 29.9 ，而不是 ￥19.9 ~ ￥29.9 。很多人很容易在这一点上犯错，需要记住 ￥ 符号只是一个修饰符，要加在「表示钱的数字的整体」的左侧，而不是用来修饰单个数字的。

（2）订单详情页。在商品订单环节，一般会展示订单最终价格的计算过程，例如会出现商品总价，运费，优惠减免等元素。一般需要展现金额计算过程的环节，建议不加 ￥ 符号。但在订单管理页中，一般常规的做法还是在价格前面加 ￥ 符号，主要的原因还是考虑到各个元素的分布太零散了。

（3）支付页。在确认完订单信息后，会到支付环节，一般需要显示「待支付金额」，这个金额一般也是需要加 ￥ 修饰。这种情况实际上并不符合上面提到的原则，但实际上这么做的原因是这个页面的元素只有一个，加 ￥ 符号修饰一下数字。

（4）账户余额明细页。金额前不加 ￥ 符号，一整页都在讲钱，不用加 ￥ 多此一举。

实际上，很多人看了上面几个例子还是会觉得有点懵，那就去好好学习一下淘宝、支付宝吧，看看他们怎么用的，实在不知道怎么用就照搬他们的好啦。（笑~
【原文链接】