【网页设计】网页设计中的“灰色”.docx

【网页设计】网页设计中的“灰色”.docx此文章已于22:09:52 2013/2/25发布到良知塾
【网页设计】网页设计中的
类别 全部;交互信息
灰,比白色深些，比黑色浅些,穿插于黑白两色之间，有些暗抑的美，幽幽的，淡淡的, 不比黑和白的纯粹，却也不似黑和白的单一。灰色给人的感觉：
正派 隐蔽
坚毅勺玉刍、
〃 1»4足包容
内敛
网页中常用的安全灰色
CCCCCC 999999 666666 333333
216网页安全色是指在不同硬件环境、不同操作系统、不同浏览器中都能够正常显示 的颜色集合（调色板）,也就是说这些颜色在任｛可终端浏览用户显示设备上的现实效 果都是相同的。所以使用216网页安全色进行网页配色可以避免原有的颜色失真问题
在我们平时的网页设计中，经常会用到灰色，总结了一下，灰色经常在如下场景中被使
•表示在当前页面中不可操作，未被激活的"隐藏”状态
这样处理的好处是用颜色告诉用户，这里不能操作,鼠标移上也没有没有点亮效果。可 以避免用户进行无效的操作，提高使用效率，并且从颜色上给予一定的暗示。
南极人合趣专卖店
100元优惠券
T2、T3天猫达人专享
已售罄
（1001O 分=1 元）
中3000天猫达人已兑换
①商品已售罄，明天早上1。点准时上新Q分享好友＞
c您好，
：（2函
我的特权：
成长状态：
V4 55961/15Q000 | V5
我的勋章： 查看全部〉
粉◎ @
图1 ：商品已售馨，不可点击。
图2 :徽章没有被激活。
•提示完整操作步骤流程
可以让用户对操作步骤一目了然，精简而清晰的步骤不会给用户带来心理压力，反而会 促进用户完成该任务。



图3 :绑定微盾的步骤指引
3•付款制支付宝
图4 :购物流程步骤指引
•弱提示，辅助信息
这一类应用比较广泛，如大段辅助文字，一些提示信息，次要信息，不常用功能操作等, ，，灰色，，处理会让页面和谐统一，并突出最主要的想要用户主要注目的区域。如输入框中的辅 助文字,文章大标题等。
milk (milkcan...)毋曾 阻我的支付宝▼
待付款(0)待确认收货(7)待评价(4)收货地址管理
臼苗坦
⑧
图5 :发布框中的提示信息
/质秋冬流行眼影粉妆双眼
冬季降至，不能让严寒阻挡我们美面的娜步,秋冬最流行眼 影,。精致迷人眼妆让 冬季的我们也不会暗淡矢色,濒道什么眼影这个冬季最流 行吗,落手来给你揭晓。
回复892
和秋燥say NO !
当看到很多秋季保湿护肤品开始上架的时候,MMOltB关注 起了秋季如何保湿这个话题！想要正面迎击秋季干滉的来袭 了 !干爆、过敏、发痒、红疹、掉皮......只是想一下就觉得不
回复1023
图6 :标题文字下的大段辅助文字
•次要可链接信息
在搜索页面每条搜索结果都有下划线，再出现其他的蓝色下划线会让本来就已经很紧凑 的页面显得更加局促，"灰色“处理可以调和这种矛盾，既能准确传达信息，又能使得页面整 体和谐统一。
在轻博客中灰色连接也被广泛运用。
@ 苹果-Apple
发布Apple公司最新资讯，介绍最新产品，遍布全国的