2021 年，网站设计还有什么看头 | 企划会议
我们发现了几个有趣的趋势。
过去一年的疫情影响了无数人的生活，在“后疫情年代”的世界，网站设计师的角色也会发生相应的变化。一个网站如何设计才能脱颖而出？人们会对什么样的内容感兴趣？网站设计又需要传递给读者怎样的信息？根据美国斯坦福大学的报告显示，75％ 的用户仅凭视觉设计就会对公司网站的信誉度做出判断。
我们浏览了 2020 年至今颇受欢迎的网页设计案例，并在此基础上梳理了 5 个大方向，试图从交互性、适应性、传播策略和科技输出等几个方面呈现最新的网页设计趋势。
在过去一年出圈的网站设计
#01
/ 要玩得顺手 /
过去这独特的一年，让不少人终于有了成为“阿宅”的机会:上网课、在家办公、视频开会......有没有意识到，电脑屏幕在迅速霸占你的双眼? 这也让不少设计师和品牌方都迅速反应，以在网站增设一些交互设计来吸引读者驻留。
Nike React
https://www.nike-react.com/
这其实是 Nike 的一条产品定制线——Nike React，它是一款主打轻便的跑鞋。打开网页，就会出现各种个性化定制的选项，比如踩下去的质感（棉花感 or 弹跳感）、跑步时的应用场景（菜鸟 or 专业），包括颜色配色，都可以自主选择。
为何有效
# 以有趣的方式输出产品信息
# 交互性体验增加用户驻留时长
在 Nike 这条产品线的网页设计里，一般以文字形式呈现出来的产品信息，它都换成交互性游戏的方式，让屏幕那端的人瞬间抓住跑鞋的材质和特性：轻盈、舒适、便捷。而根据亚马逊关键词搜索分析排名工具 SEMRush 显示，如今每月有近 6000 万用户登录 Nike 的网站，平均每次都花费大约 7 分钟的时间。
无独有偶，在去年一整年，意大利品牌 Gucci 也上线了各种网页版交互性游戏，以吸引用户在线逗留，在居家隔离的情况下以游戏的方式了解新品内容。对很多服饰鞋履品牌来说，试穿和体验永远是最重要的。但是如何在接触实物前就把产品的特性告诉大家，就需要更有趣、更新鲜的玩法。
#02
/ 要看得顺眼 /
随着屏幕使用时间的增长，网页设计就必须考虑到在任何时刻都让人“看得顺眼”。你会发现，手机有不少 App 都支持起了夜间模式：微信有，Gmail 有，读书软件也有……这是顺应长时间阅读群体的全新设计方向。科技资讯网站 Slashdot 曾经发起过一项“关于其在线用户是否会在手机或电脑端使用夜间模式”的线上民调，数据显示，有约 68% 的用户愿意在手机和电脑客户端使用夜间模式。而根据澳洲创意设计素材网站 Envato 的设计趋势预测来看，夜间模式也是 2021 网站设计的重头戏之一。
estudio/nk
https://www.estudionk.com/en
来自巴西设计工作室 estudio/nk 在网页上设计了一个小按键，以便用户一键切换日夜模式。仔细观察的话，他们的夜间模式并不是纯粹的反色设置，而是相应调整了配色的灰度，还设计了一个视觉层次结构，突出高亮读者会注意的信息，把相对不重要的元素对比度降低。
为何有效
# 增强用户使用频次
# 有益视觉/电池寿命
# 个性化配色更受欢迎
虽然切换日夜模式看起来不过是轻微的调整，但这可以极大地增强用户的使用频率，并且让人愿意长时间在页面停留。Envato UI 设计师 Sean Feehan 表示，根据对蓝光曝光影响的研究来看，转向更多提供黑暗模式设置的产品，对人们的视觉和手机的电池寿命都有益。
不仅如此，人们对视觉舒适度的要求还延伸到了网站整个配色设计。除了适配日夜模式之外，网站的主色调也在逐渐走向舒适化。Envato 网站的 UX 设计师 Tahlia Giannopoulas 在这项设计趋势预测中表示，随着人们对自然问题的日益重视，不少网站配色也转向朴实的暖色调，而这与我们通常在屏幕上看到的明亮、炫目的冷色调相比，“是一个颇受欢迎的变化”。
#03
/ 要关注身心 /
在过去的一年里，健康危机成了许多人关注的主题，优先考虑医疗保健和情绪健康的设计也应运而生，它着重于向读者传达出积极的信息，而非沉重的现实。
Feels FM
https://feelsfm.co.uk/
Feels FM 是一个以 emoji 表情符号为动力的点唱机。直接选一个代表你此刻心情 emoji，输入你的心情和出生年份，就可以直接生成一张属于你的音乐播放列表。
这个由 Studio Something 创建的在线点播平台，联合了苏格兰一家关怀情绪健康的慈善机构 See Me 一同制作，旨在为 8 至 26 岁的年轻人提供一个可以使用音乐表达自己感受的地方。
为何有效
# 符合年轻一代的语言方式
# 传递人与人之间相互支持的信念
此前，在英国广播公司 BBC 的一项调查中可以了解到，在 2012 年 到 2017 年的 5 年时间里，苏格兰寻求心理健康支持的大学生增加了三分之二，而在苏格兰儿童关爱和保护中心 CELCIS 透露出来的数据中， 只有 26% 的年轻人表示会告诉别人，他们自己有否在心理问题。
但 Feels FM 找到了适合年轻人的表达渠道，并且用并不复杂的提问方式，鼓励大家在线表达他们的情绪问题。在上线一个月的时间里，他们就吸纳了将近 7 万名用户，其中有 5000 名回答了网站上的问题，而且写下了自己当下的心情。
尤其是在疫情期间，更多网站在设计中融入了轻松愉悦的内容，比如表情包或者手绘插图。对于网页设计师来说，充满活力的设计，代表着人与人之间友好、包容和相互支持的信念，并能向外界传达出积极的信息ーー对“后疫情时代”的用户来说，这很重要。
#04
/ 要旗帜鲜明 /
网页建站平台 Wix 旗下在线编辑器 editorx 出具的《2021 年网页设计趋势》报告显示，许多设计师已经把他们的创意技能“用于他们所信仰的事业，从抗议图形到呼吁种族、环境和政治正义的运动”。比如，在去年种族歧视成为热议话题的时候，Nike 也直接把标语从“Just Do It.”改成了“For Once, Don't Do It.”
Patagonia
https://www.patagonia.com/activism/
户外服装品牌 Patagonia 的网站首页的一句“We’re in business to save our home planet.”（“我们为拯救地球家园而生。”）简单明了地向外界传达出他们呼吁的声音，他们的目标是利用其周边既有的资源，来应对这个时代的气候危机。
为何有效
# 建立品牌和用户之间的紧密关系
# 从社会议题出发传递品牌观念
眼下更多彰显性别、环境和政治正义的运动，也清楚地表明了这一点：读者需要旗帜鲜明的口号，品牌也需要直接传达出自己的立场和理念，让每一个读者对网站内容产生直接的认知。在 2021 年，网页设计将继续作为一种工具，和社会议题密切关联。
#05
/ 要设身处地 /
在网页浏览的过程中，最容易让人有阅读疲惫感的是长篇文字内容。媒体网站也往往需要图片和场景的辅助，才能够完整地呈现故事本身。而一些新兴技术比如 AR 和 3D 场景重建，则可以吸引更多人进入虚拟现实中，美国一家网站建设公司 Webflow 表示，这种“将视觉效果、文本、视频和音频融合在一起的网站设计，可以提供丰富的用户体验”，这也让它们成为了网页设计的新宠之一。
Google Arts & Culture “蓝屋游踪”
https://artsandculture.google.com/exhibit/%E8%97%8D%E5%B1%8B%E9%81%8A%E8%B9%A4/mwISvFMz5yygKw
Google Arts & Culture 在多年前就推出了线上观展的体验，随着技术应用的逐渐深入，已经有越来越多展览项目能够让用户在线体验“实地考察”。比如这个《蓝屋游踪》的在线浏览项目，就可以通过鼠标指引走向，点击进入展厅或放大作品，再配合文字注释，观看一个老香港“社区博物馆”的方方面面。
为何有效
# 增加环境体验的深度
# 不同应用场景的支持
很长时间以来，网站的设计和排版都受限于二维的平面上，但如今可以应用更新的、当代的方式，为阅读体验增加深度，而随着“云逛展”、“在线时装秀”等应用场景的扩展，它也将是未来最新的设计趋势之一。
比如《纽约时报》这个项目，采访了一对位于罗得岛的夫妇，他们在过去几年间他们一直试图将自己居住的阁楼变成“艺术空间”。
数以百计的书籍、唱片、画作四处堆叠，如果仅通过文字和照片形容清楚这些繁杂的信息变得很困难。《纽约时报》最终用一种 3D 场景的重建技术（“环境摄影测量”），拍摄了数十张至数百张静态照片，然后用软件使其“缝合”形成 3D 网格，读者便可以亲临其境般感受整个空间。
我们需要什么样的网站？
网页已经不是一个仅供人们获取知识的地方，优秀网页设计也绝非排版舒适那么简单。它牵涉到好玩的互动游戏、易于阅读的视觉体验，甚至是更个性的表达、价值观的输出。线上浏览是人们直观感受的第一步，建立起初步的体验感之后，才会去深入了解和认同品牌及故事背后的文化，并满足彼此不断变化的价值需求。
所以，你在关注什么内容，未来又想要看到怎样的网站呢？
—
延伸阅读
—
动物园如何设计视觉形象？| NASA 的 logo 为什么会成为时尚元素？| 除了展现活力，他们到底想用色彩传递什么？| 展览都去购物中心开了，那博物馆怎么办？
—
文：陈元 | 编辑：赵慧
校对：李起光 | 微信编辑：易晓丹
—
喜欢我们的文章就点个赞和在看吧：）