如今，在微信占领移动终端的绝大多数资源的情况下，互联网的竞争优势已不再明显。但是，作为企业的媒体门面，一个好的网站版式设计不仅会提升企业形象，更有助于扩大企业的知名度和业务资源范围。
在网站版式设计中首先要考虑同时也是十分重要的一点：版式布局。一个设计精致养眼的主页可以提升网站的整体效果，这个不需赘述。但是，想要让版式变得不再单调生硬，掌握好版式分割则显得尤为重要。
什么是版式分割？
版式分割是指的在有限的版面空间里用图形或图片把整个版面分割为2个或者多个部分（例如上下或左右）并分别在左或右配置人物或标题等，把构思与计划以视觉形式表达出来，这样会让你的设计更有创造性。
版式分割在设计中的作用
将呆板单独的一个版面分割为多个版面，在视觉上面具有一定的引导性。同时通过各个版面的面积大小也可以明确当前设计的主次关系，更具有对比性，并且使得画面感性而有活力。
以下四种类型的分割都是由一个形状通过面积和位置的变化使分割版面的。不同的版式设计，最终呈现的效果也是不一样的。
直线分割方式看似简单，但是运用得想要出彩却是非常困难的。它的分割形式都是由直线构成的，让设计看起来更加严肃、理性，但有时也显得比较呆板生硬，需要用色彩和其他一些小的设计元素来调和它的缺陷。
下面都是斜切的分割，斜切的角度和位置变化，都会给视觉不同的感受。
倾斜分割让版面更具有动感和速度，在运动/促销/游戏设计中常使用该分割方式，倾斜的方向不同也会给人有下滑或上升的感受。
用三角形的位置、面积、数量的变化，分割成不同版面。
三角形是一个具有稳定性的形状，同时也具有一定的视觉引导，通常会给人以尖锐、时尚的、暴力刺激等感受。
用圆形来分割版面，圆形使版面看起来视觉柔和，欢乐。
不同于尖锐的三角形，圆形的外形光滑饱满，会让人感觉到可爱、灵动和柔和，可以让画面更有亲和力。圆形风格一般在居家、母婴和旅行这类温馨的主题中较为常见。
分割在设计中的应用
通过对版面进行分割并且采用了倾斜性的分割形式，不规则和起伏感强烈的分割使版面立刻活跃起来，更加有节奏感，另外通过上下版面不同的两块面积的对比色配色，加大了画面对视觉的冲击。
上面的设计通过圆的外形来分割页面，文案和画面信息我们能知道这是关于户外旅行的网站页面。圆的外形更容易给人亲和力，使人更容易接纳。它的细节更在于圆本身的细节把圆形更生动和具有层次感，而不单单只是一个简单的形状。
不规则的形状分割版面比单纯的几何形状分割更有创造力，它营造的氛围动态十足，所以大家常常会看到优秀的设计中会出现一些比较有趣的页面中，比如说海报等，去除材质它们也是形状，只是更加具象的分割版面在画面中表现得更为突出。
如果没有版面分割，会是什么效果？
通过对图片版面分割的还原，我们不难发现没有版面分割的图片失去对比，节奏感，氛围这些方面的视觉感受。即使它在标题排版上很吸引人，但版面分割可以让它表达得更好。
具象的版面分割案例展示
案例中的盘子、黑板和iPad让版面产生了分割，只是不像几何那样更加纯粹的分割版面、但是我们也不能忽视它在设计中分割版面的作用。即使设计师当时没有这个考虑，我们也要记住每个元素在画面中都有存在的意义和作用，不知是单单表象上的物体。
网站的主页设计大致可分为动态和静态两种方向。静态网站的主页设计相对简单，只要放上一张醒目好看的图片，就会很吸引人。而动态网站的设计则是在鼠标下滑的过程中产生版面上的动态变化，可以增强视觉的冲击力。
如何利用版式分割来搭建版面布局？
下面将给出六种不同的布局形式供大家的设计参考。
“T”结构布局形式
所谓“T”结构，就是指页面顶部为横条网站标志+广告条，下方左面为主菜单，右面显示内容的布局，整体效果类似英文字母“T”，所以称之为“T”形布局。这是网页设计中用得最广泛的一种布局方式。这种布局的优点是页面结构清晰，主次分明，是初学者最容易上手的布局方法。缺点是规矩呆板，如果不注意细节色彩，很容易让人“看之无味”。
“口”型布局
这是一个象形的说法，就是页面一般上下各有一个广告条，左面是主菜单，右面放友情链接等，中间是主要内容。这种布局的优点是充分利用版面，信息量大。缺点是页面拥挤，不够灵活。
对称对比布局
顾名思义，采取左右或者上下对称的布局，一半深色一半浅色，一般用于设计型站点。优点是视觉冲击力强，缺点是很难将两部分有机地结合起来、
POP布局
POP引自广告术语，就是指页面布局像一张宣传海报，以一张精美图片作为页面的设计中心。常用于时尚类站点。优点显而易见：漂亮吸引人。缺点就是速度慢。作为版面布局，还是值得借鉴的。
国型布局
▲ “国型布局”网站底部展示
国型布局也称为同型布局，是一些大型网站喜欢使用的布局类型。最上面是网站的标题以及横幅广告条，接下来是网站的主要内容，左右分列一些小条内容，中问是主要部分，与左右一起罗列到底，最下方是网站的一些基本信息、联系方式、版权声明等。这种布局通常用于主页的设计，其主要优点是页面容纳内容很多，信息量大。
标题正文型布局
这种布局的最上方是标题或广告等内容，下面是正文。通常文章页面或注册页面采用此种布局，其特点是简洁明快，干扰信息少，较为正规。
版式分割对于版式设计来说只是其中的一个影响因素，色彩也是影响设计效果的一个重要因素。
网站设计中的色彩运用
▲ 佰草集官网主页展示
佰草集作为国内天然无添加的本草护肤高端品牌，网站主题色选用清新柔和的绿色，既考虑到产品的天然功效与之适应，突出其品牌特色。
▲ 雪肌精官网主页展示
再如日本高丝旗下的高档护肤系列产品雪肌精，其日本官网也是采用与产品包装相同的深蓝色作为主题色，非常有辨识度。
网站设计主题色的运用不仅仅根据设计师的喜好问题，更重要的是能结合产品特色选用贴切的色彩，整体形象设计的专业有利于打造良好的企业VI视觉效果。
欧美国际大牌的网站主页多以黑白色为主，黑白色的鲜明对比，奠定一种成熟内敛的基调，因为高端大牌的目标受众主要是经济支配能力高的人群，年龄多在25岁以上，因此只有黑白色能够衬托出品牌的形象。
PS :为什么黑白灰看起来会显得高大上？
这个问题在以前的一篇推送里详细地说过，戳传送门#黑白灰#即可达到。
主题色不仅在网站设计里占据至关重要的地位，而且在一些画册、宣传册的设计中也是非常关键的。如何让你的画册设计风格统一不显杂乱？运用好主题色可以很好地解决这个问题。
除了单一色和渐变色，多种色彩的搭配使用运用在画册海报等设计当中也可以很出彩，当然这需要考验设计师的色彩搭配功力。黑白色固然看起来显得高大上，但是因为随处可见，所以能够第一眼出彩的设计并不多见。相反地，如果能在网站设计中将色彩运用好，也是一个不错的尝试。
下面有一些设计感极佳的网站主页设计展示，可供大家参考学习。
Sanissimo
cinema-series.orange.fr/evenement/universeries
statek-psychologia.pl
cross-cross-coffee-cup.com
《PATTERN II 》和
《PATTERN essencial》
汇集了当下设计最流行热门的元素
供设计师二次提取和利用
联系客服
