價格的表現(xiàn)形式與設(shè)計

不管價格怎么表現(xiàn)，最敏感的還是多少錢，對用戶來說這個是最關(guān)鍵的，所以數(shù)字又大又醒目就是最好的表現(xiàn)方式了么？平時在上網(wǎng)的時候有沒有特別注意過價格的不同表現(xiàn)形式？

我選了6個不同類型網(wǎng)站，看看他們在價格表現(xiàn)上有什么不同，分別是“淘寶”，“聚劃算”，“攜程”，“大眾點評”，“ebay”，“Amazon”，這幾個網(wǎng)站都是和錢打交道的網(wǎng)站，業(yè)務(wù)又較多較廣，我做了一個統(tǒng)計：

淘寶,聚劃算

攜程,大眾點評

ebay,amazon

使用不同價格表現(xiàn)形式數(shù)量對比

• 淘寶攜程：4種
• 聚劃算大眾點評：3種
• ebay,amazon：1種

國內(nèi)站點3種以上，國外1種，國內(nèi)因為各種業(yè)務(wù)在價格的體驗也有所不同，有時候加上“元”，有時候不加“元”。

使用最多的類型

“￥150″這種形式是使用情況是最多的，這類型在表現(xiàn)數(shù)字上面可以做到通用性，對中英文國內(nèi)外都可以清晰表現(xiàn)價格，而且Excel里面的貨幣和會計專用的格式就是￥15.25，其他的形式應(yīng)該是根據(jù)不同的頁面配上的形式。

表現(xiàn)形式與設(shè)計

其實對于非外貿(mào)型或者與國外沾邊的類型的網(wǎng)站，在價格表現(xiàn)形式上要能正確顯示價格，做到統(tǒng)計即可，形式上并沒有特別的約定，但以設(shè)計的角度來講，不同的價格形式給頁面帶來的感覺是很不一樣的。

A.淘寶列表頁

• 表現(xiàn)1，是淘寶原版，價格和整個模塊搭配的很不錯，“￥”的灰色和粗體讓價格醒目又不突兀。
• 表現(xiàn)2，沒有“￥”也沒有“元”，搭配上小數(shù)點，很難第一時刻想起這是價格，看起來有些怪怪的。
• 表現(xiàn)3，加了“元”，和下面的運費就顯得有些不搭配了，右側(cè)不整齊。
• 表現(xiàn)4，同時加了“￥”“元”，整體效果可以，但是和第一種相比還是顯得多余了

B.淘寶單品頁

• 表現(xiàn)1，原版。
• 表現(xiàn)2，“限時折扣” + “￥” + “價格” + “元” + “剩余時間”，樣式錯綜復(fù)雜。
• 表現(xiàn)3，價格這塊看起來像是沒有結(jié)尾似的
• 表現(xiàn)4，加了“￥”沒有“元”，整體效果可以，但是和第一種相比還是顯得多余了，如果沒有“限制折扣”的圖標(biāo)，上下行之間就非常不整齊。

各種不同價格形式使用參考

其實發(fā)現(xiàn)國內(nèi)的價格表現(xiàn)還是跟著設(shè)計走，考慮到前后文字的搭配與整體風(fēng)格而訂下樣式，我總結(jié)了一些，大家可以參考：

“￥” + “價格”：價格的后面沒有文字，又想要突出價格，參考“淘寶列表頁”
“￥” + “價格”+“元”：如果你的頁面的價格hold不住，用這個吧
“價格”+“元”：價格的前后都有文字包圍，適合標(biāo)題，段落，可參考“團(tuán)購標(biāo)題”
“價格”：多用在刪除線中，比如原價：150

icojump原文：http://icojump.in/?p=1906
推薦關(guān)注產(chǎn)品設(shè)計微博:@ICOjump