设计和可用性上的错误-这些是访客要批评该网站，不愿购买任何东西，退订并前往竞争对手的缺陷。 这些错误通常与技术故障，逻辑，导航，设计，营销和站点内容有关。
在本文中，我们将看一些主要的UX错误示例，并重点介绍60个常见问题，对其进行更正可以保证转换率的提高。
如果不确定您是否需要它，请阅读不悦的Vasya的故事。 它说明了由于一个错误，在线商店如何失去常规客户。
Vasya如何在可用性差的在线商店中选择麦克风
我们朋友的名字叫Vasya。 他是YouTube初学者，需要麦克风来录制语音视频。 其未来的麦克风应具有三个特点：低价格，清晰的声音和对Avito的需求。
最后一点特别重要，因为使用声音表演可能无法奏效，而且我们的YouTube也不愿退回大部分投资。 制定了要求，Vasya随身带了一个可信任的在线商店的网站。
由于周到的导航，Vasya并没有因此而感到困惑，并很快找到了“麦克风”类别。
当Vasya打开“麦克风”类别时，他立即遇到了第一个问题，即设计不当的摩擦过滤器。 此过滤器不适合初学者使用，因为它需要了解麦克风主题。 没有这个很难：
由于没有任何线索，因此Vasya会根据其目的过滤掉这些货物，并选择录音室麦克风。 这里的逻辑是：如果工作室是高质量的。 其他一切都是次要的和难以理解的。
在“麦克风”部分，Vasya遇到了一个复杂的过滤器，初学者无法正确配置该过滤器。 如果您知道一个主题，则无法选择合适的麦克风。
在演播室麦克风的领导下，Vasya以不断上涨的价格安排了产品的价格，并以50美元的价格选择了Superlux HO8麦克风。 这是可用的录音室麦克风中最预算的选择，根据客户的评论是值得的。 那是初学者youtuber所需要的。 Vasya进行了购买，并已与客户达成协议，为第一部视频配音。
Vasya的选择是价格为50美元的Superlux HO8麦克风。
Vasya等待包裹，打印麦克风，将其连接到计算机，并听到令人作呕的声音。 一切都与幻像电源有关，否则，Superlux HO8无法完全发挥作用。 此刻在产品卡中仅剩一行，Vasya由于经验不足而错过了这一行。
幻像电源是额外的元件，否则，Superlux HO8录音棚麦克风将无法正常发声。 在产品卡中，这一刻写在一行中，没有准备的初学者很容易会错过。
接下来，Vasya开始独立收集有关所选麦克风的信息，并发现以下细微差别：
- 在同一在线商店的网站上，幻像电源ZEEPIN 48V的安装最便宜。 它的价格约为37美元，仅可通过预购获得。 更昂贵的安装成本为65美元起。
- 除了Superlux HO8麦克风的幻像电源外，您还需要购买一个支架和一个弹出过滤器。 尚未放置外部声卡和声屏以抑制不必要的噪音。 加起来，这至少是100美元。
- 除了上述所有以外，您还可以购买可以满足YouTube初学者需求的廉价USB麦克风。 例如，您可以花50美元购买Trust GXT 232； 和$ 85-蓝色麦克风雪球冰。
结果是：Vasya徒劳地投了钱，没有使用购买的麦克风，这家在线商店的所有者失去了一位固定客户。
安装37美元的ZEEPIN 48V幻象电源。
为了避免失去客户，在线商店的所有者应从新手的角度看待他们的产品，并在教育内容上放一些利害-在所有复杂的产品中添加提示，有用的文章或视频。 如果Vasya及时了解幻像电源，他就不会购买不需要的产品：他会用Superlux HO8麦克风转到页面→从打开的提示中了解幻像电源→转至一篇文章，详细介绍幻像设置→研究了有关变体的材料麦克风→我将返回麦克风列表，并从可用产品中选择带有USB连接器的最佳选项。 大家都会满意并继续合作。 因此，怨恨和关心竞争对手。
缺乏教育内容是在线商店所有者犯下的许多错误之一。 稍后我们将讨论其他问题。
技术部分
下载速度慢
如果在前三秒内未看到其原始外观，则大约40％的用户将离开您的网站。 单击部分后，相同数量的访问者将立即离开，并将再次冻结。 为避免这种情况，您需要不断进行测试，优化沉重的图像并检查字体下载的速度。 视频的另一种情况是，如果没有这些视频，那么您需要投入额外的资金，并考虑提高该网站的生产能力。 如果视频可以替换为文字和图片，那么最好这样做。 下载速度比内容格式重要。
加载站点长。
该示例显示站点加载时间为9.83秒。 这不是一个有效的选项，因为很少有访客等待超过3秒的时间。
沉重的图像文件。
图像过重是影响网站加载速度的关键因素之一。 因此，如果您需要提高速度，首先请注意重新加载图像。
页面加载期间有大量请求。
亚马逊进行了研究，并计算出，如果网站的下载速度下降至少100毫秒，则销售转化率立即下降1％。 为防止这种情况，鼓励站点所有者进行两种类型的测试。 第一次测试应该实时进行，您可以立即从中计算出慢速页面。 第二次测试应该是定期的（一周或一个月一次），并且可以根据其结果纠正所有慢速元素。
链接断开或损坏
如果用户访问了您的网站，则意味着他对某些信息感兴趣，这就是他应该获得的信息。 如果这种情况没有发生，并且出现了断开的链接，而不是您要查找的页面，则用户将离开该网站，将该网站列入黑名单，并且以后将始终与竞争对手联系。
不仅用户，搜索机器人也会对断开的链接产生负面反应。 当机器人找到断开的链接时，它得出以下结论：没有新内容代替空白页面→该网站未开发且对所有者不感兴趣→该网站可以在搜索结果中降低。
程序代码中的链接断开。
持续监控是避免断开和断开链接的唯一方法。 如果发现故障，请立即开始更正程序代码。
在新窗口中打开页面时。
错误404
如果您的站点最多有100,000页，则每月至少开始监视一次。 如果还有更多页面，请尝试安排每周检查。
未优化的页面404
页面404是网站访问者可以通过单击断开或不存在的链接获得的空白位置。 如果此页面未经过优化，则用户将立即离开您的网站，并且将无缘无故返回该网站。 如果页面经过优化，则不会造成流量损失，并且用户将能够移至所需部分。
确保页面404不枯燥且空白。
要优化404页面，请遵循以下准则：
- 简要描述此人去过的地方以及他为什么在这里。
- 放置一个指向网站主页的链接。
- 将链接发布到网站的热门部分。
- 要求用户将错误报告给站点管理员。
- 与设计混淆，使404页面的装饰风格与整个网站相同。
最后提示-不要忘记幽默。 如果用户微笑，那么您将征服他的位置并可以依靠他的进一步关注。
水平滚动效果不佳
横向滚动是浏览页面时查看网站内容的一种方法，该方法不是自上而下（），而是从右至左（）。 水平滚动的问题在于，很难适应不同类型的设备-如果您不分配预算并计算出程序代码的每个元素，则该站点将崩溃并且无法正常工作。
Web滚动工作室喜欢使用水平滚动，它通过这种复杂的多组件操作证明了自己的能力。 如果您的预算不允许您为每种类型的现代小工具订购单独的布局，那么您就无法很好地设计网站。 在这种情况下，水平滚动不适合您，您需要设计具有经典运动方案的站点-进行垂直滚动。
缺乏自适应布局
在2019年，超过一半的互联网流量来自智能手机和平板电脑的用户。 将来，这个比例可能会改变，否则其他设备将取代智能手机和平板电脑。 自适应布局使您不必依赖于这种趋势，也不会因为受众的技术偏好而失去转换。 也就是说，自适应布局是指站点可以正确调整为任何屏幕的宽度，并可以在计算机，平板电脑，智能手机和任何其他现代小工具上正确显示的时间。
网站没有自适应布局。
如果您的预算仍然有限，并且您无法订购自适应布局，则可以部分调整站点。 部分调整是指您将站点调整为用户最常使用的设备的屏幕宽度时。 在大多数情况下，这些将是所有类型的智能手机。
该站点未配置用于超高精度Ultra HD监视器
在2019年，大多数网站都将重点放在具有两种分辨率的显示器上：高清和全高清。 在高清屏幕中，像素密度为1366×768-这些是预算最高的显示器，正逐渐失去其知名度。 在全高清屏幕中，像素密度为1920×1080-这是最流行的显示器，设置自适应布局时，大多数开发人员将以其分辨率为指导。
与高清和全高清显示器一起，具有超高清分辨率的屏幕（4K显示器）也越来越受欢迎。 在超高清屏幕中，像素密度为3840x2160-通过显示站点上的最小细节可以使您获得超清晰的图像。 您还可以购买像素密度为7680×4320的8K显示器。
鉴于这种趋势，可以假设Full HD标准即将进入预算类别，而最受欢迎的将是具有Ultra HD分辨率的显示器。 因此，进行附加测试并确保该站点的所有元素都正确显示在4K监视器上非常重要。 如果不这样做，那么当用户切换到超灵敏显示器时，您网站的转换率将稳定下降。
网站上的无效搜索
站点上的搜索引擎就是这样一种工具，其使用频率取决于资源的格式：它在信息站点上很少使用，并且在在线商店中，它可以完全取代分类过滤器。 因此得出结论：搜索引擎应该并且始终正确地工作。 如果不是这种情况，用户将无法快速找到必要的信息或产品，离开网站，从竞争对手那里找到所需的一切，并且极有可能永远不会回来。
无效的搜索结果优先级。
当您配置搜索引擎时，请记住细微差别，即某些查询经常会输入错误。 例如，如果用户着急，则可以输入“ laptop”代替“ laptop”。 对于站点上的搜索引擎来说，这应该不是问题-它应该正确识别请求并产生所需的结果：“笔记本电脑”→“笔记本电脑”→所需型号列表。
未配置的自动保存在订单篮中
购物车应复制所有用户购买的商品。 这意味着，如果用户在产品卡中指出了三个毯子，则篮子中也应显示三个毯子。 如果购买了几单位商品，则不会出现此问题。
如果用户进行大量购买，一切都会发生很大变化。 在这种情况下，缺少自动保存功能可能会导致客户端丢失。
在购物篮中设置自动保存功能，不要强迫客户做双重工作。 否则，您可能会失去固定客户。
默认情况下，一揽子商品为“ 0”。 根据使用点击图的分析，我们看到，因此，用户必须执行一项不必要的操作：首先将产品添加到购物篮中，然后指示其数量。
即使自动保存功能在购物篮中正常工作，也请确保经理始终回电给客户并指定订单。 有时，客户会多次错误地单击“购买”按钮，而不检查购物篮并收到错误数量的商品。 这也很糟糕，因此最好回电。
布局问题
该网站应始终在所有浏览器中正确显示。 如果布局开始飞走，站点将很难执行计划的有用动作，并且访问者会认为非专业人员参与其中。 想象一下，客户想要下订单，并且由于飞行的布局无法执行此操作。 充其量，他将重新加载页面，然后重试，最糟糕的是，他将停止与您合作。 这不应该被允许。
布局崩溃的示例：单击表单以填写→屏幕自动返回其原始上方位置。
当屏幕返回其原始位置时，这会使用户脱离订单。 如果该过程至少重复一次，您可能会没有客户。
布局崩溃的示例：社交网络图标适合页面文本。
如果社交网络的按钮不正确，则它看起来很丑陋，并引起对资源所有者的不信任。 另外，您可能会错误地单击其中一个按钮并打开其他站点。 真烦人
布局崩溃的示例：在网站的自适应版本中文本显示不正确。
在大多数站点上，文本是内容的主要单元-用户在Internet上所针对的信息媒介。 因此，如果文本不方便阅读，则没有人会希望在这样的网站上工作。
布局中断的示例：面包屑与文章标题重叠，并且文本不在主图片下方开始。
上面，我们仅发布了网站可能存在布局问题的一小部分示例。 这些示例中的共同点是：它们使站点难看且难以阅读。 看到类似的内容-紧急纠正。
不可点击的按钮
网站上的按钮充当网站所有者和访问者之间的合同。
如果无法签订此合同，则将不会进行任何交易。因此，如果放置按钮，请检查其可单击性。不可点击按钮的示例：“按信用购买”和“按一下购买”按钮不起作用。在点击“按信用购买”按钮后，一个带有每月还款额和贷款条件的页面应出现在用户面前。通过经理找出所有细微差别很长时间，因此更容易关闭网站并查看竞争对手的所有信息。对于购买大量商品并珍惜时间的普通客户来说，需要“一键购买”按钮。如果该按钮不起作用，则此类用户将立即找到该不便站点的替代者。不可单击按钮的示例：滤镜无法评估或最终决定其他颜色解决方案。如果颜色方案对用户很重要，则他必须查看所需版本的产品。否则，将在其他站点上搜索图片，并且订单将保留在要执行的位置。不可单击按钮的示例：当您单击星号时，用户立即翻转到标题，没有任何反应。因此，您不能发表评论。如果该网站的评级为无效，并且系统带有评论，则访问者可能会认为该网站所有者忽略了他们的意见。因此，形成了对资源的不信任和消极态度。不可点击按钮的示例：主页上不可点击的横幅。在该示例中，标语不仅不可点击，而且无需调用即可构成。要解决此问题-只需添加工作按钮“转到”或“更多”即可。不可点击的商品篮
一篮子商品是网上商店的访客在确认订单之前熟悉的地方。如果将“购物车”图标设为不可点击，则许多用户将不希望处理异常功能，而会在其他地方进行购买。为避免这种情况，请勿尝试使用一篮子商品，并始终使其图标可点击。还有一件事：请勿使用其他广告素材名称代替“购物篮”一词。用户可能不会单击“购物车”，“仓库”或“ Lukoshko”。自启动音频和视频文件
您有权在网站上以您认为必要的格式发布内容。同时，您网站的访问者有权选择要观看的内容格式以及何时更好地进行观看。如果您添加独立启动的音频和视频文件，则侵犯了用户的权利-他们没有要求任何东西，因此您决定为他们显示网站的内容。有时自动播放媒体文件可能是一个很好的解决方案，甚至《福布斯》发行人有时也使用这种格式。但是，在大多数情况下，这会导致立即关闭该站点而不再返回该站点的愿望。因此，我们建议您不要冒险，也不要干扰用户的内容管理。逻辑学
网站主要版本中的“汉堡包”按钮
“汉堡”按钮是三个水平条纹，单击后，将打开站点菜单。这项技术是为自适应布局而发明的，用于将网站内容传输到具有窄屏的小工具。如果在站点的主版本中使用相同的技术，导航将变得更加复杂，并且用户需要执行一项无用的附加操作来查找必要的信息。因此，存在用户不舒服的风险，并且下次他将选择导航更加周到的站点。使用自适应布局中的“汉堡”按钮，对于主站点，保留简单的线性菜单。没有徽标的网站
徽标是位于网站标题中的常见属性，旨在提高知名度。通常，徽标与favicon结合使用-一个小图标，在打开的页面名称前面的浏览器选项卡中突出显示。如果徽标和网站图标的设计正确，则有助于记住该站点并增加退货的可能性。没有这些属性，记住您的站点将变得更加困难。主页上的滑块
, 1-5% . , . , : → → . — : , .
链接是一种保留网站访问者的工具。用户阅读他喜欢的文章→看到一个附加的有用链接→单击该链接，然后保留在网站上。如果该链接未成功标记，则用户将无所适从，并且在研究了所需主题之后，他将立即关闭该站点。要解决此问题，您需要使链接可见。为了增加过渡的可能性，您可以收集所有推荐的链接，并在文章的结论中重复它们。因此，用户肯定会看到关于所选主题的其他内容。冗余动画
页面上的任何多媒体文件都应执行一些有用的功能：娱乐，讲故事或帮助处理主题。 如果动画太多，那么该页面将变得多余，并且将很难学习。 对比原理也将被违反，所有重要动画都将与次要动画混合。 结果，用户将什么也不会记住，甚至拒绝研究超载的页面。
避免冗余，并专注于重要的动画。
分散注意力的元素
在这里，您需要遵循与冗余动画相同的原则：如果某些元素无法执行有用的操作，则最好不要将其发布在页面上。 仅当这些元素以某种高质量的装饰形式出现时才允许例外，它使您可以在现场营造愉快的氛围。 如果质量是一个问题，那么最好不要使用分散注意力的元素-这样可以减少恼人的访客。
没有关闭按钮的弹出窗口
站点访问者是访客，其所有操作只能是自愿的。 如果将弹出窗口添加到站点并在没有“关闭”按钮的情况下进行设计，则用户将没有任何选择。 因此，可以保证他不会喜欢您的网站，并且下次他一定会选择竞争资源。 因此，如果您使用随机弹出式窗口-请确保在其中添加一个大的“关闭”按钮。
恼人的验证码
CAPTCHA是一种有用的工具，可以保护页面免受机械手的入侵。 因此，验证码应该是并且不能没有它。 随之而来的问题是，验证码的编程不正确，使每个新访客都被僵尸机器人所吸引：一个人以一种有趣的方式来到该网站进行注册→而不是研究内容，他应该花时间输入对他来说毫无意义的数字和字母。 如果验证码已损坏或时间太长，情况就会更加严峻-与关闭页面相比，用户关闭页面更容易。 因此，为了不丢失观众，请使验证码紧凑，无形，很少工作并且能够更好地将人与机器人区分开。 规范选项是reCAPTCHA。
侵入式弹出窗口
弹出窗口是一个弹出横幅，敦促用户采取一些特定的操作：订阅时事通讯，留下电话号码或点击特定的链接。 弹出窗口执行广告功能，并且在弹出页面上显示不适当消息的情况下非常令人讨厌：
如果您正在执行弹出窗口，请为它们提供一些有用的信息并进行配置，以使用户有时间至少学习一点网站内容。
强制注册程序
如果您需要在购买前在在线商店中注册，请准备低转换率。
如果您想安全地收集用户数据，只需说明注册过程的优势，并在首次购买时自动进行注册。 通过电子邮件发送密码。
收集感兴趣的用户的联系很困难，但是失去却很容易。 因此，请勿打扰您的订户，不要发送垃圾邮件和无用的广告。 他们承诺提供有关有益奖金的信息-首先讨论奖金，然后再插入一些广告。 有可能，但没有其他可能。
复杂的注册程序
如果用户决定在您的网站上注册，则此过程不应超过一分钟。 当注册表格过于复杂，必填字段过多且包含多个步骤时，与执行建议的操作相比，用户更容易改变主意。
如果用户需要输入大量必需的数据进行注册，请考虑如何简化此过程。 例如，您可以连接插件并从社交网络中拖动必要的数据。 或者，您可以将注册分为几个部分：在开头输入邮件，姓名和电话号码，然后可以在个人帐户中添加所有其他信息。
屏蔽密码字段
隐藏的密码输入字段（****）适用于在线银行以及存储金钱或重要用户文档的网站。 在这种情况下，需要一个隐藏的密码并将其用作其他保护措施。 例如，如果您决定在公共咖啡馆使用在线银行，则可以登录，而不必担心帐户的安全性。
对于所有其他情况，最好不要使用隐藏的密码字段，因为这会使输入您的个人帐户的过程变得复杂。 如果由于某种原因无法解密密码输入字段，请确保用户可以自行决定打开和关闭此选项。
导览
未配置的分页
分页是商品目录的页面，搜索机器人会在主页之后立即读取这些页面。 如果在网上商店中对分页的框架设置不正确，则该网站的宣传不佳，销售也不佳。
如果站点上有大量特定类别的产品，则应将此类别划分为分页。 值得在文章底部添加一个页面切换按钮，这是所有页面的简短列表。 通常在分页页面上您可以找到一个附加按钮来一次显示所有产品，在这里您需要非常小心，并确保在更新产品列表时，URL将被更改，并且将noindex预先放置在该按钮上。
构思不佳的旅行场景
在网站上时，用户应始终知道他可以执行哪些操作以及将要执行的操作。 一旦没有达成共识，混乱和转换问题就会开始。 为了明确起见-我们将以一次单击不协调购买商品为例来分析这一刻：
这是另一种情况。 想象一下，您需要联系技术支持经理，而这只能通过请求回电来完成。 您输入电话号码，不会收到任何通知。 因此，您不知道经理是否收到您的请求，何时等待答复以及在紧急情况下应与何人联系。 即，形成了离开竞争者的现成的理由。
显示了电话号码，但没有确认已将其传送给管理员。
为了解决这个问题，我们将分析另一种情况。 程序员对该站点的设计不佳，用户对产品卡有疑问。 在卡片中，您无法更改商品数量，也不能从购物篮中删除所选商品。 由于没有任何线索-用户很快就会失望，并且不会在这样的在线商店中购买任何东西。
未显示所选的单位数量，并且无法更改任何内容。 如果切换到下一步，则无法选择商品数量
避免出现草率的情况，并使用澄清提示来备份每个自定义步骤。 这是避免冲突的简便方法。
没有面包屑
“面包屑”是一个导航系统，显示用户从主页到当前部分的移动链。 通常会在网站顶部显示“面包屑”，在它们的帮助下，您可以快速移回并找到以前查看的部分。 我们观看了产品10-在“面包屑”上，您可以一键切换到产品2。
除导航功能外，面包屑还会影响seo优化：它们会在其他页面之间建立链接，并对行为因素产生积极影响。 因此，如果没有“面包屑”，那么用户将不愿意长时间研究该站点并迅速找到他们喜欢的部分。
主页导航
“主页”是用户在站点上迷路时将返回的页面。 如果没有这样的页面，那么最初的导航问题将使一些访问者离开该站点。 为了使“主页”页面执行更有用的任务，建议在其描述中添加主要类别或说明网站的整个结构。
对于在线商店，可以省略此菜单项。
网站文章内部没有导航
对于大型博客文章，您需要自己的导航。 要准备它，执行两个操作就足够了：
- 安装一个插件，该插件将自动根据文章的子标题形成内容。 该内容将显示在文章的开头，在其帮助下，用户将能够立即开始从所需部分开始阅读。
- 添加“向上”按钮，这将使您能够快速从任何部分移回内容。
如果文章很小并且适合3-5个滚动屏幕，则无需添加导航。 用户将迅速找到正确的材料。
正式导航
导航是一种有助于清理网站的工具。 如果导航困难或不合逻辑，这将阻止用户完全浏览站点并执行必要的转换操作：进行购买，留下电话号码或订阅新闻。
类别排序不正确的菜单在下面发布：主要部分未突出显示，辅助类别未结构化。
形式导航的另一个常见错误是职位重复。 这是在“附件”部分中可以找到“附件”类别的时候。 必须消除这种巧合，并且不要使用户感到困惑。
在部分和类别中使用“附件”时重复菜单项的示例。
另外，请不要忘记确保所有页面都具有第一级菜单。 如果不添加它，将无法在类别之间快速切换并浏览不同的产品。
没有顶级菜单的产品目录示例。 用户没有机会单击一次去选择另一个类别。
要进行正确的导航-请让自己对这个网站一无所知的新手穿上鞋子。 现在问一个问题：这样的新手可以迅速在已发布的菜单项之间移动并找到必要的信息吗？ 如果答案是否定的，则应重新设计导航链。
清仓
设计不当
设计是一种视觉图像，可以吸引观众并简化与站点的交互。 质量设计就是做到这一点。 构思不当，过时或过度创意的设计会降低所有转化指标，需要立即修复。
非专业设计的一个例子。 在这里，一切都混合在一个堆中，并充满了红色背景。
创意设计的问题在于很难创建。 因此，如果对您的想法有疑问，最好是让整个目标受众都可以理解的简单设计技术。
当过滤器系统不被视为过滤器时的创意设计示例。
只有为此设计付费的网站所有者才能欣赏复杂设计的美感。 如果页面没有吸引眼球，并且所有内容都清晰地排列在页面上，那么这对用户来说就足够了。 剩下的就是多余的。
复杂设计的一个例子，当通常的商品标题变成重新设计时。 从点击图中，我们看到用户在这里不了解与相应图标进行交互的可能性。
高质量的设计不必昂贵而笨重。 如果将简单的简约风格与优质服务搭配在一起，那么就足以吸引忠实的受众。 会有满意的听众→销售量将增加→专业设计将会出现。
不方便的文字栏
文本应占据页面宽度的60-70％。 如果页边距很窄，则文本会拉长并变成不可读的垂直纸。 如果使用最大宽度，则不可读的纸张将水平拉伸。 将衬线字体添加到拉伸文本时，将导致完全失败。 考虑用户，不要造成不必要的麻烦。
不成比例的图像
在网站上，所有视觉设计应采用相同的样式。 重音元素是可以接受的，但是必须对其进行整洁的设计，并且用户必须理解它们。 例如，如果您要描述某人的产品，则可以在文章中插入不同比例和比例的图像-读者了解这与一种产品的不同属性有关。 同时，无法更改商品总目录中的比例-在这里，没有其他注释，尚不清楚某些图像与其他图像有何不同。
标头中图像过高的示例。 要获取内容-您需要滚动页面。 通过将盖子的高度减少50-70％可以解决该问题。
通常，在自适应布局中会出现比例问题。 因此，重要的是要在尽可能多的设备上测试设计。
网站的移动版本中元素分配不正确的示例。 第一个图像从目录中删除，看起来比其余图像大。
不成比例的图像会造成混乱和缺乏专业感。 因此，当其中一个用户注意这一点时，下一次他将在该站点上购物而没有此类问题。
文字和背景不兼容
理想的选择是在白色背景上的黑色文本。 大致相同的效果是在黑色背景上显示白色文本。 您可以合并彼此不会合并的其他颜色，并可以轻松地从站点中读取信息。 如果所有内容一目了然，那么您选择了正确的文本和背景。
如果您没有特殊的设计任务，请在白色背景上选择黑色文本。 不必只是为了美丽而玩花-最好将时间花在制作内容上。 用户一定会感激的。
插图中可读性差的示例。
需要特别注意的是，您需要采用自适应布局进行文本和背景实验。 在移动设备上，信息更难考虑，因此，必须非常谨慎地选择颜色。
自适应布局中不可读文本的示例。
如果出于某种原因，黑色文本和白色背景形式的经典文字不适合您，请记住以下细微差别：不同的小工具具有不同的颜色。 如果您的计算机上一切正常，这并不意味着使用Android智能手机的用户将具有类似的可读性。
原始文字设计
没有用户对阅读没有视觉注意力控制元素的纯文本画布感兴趣：段落，子标题，列表，图像以及带有重要信息的单个块。 眼睛什么都不会粘住，所以即使它很好，也不太可能被读取。
这是一个无聊的文本表。
文字设计并不是增加转换率的神奇工具。只是在他的帮助下，吸引更多目标受众的机会增加了。设计的文字。如果该站点专门发布复杂的专家文章，而没有人在所选主题上与您竞争，那么也许不需要文本设计。您是意见的领袖，您无需浪费时间进行注册。在所有其他情况下，该设计将有助于提高每篇文章的转换率。在界面元素中创造性地使用链接
所有链接都应该可见。如果这没有发生，那么用户将很难进入推荐页面并延长在该网站上花费的时间。否则，可能由于某人无意中点击了隐藏的链接而生气，因为他被迫观看他未选择的内容。因此，该界面不应具有创造性，并将链接变成一个谜。在文本和元素中非典型使用链接的示例。该图标未与文本结合使用，因此单击该图标不会导致过渡到新页面。使用界面中的链接时，记住两点很重要：用户必须了解链接在他的前面，并且他必须知道此链接的位置。第一个时刻取决于正确的视觉设计，第二个时刻通常必须使用其他工具提示。不良的配色方案
颜色是任何设计的重要组成部分。颜色会影响心情，并使网站访问者可以方便地研究所提供的内容。如果配色方案选择不当，那么即使是在高质量的内容上，您也会收到很多负面反馈。反之亦然：如果很高兴能出现在网站上，那么用户将原谅一些小错误。如果您打算设计一个有吸引力的颜色站点，请阅读基本的颜色课程。概括起来，有许多细微差别。选择配色方案时，请组织一个焦点小组，并尝试找出成功实施了哪些解决方案以及需要改进的解决方案。色彩算术课程。如果您对研究色彩和了解配色方案不感兴趣，请在网站上保留白色背景。这是由Apple使用的，一切都与客户保持秩序。广告过多
现代用户使用内置的雷达探测器浏览站点，而该雷达探测器忽略了已发布的广告。因此，包含一个和十个横幅广告的文章将产生大致相同的效果。同时，带有一个横幅广告的文章不会令人讨厌，因为它以一种不引人注目的方式谈论某些有用的服务。带有十个标语的文章会引起厌恶，并带来作者正在努力将广告产品带给读者的感觉。因此，如果您希望减少批评，请提供诚实的广告并投入大量精力。未实施的号召性用语
号召性用语是促销优惠的最后一部分，可以在讨论交易条款之后与握手进行比较。因此，任何广告中都应该有一个号召性用语，并且必须正确设计。呼吁行动不力的标语示例。如果没有号召性用语，那么部分受众将不会决定购买还是将其转移到其他时间。这是您易于修复的缺陷。行动不力的例子。在按钮，横幅或文本中都没有清晰的句子。通常，以订阅的形式不会轻易发出号召性用语。用户很少使用此表单，即使将其放置在最显眼的位置也是如此。订阅表单中的弱草稿示例。有时，将网站翻译成自适应版本后，号召性用语会消失。这是一个技术问题，需要及时发现并解决。站点的自适应版本中损坏的呼叫的示例。号召性用语只有与横幅图像配对时才能很好地工作。一个没有另一个会产生较弱的影响，并且常常不被注意。没有采取行动和明确建议的标语示例。呼吁采取行动-令人信服和清晰。另外，请确保通话符合广告横幅的图像。没有这个，一些客户将在其他站点下订单。不合格图片
大多数用户开始通过查看图像来浏览内容。因此，重要的是要确保这些图像清晰，精心制作并符合已出版材料的主题。这形成了一个整体的故事，在此基础上，用户很容易做出购买决定。低质量产品照片的示例。为了快速提高图像质量-购买便携式的中文立方体进行主题拍摄（装箱）。这是一种廉价的配件，可提供您在线商店品牌的所有图像。插图丢失或过多
您已经知道，根据高质量的插图，用户可以决定购买商品。因此，如果您要卖东西，那么至少应该有一张图片。同时，如果插图过多，可能会使页面超载并吓跑一些用户。为避免这种情况，请将插图与视频结合起来。例如，从主要角度为产品拍照，并在页面上添加视频评论，其中将涉及包装和在不同情况下使用产品的场景。做得不好的社交媒体按钮
如果社交网络的按钮设计不正确或看起来凌乱，那么许多用户将不会单击它们，也不会继续了解您在社交平台上的内容。为了避免这种情况-布置精美。带有过时的instagram小部件的社交网络按钮设计不当的示例。除了视觉上的吸引力之外，通过社交网络的按钮，经常还会出现另外两个问题。第一个问题与导致按钮不可单击的任何技术故障有关。您将无法确保自己不会遭受此类失败的侵害，因此，您需要定期测试该网站的所有可点击元素的性能。第二个问题可能是由于选择了社交网络而不考虑观众的利益这一事实引起的。例如，如果您的大多数读者都使用Telegram，而您不使用此Messenger，则将造成流量损失。在这种情况下，您需要纠正这种情况或忍受损失。市场行销
没有明确的主要网站报价
该网站的主要报价是您的资源专门研究的主题。这是用户在停留在网站的前三秒中应该考虑的主要建议。出售使用过的Apple设备-在主页上放置包含可用小工具的目录，并在其他页面上创建博客或发布新闻。相反，这样做是不希望的，因为这样做会失去网站主要报价的清晰度。如果主要建议不明显，那么一些用户将一无所知，无法与竞争对手购物。缺乏担保
保证表示卖方对产品充满信心，可以保证其质量。以两家在线商店为例，2018 MacBook Air的售价为1900美元。第一家商店没有担保，第二家商店的保修期为12个月。在这种情况下，大多数用户会在第二家在线商店购买商品。2018年的MacBook Air就是产品的示例，它将在所有在线商店中以大致相同的价格出售。具有最佳保证的网站将赢得竞争。如果您出售一次性或易腐商品，则最有可能对它们签发保证书将不起作用。在这种情况下，没有什么可以阻止您提出等效的替代方案。例如，在一家销售鲜花的企业中，您可以为常规客户实施免费送货或资助折扣系统。出售复杂物品而无提示
如果您提供的设备中的任何技术产品都比cheburek复杂，那么您需要在网站上提供提示。甚至在理论上用户可能会遇到困难的所有概念也应及时提示。请记住从文章开头的Vasya，他对幻像功能一无所知，由于缺乏线索，在线商店失去了一个固定的客户。如有疑问，请提示或不提示。对于那些了解该主题的人来说，这不会有什么坏处，但是有兴趣的新手会有所帮助。没有管理员的在线聊天
任何产品的销售都与细微差别相关联，细微差别无法借助编程聊天机器人来揭示，该机器人能够分发常见问题的答案。一个有生命的人-经理应该谈论这些细微差别。如果其中一位用户有问题，而您的站点没有现场顾问，则几乎总是将订单留在该顾问工作的地方。另外，当经理与感兴趣的用户进行实时沟通时，他有机会通过推荐相关产品来提高平均支票价格。适用于每四个买家。没有可用商品数量的信息
想象一下这种情况：一家大型IT公司开设了一个新办事处，并在其中购买了四万两千台Dell P2418D显示器。 IT公司的代表转到在线商店的网站→下订单→收到表明确切交货时间的发票，并从此期间开始，向员工宣布新办公室的工作开始日期。如果公司需要四十二台Dell P2418D显示器，那么对他们来说很重要的一点是，知道他们是否可以在一处购买如此数量的商品。通常批发购买便宜。第二天，在线商店的经理开始收集订单，结果表明仓库中没有指定数量的显示器：您需要四十个显示器，但只有十个。经理回电给客户，并宣布问题。 IT公司的代表取消了订单，因为他具有公司标准，该公司的规则仅允许使用指定类型的监视器。此外，提早离职的员工每天上班都必须支付罚款，并且由于缺少监视器而无法履行职责。很容易猜到，该公司的违规在线商店将不再有单个订单。我们的示例牵强附会，但它显示了有关可用商品数量信息的重要性。在您自己的网站上设计产品卡时，请记住这一点。没有有关付款和付款方式的数据。
运营商的关税加上支付服务佣金，可以使订单的初始费用增加15％：他们选择了商品价格为100美元→收到了115美元的付款。因此，规定在线商店支持的所有交付服务和所有支付系统非常重要：- 如果选择很大，那么用户将能够选择最佳的资费和交货时间。您可以多付钱并更快地获得商品，反之亦然-等待更长的时间即可保存。
- 如果没有选择或选择有限，那么用户将事先了解佣金，并且在收货时不会提出索赔。
在线商店所有者的任务是详细告知用户，他们将独立决定下一步要做什么。如果没有必要的信息，那么就有失去常规客户的机会。没有确认电子邮件
用户通常会丢失有关该订单的信息，而承运商并不总是及时地警告其已收到订单。因此，在某些情况下，在线商店的所有者会失去客户并浪费承运商的运输成本。为避免这种情况，通过电子邮件复制每个订单就足够了。这样就不会有争执的理由。内容内容
语法问题
任何文本材料都应发布且没有错误和错别字。如果不这样做，可能会影响图像和用户对资源的信任。这里的逻辑是这样的：如果站点的所有者没有时间检查其文本，那么他们将在哪里找到高质量执行客户订单的时间。在此值得一提重要的注意事项：即使是大型出版社也不容易避免错别字，因为每个提案都需要经过大量校对人员的双重检查。因此，语法错误是不可避免的，要解决此问题，您需要执行两项任务：在发布之前对内容进行多次检查，并遵循评论，用户会批评您的材料为不雅的提交。在评论中看到了批评-感谢评论者并编辑文本。信息过时
, . , .
, : 100 $, 200 $. , , .
如果由于某种原因无法快速更新信息，请暂时关闭包含不相关数据的页面，并在其位置发布经理的联系人。让经理与客户沟通并进行口头咨询。文字博客内容不佳
— , . , , . , , : → → → → . .
, . , .
« » «»
« » — , . , . « » , .
« » — : , , , , .
“联系人”页面是所有要在网站上下订单或指定信息的用户将去的地方。如果他们没有机会这样做，那么他们将简单地找到竞争对手的所有答案。产品和/或类别页面过长
如果您正在准备博客材料，则页面的数量和长度没有限制。根据需要编写。最主要的是，这篇文章对读者很有用。如果页面上有购买产品的要约，则此处不适合使用长页面格式：用户会感到疲倦，不要修剪页面，失去兴趣并且什么也不买。结果，只有那些用户会购买而没有说明。产品报价页面太长。根据页面的滚动分析，我们看到这里的滚动深度很小。出售复杂的多组分产品的所有情况都是例外，其中每个部分都需要详细说明。在这种情况下，页面可能会超载信息，并且长度不限。没有页面，但没有产品描述
如果网上商店仓促启动，那么其许多页面将保持空白。最好的情况是有照片，最短的是特性，价格和电话清单，最坏的情况是什么也没有。如果没有产品说明，则访客很难理解他面前的东西以及为什么值得购买。在这种情况下，即使价格低廉，您的潜在客户也将尝试转移到已安排好站点并详细讨论其产品的竞争对手。产品卡页面上缺少描述。在某些情况下，整个文字描述可能会被视频评论所取代。但是，即使有视频，您也需要添加一个简短的主要特征列表：用户将看到视频评论→通过文字描述将通过要点→做出购买决定。没有文本备忘单，做出决定就更加困难。产品卡结构不一致
产品卡-这是在线商店的页面之一，其中介绍了所售商品的所有特征。经过深思熟虑的产品卡包括两个版本：简短版本和扩展版本。简要卡仅列出最流行和最重要的特征，并根据这些特征选择用户。扩展卡指示有关该产品的所有技术数据。如果卡的结构不正确，则仅限于简要说明或扩展说明。如果仅提供简短说明，这将淘汰对细节感兴趣的有经验的用户。如果仅提供扩展说明，则初学者会离开，他们会害怕细节。缺少标题和副标题
标题和子标题一次执行几个重要的功能：它们告诉文本内容以及该文本中所需信息的位置。: , . , . . — .
在Internet上，大多数文本都是对角阅读的，阅读的重点是标题和副标题。如果您不考虑而强迫他们讲故事，您可能会很快失去访问者。如果读者没有充分的理由来研究您的内容，那么如果没有沉思的标题和副标题，他将不会这样做：关闭页面总是比理解页面内容容易。因此，在设计文章时，请始终考虑对角线阅读。伪装有用的内容
如果用户在对角线阅读后决定学习您的文章，那么他首先将注意第一段。整篇文章的主要思想应在本段中发布。如果这没有发生，那么很大一部分用户将离开并且将不会观看剩余的文本。尝试始终在第一段中指出要点。之后添加参数。如果您做相反的事情，转换将减少。忽略清单
该列表是一个执行两个功能的工具：它有助于组织同类信息，并简化网站上的阅读文章。如果用户看到该列表并了解他在说什么，则无需阅读此列表。如果没有列表，那么您将必须阅读所有内容。不要忽略列表，并将其添加到列出多个同类实体的位置。如果顺序很重要，请使用编号列表。在所有其他情况下，您都可以使用项目符号列表。接下来是什么
步骤编号1。下载带有列出的设计和可用性错误的清单。步骤编号2。检查您的站点并标记所有需要改进的地方。步骤编号3。解决指出的问题并衡量网站的转换。您个人遇到设计和可用性方面的错误吗？在评论中分享您的经验。
由Plerdy.com首席执行官Andrei Chorny发布