价格的表现形式与设计

不管价格怎么表现,最敏感的还是多少钱,对用户来说这个是最关键的,所以数字又大又醒目就是最好的表现方式了么?平时在上网的时候有没有特别注意过价格的不同表现形式?
我选了6个不同类型网站,看看他们在价格表现上有什么不同,分别是“淘宝”,“聚划算”,“携程”,“大众点评”,“ebay”,“Amazon”,这几个网站都是和钱打交道的网站,业务又较多较广,我做了一个统计:
淘宝,聚划算

携程,大众点评

ebay,amazon

使用不同价格表现形式数量对比
- 淘宝携程:4种
- 聚划算大众点评:3种
- ebay,amazon:1种
国内站点3种以上,国外1种,国内因为各种业务在价格的体验也有所不同,有时候加上“元”,有时候不加“元”。
使用最多的类型

“¥150″这种形式是使用情况是最多的,这类型在表现数字上面可以做到通用性,对中英文国内外都可以清晰表现价格,而且Excel里面的货币和会计专用的格式就是¥15.25,其他的形式应该是根据不同的页面配上的形式。
表现形式与设计
其实对于非外贸型或者与国外沾边的类型的网站,在价格表现形式上要能正确显示价格,做到统计即可,形式上并没有特别的约定,但以设计的角度来讲,不同的价格形式给页面带来的感觉是很不一样的。
A.淘宝列表页

- 表现1,是淘宝原版,价格和整个模块搭配的很不错,“¥”的灰色和粗体让价格醒目又不突兀。
- 表现2,没有“¥”也没有“元”,搭配上小数点,很难第一时刻想起这是价格,看起来有些怪怪的。
- 表现3,加了“元”,和下面的运费就显得有些不搭配了,右侧不整齐。
- 表现4,同时加了“¥”“元”,整体效果可以,但是和第一种相比还是显得多余了
B.淘宝单品页

- 表现1,原版。
- 表现2,“限时折扣” + “¥” + “价格” + “元” + “剩余时间”,样式错综复杂。
- 表现3,价格这块看起来像是没有结尾似的
- 表现4,加了“¥”没有“元”,整体效果可以,但是和第一种相比还是显得多余了,如果没有“限制折扣”的图标,上下行之间就非常不整齐。
各种不同价格形式使用参考
其实发现国内的价格表现还是跟着设计走,考虑到前后文字的搭配与整体风格而订下样式,我总结了一些,大家可以参考:
“¥” + “价格”:价格的后面没有文字,又想要突出价格,参考“淘宝列表页”
“¥” + “价格”+“元”:如果你的页面的价格hold不住,用这个吧
“价格”+“元”:价格的前后都有文字包围,适合标题,段落,可参考“团购标题”
“价格”:多用在删除线中,比如原价:150

如需转载请注明文章来源,本文链接: http://icojump.in/?p=1906
好文章,转载到互联网的一些事(yixieshi.com)
[…] 来源:http://icojump.in/?p=1906 […]
[…] 来源:http://icojump.in/?p=1906 […]
价格的表现形式与设计
[…] 本文由ICO原创发表,本文链接: http://icojump.in/?p=1906 […]
“¥” 和“元” 表达的是同一意思,有其中一个,另一个就没太有存在的必要,会造成语义的重复。不知大家怎么看,若有不对,还请说出你专业的认知
[…] 源地址:http://icojump.in/?p=1906 作者:xiaoming | 分类目录:产品设计 | 标签: […]
从专业角度是多余的,但这篇是从设计角度讲开,所以为了页面的美观适当做些调整也可以的,同时也没有标准说是硬性规定不能使用。
不错啊!!!
[…] ico交互设计 本文由1haideas团队发表,转载请注明出处,本文链接: […]
我一直觉得“¥”是美元的意思
美元是 $ 这个
我觉得这个问题小题大做了。。
论述起来有些啰嗦了。。
[…] 转载:ico […]
[…] 2012-07-30 分类:未分类 1 浏览数 怎样展示价格数据爸爸告诉你,这是亿邦动力闲的蛋疼的转载自199it.com的文章,却又不给出原文链接,追到199it上面才看到是icojump 原创。尊重原作者还是给个链接吧!其实我是在网站分析社区上面看到的转载了。不管怎么样,大家都辛苦了。 […]
[…] 來源:http://icojump.in/?p=1906 […]
[…] 文章来源:icojump.in 发表于 网站产品 « 淘宝技术发展(Java时代:脱胎换骨) 什么样的用户适合豆瓣 » 敬请 留言, 或从本站 引用本文。 […]
分析的不错,25设计学堂学习了
[…] icojump原文:http://icojump.in/?p=1906 推荐关注产品设计微博:@ICOjump […]