网页设计中的层次、色调、创意

大家在浏览网页时经常可以看优秀的海报设计，这些设计往往可以通过其优秀的颜色处理、场景打造、氛围渲染、排版布局、文字处理以及巧妙的创意等方面来抓住浏览者的眼球。那么今天我们就跟大家分享一下一些优秀的海报设计在网页中的应用。

大家在浏览网页时经常可以看优秀的海报设计，这些设计往往可以通过其优秀的颜色处理、场景打造、氛围渲染、排版布局、文字处理以及巧妙的创意等方面来抓住浏览者的眼球。那么我们是不是可以吸收这些优秀的海报视觉，来帮助我们设计其他领域的东西呢？设计是相通的，答案自然也是肯定的。那么今天我们就跟大家分享一下一些优秀的海报设计在网页中的应用。

我们主要通过层次、色调和创意三个方面来跟大家进行讲解。

01. 层次

画面的层次感，说白了其实就是画面的内容有主次之分，有空间感和距离感，有虚实之分，光影层次清晰，这样的画面才起来才真实、丰富，而且通过一些特殊的处理手法，可以进一步拉开画面中不同元素的层次，使得主体更加突出。（因本部分的讲解不涉及到色彩方面的知识，为了更便于大家观察，所以对海报进行了去色处理）

远近关系

FEVTE编注：更多平面设计理论学习请访问飞特网平面设计理论知识栏目，地址：https://www.fevte.com/plan/shejililun/

上两图中按箭头所示方向由近及远，画面纵深感强，远近景层次明显，画面感很强。运用到网页设计当中如下：

通过上面的例子可以看出，远近层次清晰的画面，搭配上网页中的内容，可以使页面看起来更加透气，在浏览内容的同时，也能够通过场景传递出很强的代入感。

虚实关系

上左图中按箭头所示方向依次由实到虚变化，满足正常情况下近实远虚的道理，层次感很强；在上右图中，实景和远处的虚景想必大家都可以理解，但为什么离我们最近的下方的人也是虚的呢？我们看下下面这张图可能更容易理解。

这张海报其实更接近于咱们生活中的实景拍摄，而且是那种有明显对焦主体，毫无疑问是图中拿着竹竿的美女。那这时，虽然前景的花草离我们更近，但是因为它们偏离我们的对焦点（我们的视线并没有直接去看这些花草），所以，这时候前景的花草我们也是去做模糊处理的，甚至有的时候模糊度比远处的场景还要明显。这个是需要了解的。那我们再看下海报中的虚实关系在网页中的应用。