许多有希望的设计趋势必将在2017年爆发。去年，我介绍了2016年的主要设计趋势 ，从那时起，我们已经看到了很多变化 。
一年过去了，设计师们正展望未来。
这些设计趋势可以应用于任何网站 ，因此在我们度过2017年及以后的时间时，请密切注意这些技术。
因此，在这篇文章中，我选择了我注意到在2017年获得关注的 20大趋势 。
1.“特色”徽章
这些徽章通常会链接到主流博客 （如HuffPo，Forbes，CNN，Fox和其他新闻媒体）上的文章。
新兴企业，博客，SaaS项目甚至小型企业现在都在其网站上使用“具有特色”徽章 。
当某人看到权威出版物中提到该网站时，便更容易信任该网站。
目的是验证网站并与新访客建立信任 。
这些大型网站通常会在网上发布其徽标，但您也可以通过四处搜索来找到透明的PNG或SVG。
实际上，许多顶级博客都对这种接触表示赞赏 ，因此它确实可以帮助涉及的每个人。
这证明您确实在网站上被提及 ，而不仅仅是在提出申诉。
另外，建议您链接回到提及您网站的原始文章 。
2.加粗的全大写导航
这些导航链接的字体和大小不同，但通常具有类似的功能 ，例如：
我已经看到了数十个时尚的导航菜单，它们都依赖于这种相同的设计。
- 所有大写
- 粗体
- 均匀分布的
- 对准右上角
但是您可以在许多启动网站上找到它，因为这是共享易于阅读和浏览的链接的一种干净方法 。
Zazzle的主页就是一个很好的例子。
我主要将这种趋势与企业和科技初创公司联系在一起，但在博客中也很普遍。
我希望它在2017年之前能保持良好的增长。
请记下下次您看到这种趋势，因为它无处不在。
3.杂志式博客
现在，博客可以提供全职收入 ，并且开始看起来更像是数字杂志 。
在仅仅十年的时间里，这种趋势已经发生了根本变化。
如果您在2003年经营过一个博客，那被认为是一个可爱的小爱好。
博客在2000年代初期是一个小众概念。
回顾一下TechCrunch于2006年首次发布时的原始设计 。看起来像一个通用的WordPress博客吧？
现在查看2017年Techcrunch的当前主页：
它们是启动新闻的第一来源。
TechCrunch每天发布数十个（如果不是数百个）新帖子。
它不仅看起来像一本杂志 ，而且功能像一 本杂志 。
主页使用大型故事栏目 ，每个帖子都有自己的缩略图 ，文章页面围绕标题 。
杂志风格的设计趋势有很大的不同。
但这就像杂志一样进行设计和管理 ，这一切都与众不同。
它仍然是“只是一个博客”。
当您考虑时，TechCrunch并没有太大变化。
4.视频背景
您可以在数十个商务站点上发现这一点，视频背景占据了整个屏幕 。
但是令人惊讶的是， 自动播放视频（无声音）是一种快速增长的趋势。
自动播放声音可能是网络上最令人讨厌的趋势。
只要视频与网站相关并且不妨碍内容 ，我认为在标题中使用该效果很酷。
正确应用后，我真的很喜欢这种技术。
5.幽灵按钮
这样的趋势之一是没有内部填充但具有外部边框的幻影按钮的出现。
随着极简主义进一步融入网页设计中，许多新趋势正在涌现。
您可以在Instantmojo主页上看到此内容，绿色图标注册按钮位于链接到实时演示的鬼按钮旁边 。
在大多数情况下，这些按钮与其他按钮形成对比以引起注意。
一个很好的例子是新的Bootstrap布局。
其他站点在站点范围内的按钮上采用了纯鬼设计样式 。
它们可能并不适合每个网站，但我确实看到它们的使用量逐年增加。
我认为鬼按钮在倾向于极简主义的网站上有效。
6.模态窗口选择加入
但是，事实证明 ， 它们增加了注册人数 ，营销人员不能忽略有效的技术。
模态窗口超级烦人，我无法想象任何用户会喜欢它们。
这就是为什么我认为模式选择加入窗口将在2017年继续攀升的原因。
但是，如果目标是增加注册人数，那么模态窗口是使事情进展的必经之路。
它们不是我最喜欢的东西，并且我从来没有将它们添加到我的网站中。
其他模式会在x秒后出现，或者在用户向下滚动足够远时设置为打开。
新插件甚至可以定位退出意图 ，每当用户尝试离开站点时都会触发模式 。
不管模式是如何触发的，如何设计的，或者您如何看待它们，我认为它们都会长期存在。
7.插图与矢量艺术
现在，图形设计和界面设计正不断与越来越多的跨学科设计师融合。
随着诸如Sketch和Affinity Designer之类的新矢量设计程序的出现，网络上掀起了一波新的插画家浪潮。
这意味着在不久的将来，我们将看到更多的自定义图标和全页插图 。
许多插画家都是执业画家，所以我认为我们会看到用数字绘画软件制作的整页背景 ，这些图像的绘制方式像概念图一样详细。
8.固定的滚动侧栏
这些都是太常见的，尤其是在响应式设计中，固定导航栏复制了本机移动应用程序的感觉 。
第一波固定设计的重点是导航栏 。
但在2017年，我希望看到更多粘性元素- 粘性侧边栏 。
它使内容始终可见，并增加了用户与侧边栏内容进行交互的可能性。
几乎每个主要博客都使用这种粘性的侧边栏。
在任何网站上进行设置都比以往任何时候都容易。
加上数十个免费的jQuery插件 ，可以复制粘贴的侧边栏效果 。
9.页内目录
当然，这并不总是正确的，因为可以快速回答一些查询。
最近的一个案例研究发现，在用户保留的排名和质量方面， 长篇内容优于短篇 。
您会在冗长的评论网站或分解成所列项目的文章中看到这一点。
但是随着网络上长篇幅内容的增多，很自然地会看到在文章中添加了更多目录 。
如果Google发现您的网页有价值，那么您可能会在搜索结果中获得跳转链接 。
目录还可以帮助您的网站排名更高 ！
添加目录可以改善用户体验，并有助于将阅读内容分成较小的块。
但我预计这种趋势会在2017年及以后的几年里爆发。
确实，现在ToC相当稀缺。
10.明亮多彩的设计
但是我偶然发现了数十个网站，这些网站使用明亮的柔和色彩和其他鲜艳的色彩来创建非常漂亮的外观。
我不确定这种趋势是否来自极简主义或对Google的材料设计的反应。
Rentberry主页是一个很好的例子，它也使用 大量的渐变。 甚至在下面都有前面提到的“特色”徽章！ 一个站点上有两种趋势。
您会注意到，颜色不会渗透到整个页面上 ，并且会被其他白色和灰色阴影所屏蔽。
我已经看过足够多的这些充满活力的配色方案 ，以至于它们正在上升。
11.滚动动画
我已经看到许多网站，当您滚动到页面的特定部分时，这些内容现在会在内容中显示动画 。
但是，这并不是我所说的“滚动动画”的意思。
Web设计人员了解滚动劫持及其可怕性。
这种趋势主要局限在希望在其设计中花些力气的初创首页和SaaS公司 。
尽管如此，这种趋势似乎正在Swift蔓延，而如果很少使用，它可能确实很整洁。
它确实吸引了人们的眼球，但我认为它所提供的功能远不止美学。
我不能说这是否是一个特别有用的趋势。
12.单页应用程序（SPA）
JavaScript 从服务器提取内容并动态加载它 ，因此页面永远不会刷新 。
单页应用程序是纯粹使用Ajax调用构建的网站。
哎呀，甚至CodePen都可以被认为是SPA。
但是随着更多的JS技术的发展 ，我注意到越来越多的SPA一直在开发。
常见的例子是Gmail和Facebook等网站。
借助React和Aurelia等强大的前端库，在2017年从头开始创建SPA将变得更加容易。
13.可切换的搜索栏
但是最近我注意到更多的搜索字段默认是隐藏的 ，必须切换到视图中 。
过去，无论是在侧边栏还是在导航中，搜索字段始终在网页上的某个位置可见。
如果不确定在新设计中将搜索表单放置在何处，则可以考虑使用链接到导航中放大镜图标的切换字段。
当然，这是一种节省页面空间同时仍保持搜索功能可访问性的方便趋势。
14. Adblock消息
在Hongkiat上，您会注意到内部广告填补了进一步链接到网站的空白 。
有些网站会在 Time.com之类的广告空间中礼貌地添加消息 。
唯一的问题是出版商将如何应对这一趋势。
无可否认， 广告拦截正在上升 。
不幸的是，这既伤害了用户，也伤害了发布者，而这一切都源于劣质的广告技术。
许多大型网站（例如Business Insider和Forbes）都已经具备此功能。
这是一种“阻止广告拦截器”的技术 。
我看到的一种严重趋势是adblock内容块 。
越来越多的人正在安装adblock插件，并且我期望更多的发布商会回头 。
归根结底，在广告屏蔽辩论中您应归咎于谁或所处的位置都没有关系。
15.纯SVG图标
我觉得2017 年对于网络上的SVG来说将是丰硕的一年 。
SVG图形已经渗透到网络中，但是它们每天都在增长。
但是您也可以将SVG 编码为HTML ，例如通过在CodePen上使用此示例 。
如果您知道如何搜索，则可以在Flaticon等网站上找到数千种免费的SVG图标集 。
所需要的就是让足够多的设计人员认识到SVG的强大功能并开始使用它们！
全面的现代浏览器支持看起来不错 ，因此兼容性没有问题。
因此，设计人员有使用SVG的方法，而开发人员也有使用SVG的方法。
16. Adobe XD
目前，它同时支持Mac和Windows ，并且处于全面推出之前的测试阶段 。
Adobe在2016年发布了Adobe XD的完整测试版，此后Swift发展。
此外，在Adobe 希望为所有人提供支持的同时，Sketch仍仅支持 Mac。
您可能会嘲笑任何程序都会超越Sketch，但出于某种原因，Adobe是创意作品的主要软件公司。
它可能成为设计UI原型的必备软件—因此，我们最终可以将Photoshop用作照片处理工具（按预期使用）。
我坚信，来年我们将阅读有关Adobe XD的更多内容。
您可以在Dribbble中找到许多Adobe XD免费赠品，以及两个针对XD的新免费赠品网站 Designmine和XD Guru 。
随着新软件的兴起，还有许多教程和免费赠品GUI套件 。
17.更多的汉堡包菜单
但是，由于屏幕很小，只有很多选择，因此目前没有更好的选择。
有很多可用性研究反对隐藏在菜单之外的菜单 。
喜欢它还是讨厌它， 汉堡包就在这里 。
就像放大镜图标表示“搜索”一样，三栏式汉堡包图标很快将成为“菜单”的代名词。
汉堡包图标正逐渐成为导航菜单的可识别符号 。
他们正在学习将该汉堡包与导航菜单联系在一起，而且看不到尽头。
但是，随着时间的流逝，越来越多的人使用智能手机并开始浏览移动网络。
对于大多数精通技术的人来说，这已经是正确的。
18.产品功能图标
这可能是在主页上共享产品功能的最常用方法。
到2017年，这一趋势将是巨大的 。
我在Treehouse上写过关于这种趋势的文章，但最近没有提及。
该产品可以是从SaaS程序到WordPress主题甚至是物理项目的任何东西。
首先列出产品的功能 。
最好避免使用诸如“可靠”或“快速”之类的通用功能 ，因为大多数人都希望使用这些功能。
然后，您可以设计自定义图标或找到代表这些功能的图标集 。
如果是高级WP主题，则可能会列出它的响应性，附带的小部件数量或菜单的工作方式。
而是列出真正重要的功能。
文字本身很难消费，但视觉效果一目了然 。
这些功能图标的作用类似于视觉效果 ，有助于销售每个功能 。
19.折叠式CTA
但随着游客花费更少的时间在网站上 ，它的关键是有倍以上强大的CTA 权利 。
传统上， 号召性用语是遍布整个网站的 。
这些号召性用语可能是按钮，选择加入表格或其他输入，以促使人们采取一些行动，例如注册或阅读博客文章。
但我可以说，这种趋势似乎正在将这些CTA放在首位，并且清晰可见 ，所有访客都可以看到。
我无法告诉您如何设计CTA或如何针对转化进行优化。
20.内容范围较小
句子宽为2000px时，阅读句子要困难得多，而宽度只有700px。
监视器已经变得如此庞大，以至于大多数网站都必须设置最大宽度 。
较小的内容更易于消费 ，并最终在内容密集的网站上创造更好的体验 。
我更喜欢最大宽度为750像素，但您可以缩小到600像素或更小。
我认为更多的设计师正在意识到这一点，并将逐渐减小其内容区域的大小 。
但是对于简单的博客或商业网站，趋势是朝着内容更长，段落和内容区域更小的方向发展。
《纽约时报》等主要出版物可能会偏离其自身的结构准则。
较短的段落 ， 较少的句子和较小的内容区域将始终提高可读性 。
包起来
在我们迈向2017年的过程中，应该清楚哪些趋势正在爆炸，哪些趋势没有爆炸。
在这篇文章中，我还没有涉及很多其他趋势，但是我认为这20个最有趣。
如果您对即将到来的设计趋势有其他想法或建议，请在下面发表评论。