网站网页中按钮设计的注意知识点

按钮可能是你设计中最小的元素之一，但是千万不要忽视他们的存在，它们是组成一个完整、合理的网页设计的最重要的元素之一。如果在网站设计中缺少了按钮元素，你要通过什么途径与用户交流？他们又如何在反馈循环中提供信息？

一.展示位置是关键
在网页设计中应该在哪里设置按钮？有哪些位置可以帮助你产生更多点击次数？
在大多数情况下，按钮应该按照其设计的内容进行补充。
· 在表单的结尾；
· 在强调行动的用语消息右侧；
· 在页面或屏幕的底部；
· 居中在信息下方。
为什么偏偏使用这些位置作为展示？很简单，因为它遵循自然的行动路径和用户阅读和与网站交互的方式。
二.关于颜色
按钮的颜色需要在整个网站设计中特别注意。同时，这也是一个使用特定强调颜色的好地方，它只作用于按钮的操作。
按钮颜色应该是明亮且足够吸引人的。你很容易注意到，有许多设计使用包括黄色，蓝色或绿色的按钮设置，这么做基于一个原因——这些明亮的颜色很容易被注意到并和网页设计的其余部分分离开来。所以，如果你想要一个真正突出的按钮，你可以选择一种与设计中主色（在色轮上的对面）互补的颜色。
还有一种颜色你可以考虑，那就是使它和你的品牌色直接关联。无论你想要在设计中使用什么按钮颜色使它脱颖而出，它应该配合（至少不反对）你的整体网页设计的配色方案。
三.它看起来应该是可以点击（或可触发）的
设计师对于按钮的设计重点在于，如何使用户在你的网页设计中看到一个按钮，就马上意识到他们需要-um，或者说想要将鼠标移动到它的上面和触发它。虽然几乎任何尺寸的按钮都可以在屏幕上被点击到，但是在那些触摸式设备上使用按钮时，尺寸和填充就显得至关重要了。
一般的用户他们的指尖具有8-10毫米之间的有效触摸长度。考虑到这一点，10×10毫米的尺寸是触摸设备上按钮很好的起始目标大小。（比键盘上的标准键略小）。
以下我们提供几个小提示，希望他们可以帮助在你的网页设计中使你的按钮看起来是可触发的：
· 一个微妙的阴影设置可以“提升”元素和背景之间的层次感，使它感觉更接近用户；
· 在按钮周围增加填充使它们看起来更容易点击，同时也可以帮助引导用户注意到它；
· 通过变色的悬停效果或切换操作可以向用户展示他们正在做的实时操作。
四.更多关于尺寸的事
使用大尺寸的设计！
按钮需要有一些体积感以便让用户能够立即在屏幕上注意到它。现在出现一种模糊按钮的设计趋势——没有明显的按钮颜色轮廓，它的重点在于通过以大按钮的像素计数，但缺乏视觉重量和体积感。在尺寸方面，按钮需要在这两方面都很大才能起到提示作用。（这也是趋势已经脱离时尚的一个原因。）
如何在一个按钮是在刚好好的大小到大得让人觉得尴尬之间做一个界定是一个棘手的地方。当在你的网站设计中发生这种情况时，这要取决于其他设计元素的规模，如果你第一眼看上去整个网站设计都被按钮占满了视觉的话，那很有可能就是按钮调整过大了，不过一般出现上面的情况的时候你很容易就能发现。
五.使用标准形状
当涉及到按钮只有两个形状，你应该考虑：
· 圆形。由于material design和material lite的相关概念，圆形按钮已经变得很流行。它因为具有任何形式的美学，使得圆形按钮的设计更适合用户模式。
·矩形。此默认形状应该是所有按钮的“归宿”，除非你在上面的实例中使用圆圈。这是用户认知和习惯造成的。大多数矩形按钮趋向于至少两倍于高（有时三或四倍宽）。用户看到这种形状，立即知道该怎么做。虽然有些人可能会争辩圆角与90度角的优点，但根据你的设计风格也同样适用。
六.专注于对比
现在，你有了所有的设计元素，但还需要注意一点，对比度是一个重要的考虑元素。这是在元素内使用的真实的技术，但也和元素在设计中的位置和那些环境之间存在联系。
记住在这种双重环境中考虑以下技术：
· 配色；
· 字号和大小；
· 元素的大小；
· 形状，因为它涉及到背景；
· 透明度或动画；
· 阴影和渐变；
· 空格和填充。
七.告诉用户要做什么
每个按钮应该包括一个文本块，因为你至少需要一个版块告诉用户该按钮是做什么用的。你应该保持语言简短和简单，它应该匹配网站设计其余部分的语调和主题。
然后，就是履行承诺的过程了。下一个弹出的东西应该告诉用户他们已经到达预期的目的地。无论是提交表单，进行购买还是只是移动到另一个链接，用户应该通过与按钮交互来获得期望的结果。（如果没有，请确保在反馈回路中显示错误，以便你知道网站设计中需要进行哪些更正。）
按钮消息的示例包括：
· 点击这里；
· 立即创建帐户；
· 免费试用；
· 添加到购物车；
· 阅读更多。
八.给按钮一个高度的视觉体验的重要性
大多数网页设计都充满了小的ui元素。我们经常发生的一个错误是，直到网站设计项目接近完成时，我们才重新回到这些元素的设计上。
不要陷入这种危险的情况。
你要保证在你的网页设计中，按钮应该看起来像个按钮！设计中的任何其他东西都不应该具有与按钮相同的形状，颜色和视觉重量。他们需要不同。考虑为大于设计中任何其他类似元素的按钮创建样式，或者使用仅适用于按钮的颜色。这些技术可以帮助使按钮看起来特别，并强调其使用。
总结
通过上面的几个提示，你开始重新思考为你的网页设计更新按钮设计了吗？你认为你可以创造更好的样式鼓励用户点击吗？

大胆的尝试上面的其中一些提示，同时注意分析你的网站设计，以准确地了解你的用户群响应的设计更改。

成都创新互联科技网站制作我们更专业! 网址：www.cdcxhl.com 联系电话:135-1821-9792

网页名称：网站网页中按钮设计的注意知识点
文章出自：https://www.cdcxhl.com/news/106557.html

成都网站建设公司_创新互联，为您提供用户体验、建站公司、全网营销推广、定制网站、静态网站、微信小程序

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联