欢迎光临智唯网络,我们是一家专注中小型企业网站建设、营销型网站建设、响应式网站建设公司

咨询热线:0757 81089123
广州建站微信号
返回旧版
网站设计News
公司网站建设

网页按钮设计总结

关键词:广州建站 作者:智唯建站 | VISITORS: | 来源:智唯网络科技
08Sep
2017
按钮是互动设计的常见元素。,是最重要的UI元素之一。在今天的文章中,我们将介绍您了解基本知识,以创建有效的按钮操作来改善用户体验。1.使按钮看起来像个按钮链接用户如何理

按钮是互动设计的常见元素。,是最重要的UI元素之一。在今天的文章中,我们将介绍您了解基本知识,以创建有效的按钮操作来改善用户体验。

1.使按钮看起来像个"按钮链接"

用户如何理解元素是一个按钮? 答案很简单:视觉提示可帮助人们确定可点击性。 在可点击元素上使用适当的视觉符号来使它们看起来像按钮很重要。1.1形状根据站或应用程序的风格,基本可以确定按钮的形状。其中 矩形按钮早已被引入数字世界,用户也已经非常熟悉。

Image title

当然,您可以更具创意,并使用其他形状(圆形,三角形或甚至自定义形状),但请记住,独特的想法可能被证明有点冒险。 您需要确保人们可以轻松识别每个不同形状的按钮。

Image title

无论您选择何种形状,请确保在整个界面控件中保持一致性,以便用户能够识别所有UI元素作为按钮。为什么一致性如此重要? 因为用户会有意识无意识的记住细节。 例如,用户将特定元素的形状与“按钮”相关联。因此,一致性不仅有助于创造出美观的设计,而且还为用户提供了更加熟悉的体验。下图显示了这一点。 在应用程序的一部分(例如系统工具栏)中使用三种不同的形状不仅使用户感到困惑,这是不正确的设计实践。

Image title

创意没有错,但是保持设计一致同样重要。1.2阴影和亮点阴影是有价值的线索,告诉用户他们正在寻找哪个UI元素。阴影使得元素脱离背景,使其容易识别为可点击或可点击的元素,因为出现的对象看起来像被压下的(点击或点击)。 即使是扁平的按钮(几乎平坦,准确),仍然有这些微妙的线索的地方。

Image title

如果一个按钮投射一个微妙的阴影,用户往往会明白元素是交互式的。

2.明确标签按钮

避免用户界面元素没有明确的含义。 因此,UI中的每个按钮都应该有一个正确的标签或图标。2.1清除和标记标签可操作的界面元素(例如按钮)上的标签应该总是绑定到用户将执行的操作。 当用户了解按钮的动作时,用户会感到更舒服。 诸如“提交”之类的模糊标签或像下面的示例中的抽象标签不能提供足够的关于该操作的信息。

Image title

操作按钮应该确认该任务是什么,以便用户知道他们点击该按钮时会发生什么。 使用动作动词来表示按钮的作用很重要。 例如,如果用户注册了一个帐户,则会显示“创建帐户”按钮,告诉他们按下按钮后会产生什么结果。 这个任务很清楚和具体。 这些明确的标签可以作为即时帮助,使用户有信心选择正确的操作。

Image title

3.放置用户可以找到的按钮

不要让用户寻找按钮; 放置按钮,用户可以轻松找到它们或期望看到它们。3.1位置和顺序如果您正在设计一个应用程序,则在选择适当的位置和按钮顺序时,应遵循平台GUI指南。 为什么? 因为遵循用户期望的一致设计可以节省人们的时间。

Image title

在基于网络的应用程序的情况下,您应该考虑哪个布局真的对您的用户最有效。 确定这一点的正确方法是通过测试。如果您设计移动导航,请注意按钮位置的最佳做法。 文章底部导航设计的黄金规则涵盖了这个主题。

4.使用户轻松地与按钮进行交互

按钮的大小和视觉反馈,在帮助用户与他们交互方面发挥关键作用。4.1尺寸和填充色您应该考虑一个按钮与页面上其他元素的关系有多大。 同时,您需要确保您设计的按钮足够大,以便人们进行互动。

Image title

当点按作为您的应用程序或站点的主要输入方法时,您可以依靠MIT Touch Lab研究来选择适当的按钮大小。 这项研究发现,手指垫的平均尺寸在10-14mm之间,指尖为8-10mm,使得10mm×10mm具有良好的最小触摸目标尺寸。 当鼠标和键盘是主要的输入方法时,可以稍微减小按钮测量以适应密集的UI。

Image title

您应该考虑按钮元素的大小,以及可点击元素之间的填充,因为填充有助于分离控件,并为您的用户界面提供足够的呼吸空间。

Image title
关于网站制作,看看客户怎么说
***(匿名) 评价文章 广州大型网站制作公司竞争优势在哪里?

广州大型网站制作公司哪家好?哪家网络公司建站有优势?...

***(匿名) 评价文章 佛山大型网站制作公司在开发的时候需要做什么

大型网站制作公司 在进行相应工作的时候是非常专业的,里面的每一个步骤都经过了很多年的检验,事实证明,这样的一些步骤非常有存在的必要,毕竟这样的一家公司已经有了...

***(匿名) 评价文章 签约广州锐狮时代视觉创意公司网站制作服务

2016年6月,我司成功签约广州锐狮时代视觉创意机构公司,非常感谢锐狮时代视觉创意机构对智唯网络的支持。 广州锐狮时代视觉创意机构是专注于高品质影视广告、MV、电视广...

公司网站建设
Hi,Are you ready?
准备好开始了吗?
那就与我们取得联系吧

广州建站 感恩回馈

咨询送礼现在提交,将获得智唯网络策划专家免费为您制作
价值5880元《全网营销方案+优化视频教程》一份!
下单送礼感恩七周年,新老用户下单即送创业型空间+域名等大礼
24小时免费咨询热线0757-8108-9123
合作意向表
您需要的服务
您最关注的地方
预算
  • 验证码

直接咨询