用户参与度与活跃度的区别_设计重点突出的界面以提高用户参与度

用户参与度是一个棘手的指标，可以针对不同项目以不同方式实现。 大多数设计人员在谈论交互性时都会想到界面 ，但是页面内容也可以鼓励用户交互。 为了更好地吸引用户，重要的是编写引人入胜的内容 ，并以醒目的设计呈现该内容。

说起来容易做起来难，但是，如果您了解了一些基础知识，便可以为项目精心设计具有丰富内容的UI 。

在本文中，我将向您展示如何在基于Web的界面上增加用户交互和内容参与 。 这是吸引访问者的两种最常见的方式，并且如果您可以优化体验，那么增加页面上的可观时间就不会有问题。

捕捉新奇

新奇的概念定义了一个事件或事物，这些事件或事物通常是新事物，通常是非常新的事物，基于上下文是独特的。 新颖的事件吸引了我们的注意力，因为它们脱颖而出 。 界面设计也是如此，其新颖性代表了似乎跳出页面的元素。

我最近找到了一篇很棒的文章，讨论了关于参与的新颖性的重要性。 用户似乎倾向于新颖的体验，界面和UI元素，因为它们是不同的。 设计不同的唯一事实常常引起人们的注意。

一个常见的示例是在大多数目标网页上找到的号召性用语按钮 。 您还可以使用背景照片，插图或应用程序屏幕截图来增强新颖性，例如在Uber for Business登陆页面上。

该页面上确实有一个号召性用语按钮，但我的注意力立即转到屏幕截图 。 它们在首次加载时会进行动画处理，因此将设计的新颖性与动作结合起来引起了人们的注意。

另一种选择是使用插图图标作为链接的 GiftRocket ，以进一步深入研究该站点。

这两个例子都利用新颖性来发挥自己的优势 。 您无法始终将人们吸引到该站点，但是，如果首先在本职级别上吸引他们的注意力，您将看到更好的结果。

设计是访客首先看到的，您需要在几秒钟内引起他们的注意，以鼓励进一步的参与。

可略写的版式

研究发现，大多数用户扫描网页而不是逐字阅读。 您可能希望吸引人们阅读您的内容，但是您只能做很多事情。

最好的选择是创建带有标题，加粗文本和可说明您要说的内容的图片的可浏览内容 。 我可以想到至少三种可用于内容中以提高可读性的 强大写作技巧 ：

1. 用清晰的字幕划分内容
2. 分解段落以使其更小
3. 使用项目符号列表可以更快地分享您的观点

目的是使读者以任何必要的方式使页面向下移动 。 通过将内容分成几小部分，您将更容易获得关注并吸引人们进一步进入网站。

查看Quick Sprout博客以获取这种写作风格的示例。 内容由尼尔·帕特尔（Neil Patel）撰写，他经常写很长的内容，但他将段落分为1-3个句子。

如果标题正确 ，并且在整个内容中使用图片/项目符号 ，则会使人们略读和深入阅读。 另外，请确保增加段落之间的空白量 。 边距和填充在布局设计和可读性中都起着重要作用。

设计文字，以便阅读时实际上很有趣 。 无聊的副本不会吸引人，但是有趣的副本太小或缺乏对比度都不会。

抢眼图片

Backlinko 最近的一项案例研究表明， 至少包含一个图像的页面通常比没有图像的页面排名更高 。 从SEO角度来看，这很棒。

但是用户参与度又如何呢？ 如果您可以将一张图片保留在折叠上方或接近顶部，则还可以在访客反弹之前吸引他们的注意力。 请记住，新颖的页面元素容易吸引。

当您在整个页面中穿插一幅图像（或多幅图像） 时，将使无聊的文本块变得单调 。 用户可以从阅读中休息一下 ，欣赏图像，或者在图像和书面内容之间建立联系。 但是，与大多数设计技术一样，质量比数量更有价值。

Moz的案例研究发现，高质量的图像往往会使访问者在页面上停留的时间更长。 在另一方面，质量较差的图像不工作，以及在某些情况下，他们所造成的游客的反弹比没有图像更快 。 您应该尝试至少包含一张与内容相关并为读者提供价值的图像 。

TechCrunch会在他们的文章中使用特色图片来做这些，您经常会在首屏上找到特色图片 。

WordPress通过发布缩略图功能轻松添加特色图片。 您可以为所写的每个帖子设置一张与众不同的照片，然后将其强制显示在页面顶部。 这是让访问者了解内容的全部内容并增加还包含帖子缩略图的相关帖子小部件的CTR的完美方法。

对比页面元素

如果您需要引起页面上某个特定区域的注意，那么不对称是您最好的朋友。 对比度会在设计的特定区域或某些内容块之间产生硬楔。

参观者自然很喜欢对比，因为它与众不同。 颜色，大小或空白的大并列吸引了人们的眼球，因为它破坏了布局中所有其他内容的模样。

我最喜欢的页面元素对比示例是Sketch的主页。 两个号召性用语按钮之间有很多对比，一个按钮用于下载Sketch试用版，另一个按钮用于购买副本。

购买按钮使用的完整背景颜色比标题中的其他颜色要明亮得多。 与免费试用版按钮相比，按钮上的文字也更亮。 这将引导访问者仅通过视觉刺激就进入“ 立即购买”按钮。

您会在Optin Monster的首页上注意到类似的技术 。 该标题只有一个标记为Get OptinMonster Now的按钮。 这是蓝色背景上的亮绿色按钮，看不到其他绿色元素。

颜色，大小和形状都会引起您的注意，因为它与标题中的所有其他内容形成对比 。 在按钮旁边直接是用于视频预览的小文本链接。 这可能是一个很棒的视频，值得关注，但不如试用/注册CTA按钮那么多。

对于博客，您可能具有不同的用户参与资格。 一种常见的选择是新闻通讯注册表格 ，例如Aeolidia上的示例 。

如果向下滚动到内容的底部，您会注意到一个仅为新闻通讯表单设计的花哨的注册框 。 它以独特的背景色，有趣的字体和可爱的King Triton图标在页面其余部分中脱颖而出。

对比设计的最佳方法是研究示例并进行实验。 通过A / B测试跟踪指标，查看有效的方法和无效的方法。 如果您正在寻找更多示例，请查看此Codrops文章 ，其中包含不对称实时网站的提示和屏幕。

鼓励用户互动

有很多方法可以使访问者对网站感兴趣，但是最常见的方法是让他们做事 。 静态博客和动态社交网站都是如此。 没有一种千篇一律的花样。 您可以做任何使用户感到与页面互动的工作。

在静态站点中 ，您可能会添加许多相关链接以阅读更多内容，或者包括图片幻灯片 。 您也可以添加用于用户评论或电子邮件通讯的表单 。

当涉及到动态界面时 ，该站点的目的通常是鼓励用户参与。 最大的障碍是教会用户网站的工作方式以及如何正确使用界面。

请查看KissMetrics的有关用户参与技术的帖子 。 我发现的最佳策略之一是设计一个带导游的游览 ，带领访客参观每个主要的特色 。

想一想Twitter的前景会给一个新用户带来多大的困惑。 如果他们没有关注任何人并且没有任何关注者，他们为什么会发推文？

注册期间的“遵循建议”框可帮助新用户熟悉Twitter的工作方式 。 此功能使新用户可以开始使用该平台，并可以尝试使用以下功能 ：关注，推文和私人消息。

除了导览外，您还希望使界面简单 。 主要功能应与用户的仪表板或主页相距1-2次点击 。 直观的界面需要说明 ，而简单性可以更快地吸引人们的注意力 。

通过了解所有这些技术，您将可以更轻松地构建用于解决用户问题并鼓励新用户加入的界面。 如果您正在寻找更多的UX设计参与技巧，请查看以下相关文章：

• 用户入职策略以提高参与度 （thinkapps.com）
• 逐步参与课程 （uxbooth.com）
• 不要以为新用户想学习如何使用您的产品 （uxdesign.cc）

翻译自: https://www.hongkiat.com/blog/designing-focused-interfaces-for-attention/