如何成为网页设计达人呢


如何成为网页设计达人呢


对于网页设计 , 有时候不仅仅是UI设计师的任务 , 有时候还可能是Web开发人员的任务 , 在进行网页设计时 , 很容易就陷入了设计的瓶颈 , 尤其是当自己的设计被一次又一次的打回 , 而自己痛苦地在电脑桌前表示 , “我永远都不能让这看起来很好!”但事实证明 , 你可以用很多技巧来提升你的工作水平 。在设计中 , 避免使用400以下的字体粗细; 它们可以用于大标题 , 但是在较小的尺寸下会变得难以阅读 。如果你正在考虑使用较细的字体来减弱某些文本 , 请使用较浅的颜色或较小的字体大小 。
【如何成为网页设计达人呢】不要在彩色背景上使用灰色文字

在白色背景上 , 使文本变成浅灰色是强调它的好方法 , 但这个颜色的字体在彩色背景上看起来并不那么友好 。那是因为我们实际上在白色背景上看到灰色字体的会产生降低对比度的效果 。而使文本更接近背景颜色实际上有助于创建层次结构 , 而不是使其变为浅灰色 。

使用彩色背景时 , 有两种方法可以降低对比度:

1.减少白色文本的不透明度

使用白色文本并降低不透明度 。这样可以让背景颜色稍微渗透 , 以不与背景冲突的方式去强调文本 。

2.手工挑选基于背景颜色的颜色

当背景是图像或图案时 , 或者当降低不透明度使文本感觉太钝或褪色时 , 这比减少不透明度更好 。选择与背景颜色相同的颜色 , 调整饱和度和亮度 , 直到它看起来正确 。

改善阴影的样式

不使用较大的模糊和展开值来使框阴影更明显 , 而是添加垂直偏移 。它看起来更自然 , 因为它模拟了一个从上面照射下来的光源 , 就像我们以前在现实世界中看到的一样 。

这适用于您可能在井或表格输入上使用的插入阴影:

使用较少的边框

当你需要分离两个元素时 , 尝试避免突然看到边框 。虽然边框是区分两个元素的好方法 , 但它们不是唯一的方法 , 使用太多边框可能会让你的设计感到繁杂和混乱 。

当你下次需要解决方法时时 , 请尝试以下其中一个想法:

1.使用box shadow

box shadow可以很好地实现像边框元素那样的功能 , 但也可以更精细 , 并且实现相同的目的而不会分散注意力 。

2.使用两种不同的背景颜色

通常只需要为相邻元素提供略微不同的背景颜色即可区分它们 。如果您已经使用了除边框之外的其他背景颜色 , 请尝试删除边框; 你可能不需要它 。

3.增加额外的间距

有什么更好的方法来分离元素 , 而不只是简单地隔开?将事物间隔得更远是不引入任何新UI的情况下创建元素组之间区别的好方法 。

不要放大那些小图标

如果你正在设计一些可以使用一些大图标的东西(比如登陆页面的“功能”部分) , 你可能会本能地使用免费图标集 , 然后放大尺寸直到满足你的需求 。但是它们是矢量图像 , 如果增加尺寸 , 难道质量不会受到影响吗?
这使您可以使实际图标更接近其预期大小 , 同时仍然可以填充更大的空间 。如果您有预算 , 您还可以使用设计用于较大尺寸的高级图标集 , 当然是要钱的那种 。

推荐阅读