每年的12月都是年终盘点总结、来年愿景展望的好时候，网页设计领域也不例外。这不，小飞近期更新的文章都是与此息息相关的，从《盘点2017年最受欢迎的10个商城范例：我们从中可以得到哪些启示？》，到《2018年如何做网页设计？这里有一份新鲜出炉的UX趋势指南！》，再到《距2018年已不足1月，网站SEO优化又有哪些新趋势和新方向》等，尽量从多个角度进行剖析，帮助大家在网站建设和推广的过程中少走弯路。不过，一些看了文章的站长反馈说虽然对接下来一年的建站趋势有所了解，但一到实践时却又不知道如何下手了。不用担心，小飞今天就来详细聊聊2018年可能会流行的网页设计技巧（附设计实例），这些技巧都是行业大咖从近期新出及一些改版设计作品中总结而出的（其中不少设计方法同样适用于印刷设计）。快来先睹为快吧！      

1. 非对称式网格

完美对称式网页布局的时代已经过去了。尽管分屏式设计在2017年的网站领域还占据一定的席位，但这种设计趋势正逐渐发生改变：设计师不再单纯的将整个屏幕一分为二或几等分，而是选用其他非常规的布局。换句话说，现在设计师更喜欢在网站中使用非对称式网格。这是因为，与对称式布局相比，非对称布局往往可以呈现更加强烈的视觉张力，更能吸引用户的注意力。除此以外，非对称式布局同样可以诠释出网站的平衡美感。要想做到这一点，我们需要合理安排网页的各种视觉元素，比如留白、文本区块、图片等，这也是非对称布局的一个设计难点所在。不过，设计师提出了一种非常有效的解决方案，那就是将所有元素放在网格中进行设计，这有助于保证网站各个元素的和谐有序，帮助形成一定的视觉轨迹，引导用户完成顺畅浏览。下图Club of the Waves上的各种元素（标题、短文案、CTA按钮、图片等）就是以这种方式集合在一起的，这也是这个非对称式布局仍显得平衡和谐的原因。        

2. 更多明亮色彩

明亮配色这种设计手法在2017年就已经大放异彩了。它最初是从扁平化设计中衍生而来，后借鉴了Material Design的一些特质，最终广泛用于众多网页设计项目之中。在2018年，这种设计手法仍将持续流行下去。这种预测是有充分理论和实践依据的，首先，明亮、显眼的颜色最能吸引用户的注意力，可以给用户留下比较强烈的第一印象；其次，饱和度高的颜色更能传递出正面情绪，吸引广大年轻访客；最后，鲜艳的配色还可以创造出意想不到的独特美感，让网站更显生机，让企业品牌形象更显活泼。Ford就是一个典型的栗子，它给用户的感觉比较中规中矩，但其旗下的Make it Drivable网站的明亮配色设计则凸显了Ford与时俱进、紧跟时尚的品质，有助于改善用户对品牌的传统印象。  
     

3. 底部悬浮固定元素

曾经有一阵子，APP和移动网站的底部十分流行悬浮固定广告的设计。而现在这种趋势好像重新兴起了，并逐渐出现在电脑端网站上。底部悬浮固定的元素也不再局限于广告，这还有对话框、弹出框、通知、甚至是导航菜单。底部悬浮固定元素这种设计方法之所以能够重新兴起是因为网站底部位置是用户的主要浏览区域之一，在这放置一些元素既不会占用太多空间，还能起到突出的作用。由于它不会影响网页的正常浏览，用户普遍接受度也比较高。Burlap and Blue 就在网站中使用了这种设计手法，底部促销活动比页面中的横幅图片等要占用更少的空间，但却能产生更为有效的成果。  
     

4. 柔和图形

2017年的网页设计中，锐利多边形和几何图形的出现频率很高。不过只要仔细观察，我们可以发现柔和图形倒是在网站中越来越受欢迎了。其实，更加柔和、平整的线条元素是棱角分明的多边形的一种自然演进。早期扁平化设计是网站领域的主要掌控者，网站中的图形自然也以锐利、二维的多边形为主，但随着动画效果的不断出现，这种可以和动效完美搭配的柔和图形自然成了设计师们的心头好。与锐利的多边形相比，柔和图形往往没有那么”强硬”，能给网站增加不少亲和力。另外，平整柔和的曲线也更易给人留下行云流水般流畅的感觉。Bubblewits网站中就使用了波纹曲线。  
     

5. 微妙动效

如今动效几乎已经成为网页和UI设计的必备元素，这是因为它们在有效吸引用户注意力、增强用户互动方面具备无可比拟的优势。而相比显眼的动效，小而微妙的动效开始受到更多用户的欢迎，因为它常可以带来出其不意的惊喜，给人的愉悦感要更强。这里要注意，微妙动画绝不是为了隐藏或拖延网站加载过程而存在的。从悬浮效果、电影动图、再到插画，这些都是微妙动效的表现形式。Studio Debie网站在主页的很多位置上（Logo图标、菜单项、线条、文本、滚动按钮）使用了微妙动效，整个网站的体验很是有趣。        

6. SVG图片

SVG（Scalable Vector Graphics）图片在网站中愈发常见了。毫无疑问，可缩放矢量图片已经成为网站的主要图片类型之一，这很大程度上归功于它的特性：无论屏幕大小或分辨率高低，这种类型的图片、图标或Logo都能得到良好呈现。除此以外，SVGs还可以与静态或多媒体图片很好的结合在一起，包括3D图片、电影动图、Logo动画以及360度全景图。        

7. 更多滚动特效

2017年，视差滚动特效实在是很流行，这甚至导致不少设计师开始有意识地避免在网站中使用这种效果。不过，就目前而言，它在鼓舞用户进行互动方面能发挥很大的作用，也就是说，滚动特效仍会广泛用于2018年的网页设计项目之中。在新的一年里，我们还可以尝试结合几种不同的滚动特效以创造与众不同的效果，当然，特效种类不能太多。Doggo for Hire这个网站就使用了滚动动效，用户每滚动过一次，这就会有些彩色纸屑掉在狗狗的身上。快速滚动我们可以体验视频式的浏览效果，慢慢滚动则可以详细查看屏幕左侧的内容文本。      

 8. 极简主义之外的留白设计

设计师喜欢极简主义和留白设计，但有些用户却不喜欢。这促成了极简主义之外留白设计的诞生。简单来说，就是在网站设计中使用充分的留白，但又让它不落俗套，不是千篇一律的极简主义。色彩或其他设计元素的叠加就可以做到这一点。Design Calendar 网站在这方面就就比较突出，它采用了彩色的背景，虽然页面中内容元素不少，但是充分的留白营造出了足够的呼吸感。  
      相关阅读： 《如何让网站散发柔性美？波纹曲线在网站中的应用》 《如何提高网站的设计感？巧妙的几何图案是个捷径》 《2018年度代表色公布：超难驾驭的【紫外光色】是何方神圣？》 《留不住用户，这5个概念帮你指明2018网站营销的前进方向》