2019年H5+扁平化网站设计的最新趋势

2010，当windows phone开始扁平化的时候，换来的是世人的嘲笑。
2011，当安卓4.0开始扁平化的时候，人们把这当作安卓是为了和苹果抵抗，标新立异。
2013，ios 7开始扁平化，这股设计风格成为设计潮流。

至此到2018年为止，扁平化已经深入WEB领域成为主导设计方向。未来2019年将会是扁平化设计的爆发阶段成为网页设计领域的主流。

那么与扁平化与之对应的是拟物化设计先来了解一下2者的概念。

拟物设计就是追求模拟现实物品的造型和质感，通过叠加高光、纹理、材质、阴影等各种效果对实物进行再现（也可适当程度变形和夸张）；

扁平化设计就是摒弃以上对效果（尤其是高光、阴影等能造成透视感的效果）的追求，追求通过抽象、简化、符号化的设计元素来表现。

现如今的扁平化设计并不是单纯的一种风格，而是涵盖了诸多常见风格、具备多种不同目标或任务的一个设计集合体。目前扁平化设计被广泛应用于数字设计领域，并且常常通简约或者极简的视觉表达方式结合起来运用，由于移动端设计风格的演变历程的原因，扁平化设计常常被视作为拟物化设计的对立面。扁平化设计在过去的几年当中经历了积极而快速的发展，目前正“入侵”着越来越多的平面设计领域。

今天的扁平化设计已经成了网页和UI设计中的主流设计方向，甚至可以说是我们日常生活中不可或缺的部分，并且开始影响我们生活中的日常决策，并且具备解决各种问题的潜力。

我们看一下Chrome的Logo的扁平化设计：

另一个扁平化例子：

扁平化设计最基本、最突出的特征包括：

1. 简单的元素和形状

2. 极简风

3. 强功能性

4. 大胆而易读的排版

5. 清晰而严谨的视觉层次

6. 关注细节

7. 明亮的色彩和对比度明显的视觉感知

8. 避免使用纹理、渐变和复杂的样式

9. 采用栅格、几何特征以及视觉平衡的原则

扁平化设计的优势

扁平化设计的优势有很多，这也是它在数字设计领域流行的主要原因。现如今，扁平化设计也开始逐步影响现代排版印刷设计了。那么扁平化设计的优势在那里呢？

1. 可读性和易读性

2. 通过形状、色彩和字体来呈现清晰的视觉层次

3. 有效的支持web和移动端的导航设计

4. 自适应性，适合响应式设计

5. 在各种屏幕上都具备良好的可读性

6. 对于开发更加友好，降低在设备上的负载

HTML5结合扁平化的优势

微交互设计

好的产品往往做好了两点：功能和细节设计。功能吸引用户使用产品，而细节设计将决定用户是否留存。优秀的细节设计当然离不开优秀的微交互设计，它让用户感到强烈的互动和参与感的同时，通过微小而自然的变化带来非同凡响的愉悦感。

　　
响应式设计

响应式设计的概念，最初由著名的设计大师Ethan Marcotten在2010年5月提出，随后便快速席卷了前端和设计领域，现如今成为网页设计的大趋势。响应式网站设计提供了一种全新的选择，这种基于栅格布局和CSS3的流动性网页设计，可以让网页随着屏幕变化而响应。这是一种更为统一，更加全面的设计技巧，一种打破网页固有型态和限制的灵活设计方法。可以兼顾屏幕多场景的灵活设计，便是响应式设计令人着迷的所在，这点和编程开发中所追求的“一次编写，到处运行”有着异曲同工之妙。

极简的原型设计和交互设计

注重“版面简约”将是另一大设计趋势。极简主义设计旨在通过清晰的视觉交流来解决用户的问题，更加注重内容而非界面。而简约的设计削减了分散用户注意力的元素，让用户更佳专注于内容。一个结合良好可用性的极简主义用户界面，会带来更流畅、更深刻的用户交互体验;而一款具备简约界面及简单操作的原型设计工具，将势必成为众人心中最佳工具、引领新的风潮。