申请网站
忘记密码
密 码：
登录名：
建站咨询热线：
0532-88781131
、
15166683288
返回贴子列表
发表新贴
主题：
10个改善UI设计的技术
共有
1548
人浏览过本贴
主贴管理
置 顶
加 精
结 贴
转 贴
昵称：奈薇建站网
论坛积分：108060
发贴等级：
21
发贴数：1159
回贴数：1282
被砸鸡蛋：
1
获赠鲜花：
182
发表时间：2019/12/6 10:35:00
楼 主
10个改善UI设计的技术
在设计成品中，UI设计越来越显得重要。而现实中有很多可以让一个
网页设计
既漂亮又功能化的技术，这里，原作者介绍了10种他经常用在自己设计的产品中的技术。如果你想拥有更好的UI，让我们一起继续。
1.填充链接块链接（或锚点）都是默认的内联元素，这就意味着，只有在它本身的跨度上才有可点击性。如下图所示（蓝色部分为可点击区域，一图是TechCrunch的，二图是SmashMagazine的）：
显示，SmashingMagazine的链接可点击性要比TechCrunch强。这可以增大点击的正确率和点击率。而如果你想这么做，只要用以下的代码即可:
a{display:block;padding:6px;}
当然，要提醒一下的是，请确保运用Padding是恰当的，IE有可能让Padding没能正常实现其真正的样式。有效避免Padding出现问题的方法是尽量让它们与没有padding或Margin的容器接触，而常用的方法是，给padding的元素加上一个border。
2.按钮文章的排版别小看这个问题，这可能是区分一个产品好与坏的一个细节。好的设计者会做到视觉平衡。让我们来看看下面的例子：
第一眼看起来还好，但看越觉得不对。你会觉得按钮上的文字好像偏上了。因为大写字母我小写字母混大一起时，有一些是需要向上顶，或向下的（中文方块字就不会了，很好！）我想表达的是：
那么，我们需要怎么做呢？如果我们不想全部都是大字字母的话，可以按照下面的方法。让他们都在同一个水平的空间内，而且是向下沉的，这样做，可以现好地平衡视觉效果，让人看起来文字正好在中间：
3.使用对比来突出焦点我想，我自己常用这个方法。因为这即安全又环保（囧），让我们来看看下面这个吧：
看完上面的，让我们来对比一下下面的文字，有什么区别呢?很明显，我们把焦点放在大标题上。
不过，需要注意的是，你要突出的是标题，而不是一些比较将要的东西，所以，把焦点用对，向下面这个，并不适合：
4.使用颜色来突出焦点颜色通常可以引起用户的注意，而你可以用突出的颜色来展示你想要展示的结果，就像下面一样：
不过，就像上面我们在说标题的焦点一样。你最好把颜色选对。做比较好的搭配，并确保要突出的内容出现在上方，而不是有被压着的感觉，就像下面这两个实例：
Function把HEADER区域中的"We’reHiring"的链接突出来，像你现在所看到的，会没有顾忌地把注意力投过去。从而使这个链接不会被遗忘，另外，让我们来看看下一个：
Causecast刚把重要的东西都放在粉红色的背景下，比如Feedback，LOGO，DONATE等。
不过，切记，不要随便让一个页面充满颜色，这样会失去焦点；不要运用太另类的搭配，这可能引起反感。适当利用，懂得我们的目的是要突出所需展示的内容，而不是在颜色本身。
5.用空行来表示关系这个说起来好像有点让人摸不着究竟能体现出什么关系来。其实，你只要看看平时我们看书的时候，通常每一个章节或者某个段落都可能用空白来隔开，表示他们属于各种的内容，就是这个意思，下面让我们来看一个例。这个排得很漂亮吧：
对，确实很漂亮。不过，在标题与段落之间，他们的间隔都一样，容易让人产生不知道这个标题是属于那一段的感觉。而我们能做得更好，比如像下面一样显示，让人一目了然。
奈薇建站网致力于，让每个中国人、每个中国企业都拥有自己的“官方网站”！
回复此贴
单贴管理
修 改
删 除
清理签名
TOP
共
0
个回贴 分
0
页
上一页 / 下一页 当前第
页
奈薇建站网青岛网站建设公司/青岛网站制作公司，专业提供"气质"型网站建设及精美网站制作服务，同时欢迎各地网站建设公司、网站制作公司代理我们的奈薇建站系统共同发展
热点地区：
青岛网站建设价格
青岛即墨网站制作公司
开发区信息港
山东在线门户
1
182
