企业建站实战总结出2018网页设计流行的三种趋势

设计趋势通常都是静悄悄的进行着，不会那么明显，张扬的在媒体报道中刊登出来。更多时候，需要设计师对目前上线作品进行分析、归纳及总结。素马设计总结出的设计趋势，都是通过最近几个月的视觉稿的过稿率以及结合各酷站最新发布的网站风格一起得出的。通过给企业建设网站实战，我们认为接下来的几个月还会继续流行“深色背景配浅色文本、圆形元素、分屏式布局”三种趋势。

01

-

深色背景或视频、动态图等，搭配浅色文本

这种组合是非常简洁、大气且经久不衰的组合，堪称经典。视觉效果看起来很微妙，有一种无形的张力。

https://www.t-e.cz/en

https://bullyingandbehavior.com/

https://www.blues-d.co.jp/#/products/

http://yutotakahashi.com/

https://www.sumaarts.com/design/253.html

白色的文本让整个设计的信息对比度有了保证，甚至让内容显得鲜明而突出。通常保持静态的文本和背景中深色的动效和视频构成了动静对比，使得这些网页在体验上显得非常有感觉。

背景显得越黑暗，整体所营造出的神秘感就越明显。较深的背景也增加了整体的可读性，背景中的动态元素则很好的营造了氛围和情绪。

这样的设计看起来并不复杂，但是其中所蕴含的信息量一点都不比其他的设计方案来的少。

02

-

圆形元素的巧妙运用

从形状心理学的角度来看，圆形和环形有着完整、和谐的心理学特征，在很多不同的场合，它常常会拿来传达爱情、能量的意象。

在 Material Design 的规范中，圆形按钮被大规模运用，并且由此开始，圆形在UI设计中开始承担越来越多的责任。

不过，由于绝大多数的屏幕和画布大都是矩形的，圆形元素通常不会贴边使用，也避免了在布局进行响应式变化的过程中，圆形元素的扭曲和形变。下面的案例当中，圆形元素都被很好的运用起来，布局保持着良好的流动性。

https://www.kymberleejay.com/

这个网页使用圆形元素来承载首页的主要文案，背景图片中的女性人物的目光则起到了不错的视觉引导作用。

https://buddhapizza.com/en

这个页面则让文字构成圆环，围绕这批萨，创造出独特的视觉奇观。

https://www.hotelpoispois.com/

这个页面则使用浮动的圆形来提升视觉，它们也可以被视作为巨大的按钮，将用户导向不同的页面。

03

-

分屏式排版设计

分屏式设计很有意思，它流行一阵子之后销声匿迹，然后又回归，来来去去好几回。最近这一设计趋势又回归了，这一次回归的分屏式设计看起来更加大胆，细节的搭配上则更加微妙。

分屏式设计的好处在于，它可以更好地呈现响应式的设计，在桌面上左右分屏，在移动端上上下叠加。无论怎么呈现，用户都不会因为这种设计而错过任何的信息。

分屏式设计之下，一个屏幕同时展示两块不同的内容，也让不同的内容和元素有了对等的展示空间。

分屏式设计让用户能够自主控制交互，让他们面对不同的内容的时候能够选择自己喜欢的内容和方式来操作。

https://www.troa.fr/

https://tacobill.com.au/

这是一个很好的例子，当你打开网站的时候，设计师就为用户提出了两个问题：你是想打包带走事物，还是预订之后在餐厅里吃？通过分屏的方式，用户有了两个不同的选择。分屏式的设计让用户的选择更加直观、可视化。

http://nikospandazaras.com/

Nikos Pandazaras 的作品集网站则选择了截然不同的设计思路。他将导航置于屏幕的中间，而摄影作品则左右各一并排放置，两者的重要性无疑是对等的，用户可以同时看到两幅不同的作品，屏幕的利用率倒是挺高的。

http://www.daucy.fr/nuances/

D’Aucy 在进行分屏设计的时候，选择了更加微妙的策略。左侧仅有图片，搭配着有纹理的背景；右侧的背景选择了近似的色彩却没有加上纹理，仅有文本标题。两者在保持近似一致的视觉设计的同时，又巧妙地呈现出差异性。

以上通过实战总结出的三种趋势，在前端制作工艺上，也不存在太大的难度。版式上拥有良好的适用性及兼容性。我们可以在往后的新项目中，适当的融入这些设计概念和思路。