网站建设资讯

企业网站排版设计中采用九宫格布局的经典案例

行业动态 2021/5/9 13:02:18 | 阅读:48

在大多数企业网站的排版设计中,类似九宫格的布局最为常见,这种布局可以作为同一个栏目下的多个作品、项目、新闻、业务、解决方案等等的入口。由于九宫格或类似变形的布局在网页屏幕分割中容易分布且产生科学的对齐关系,所以为设计师们广泛采用。


01.


第一个案例就是一个典型的九宫格布局。但设计师把第一个格子和第四个格子融合在一起,突破常规的版式,容易吸睛。



02.


这个网页设计作品的九宫格分布中,利用虚实关系来布局。利用图片和文字错开来排版,产生留白。



03.


04. 这个网页作品也是对九宫格的布局进行横向变形排版。



05.


带有网页纹理的布局是和艺术氛围的。



06.


九宫格的布局采用纯色块布局时,块感很强烈,需要运用好色彩搭配技巧。



07.



08.



09.



10.


九宫格采用圆形来布局排版,视觉上会得到意想不到的效果。



11.



12.



13.

最后这个作品是变化最大的,除了部分格子强化变大外,还抽取掉部分格子,让版式透气一些,留白多一些,聚焦一些。



九宫格,一款数字游戏,起源于河图洛书,与洛书是中国古代流传下来的两幅神秘图案,历来被认为是河洛文化的滥觞,中华文明的源头,被誉为"宇宙魔方"。没想到运用到企业网站设计中会产生强烈的对齐关系,让模块的内容和功能更为清晰化,是设计师们推崇的页面布局方式之一。同时也希望今天分享的这十三个经典的运用了九宫格概念来排版的网站设计作品能给大家带来灵感和启发。