网页细节设计:网页中价格标示的设计方法

两周前逛浦东Apple Store，因为看上MacBook Air纠结着要攒几个月的钱而注目价格良久：

先感谢MH同学的职业敏感性—-是否可以把印刷版式移植到Web平台。我们分析一下生活中见到的各种价格标识：

再对比一下网页应用中的价格标识：

一个共同特征就是：价格的货币符号很小，甚至视觉上可以忽略，而突出显示了具体金额。

再看货币符号的表现，举人民币为例，单修改一下字体就有如此大的差异：

这里需要再次强调：人民币符号的原始形式是双线，很多用户受淘宝影响，反复给携程发邮件，我仰天长叹：XDJM们哪，单线是因为键盘输入法的问题，造成了很多人的误会，其实那是小日本的货币符号（之所以叫小日本这与我小时候受过的教育有关），实际代码需要用¥转义才正确，就像Copyright的©一样，也需要用©来转义。另外淘宝的符号是合并在背景里的，携程涉及国际货币符号较多，为避免加载不到图片给用户造成负担而选择直接显示出来，业务不同在此不做对比分析。

相对于在部门内推广新表现形式，代码实现反而是最简单的：

有同学问为什么不用<sup>，原因是旧版代码<dfn>涉及各大频道，工作量巨大，另外<sup>需要Hack IE: *font-size: 14px; 反倒没有<dfn>方便。

效果对比如下：

目前旅游度假频道的大字体价格表现形式已修改，机票和酒店尚在开发中~~~

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!