搜索框的视觉设计
作者/整理：admin 来源：互联网 2018-09-13
一、外框展示样式
这里一共整理搜集了5种，分别为：
填充色
线框
投影
透明度
无外框
1. 填充色
最常用的外框使用方案，通常选用与页面背景颜色反差较大的颜色作为搜索框的填充色，方便用户查找与识别。（例如：彩色页面背景下使用白色为填充色，白色页面背景使用浅灰色作为搜索框填充色。）
2. 线框
多用于干净简洁的背景页面，例如：搜索引擎或浏览器页面等页面。另一种情况则是与产品整体设计风格相关，例如：网易考拉的搜索框选择使用线条目的是与页面的图标风格保持一致。
3. 投影
常用于风格简洁轻量的风格页面，同时搜索功能级别较高的场景。使用投影的主要目的是把搜索框与其他信息在高度上做了区分，更易被用户发觉，促使高频使用。上海网站建设。
4. 透明度
常用于背景色复杂的场景，目的是为不破坏背景页面的整体效果，在视觉上更和谐。
5. 无外框
用于风格简洁的大留白的页面。下图腾讯视频的搜索功能去除了外框，这样设计会比有外框的搜索框在搜索面积上显得更大，彩色的放大镜图标把没有外框的搜索框的优先级提升到仅次于「精选」的级别。
建站咨询
021-61842014
