it-swarm.cn

可操作的表单元素大小

无论如何,我不是UI设计师。在过去的一两年中,我注意到许多网站上的重要按钮/链接...等等现在都具有很大的点击区域。我必须说我很感激,因为让光标如此采取行动是一种痛苦。我想说它现在可能与移动设备更相关,移动设备甚至可能是这些设计变更的驱动力。

因此,网页上的按钮/链接大小是否有经验法则?

8
rick schott

所有这些都是基于 菲茨定律 的,它为您提供了用户将光标移至按钮所需的平均时间。您可以在该主题上找到不同的文章,例如 适用于Web的Fitts UI律法 ,甚至 Jared Spool的播客

经验法则很容易:一个重要的按钮应该很大,以至于可以用拇指(您好,iPad)按一下它:-)

10
Kostya

这是iPhone的经验法则,来自 苹果公司的人机界面指南

创建高度至少为29像素的控件,并提供目标区域为44像素高。

这本书的更多内容 Tapworthy ,我实际上是在这里发现的。

但是,谈到iPhone点击目标时,又有多大呢?那么,指尖的大小是多少? Apple精确地将其固定在44像素处,并且该措施在整个标准iPhone控件中均可靠显示

5
Patrick McElhaney

没有太多的经验法则,因为越来越多的意识是,并非所有的互联网用户都具有专业的,专职的界面设计人员的敏捷性和敏捷性。早在1999/2000年,您就看到了很多“像素”设计,这些东西很小,并且使用8x8大的按钮。自从在2000年代史蒂夫·克鲁格(Steve Krug),凯西·塞拉(Kathy Sierra),37signals,雅各布·尼尔森(Jakob Nielsen)等人激发了可用性热潮以来,人们已经越来越意识到他们的应用程序和网站的可用性,并已开始相应地进行设计。

故事的另一方面是,屏幕和屏幕分辨率通常会越来越大。今天的平均值可能是1280x1024以上,而十年前,您会很幸运地在您的网站上找到1280x1024的访问者,因为大多数人的平均访问量仍在800x600左右。由于分辨率更大,因此屏幕上可以容纳更多像素,以前很容易看到的像素现在变得越来越小(因此很难单击)。

最后,基于触摸的设备的引入使许多开发人员开始认真考虑点击区域,因为与鼠标指针的极高精确度相比,它很难用像手指一样不精确的东西击中一个小目标。

所有这些更改可能会在某种程度上导致经验法则,但总的来说,您可以做的最好的事情就是确定访问该网站的受众类型,并根据他们是谁,他们使用的设备进行相应的设计使用以及其他元素,例如屏幕/窗口上有多少空间。

4
Rahul

在某种程度上,单击区域的大小相对于页面上的其他元素。我没有严格的标准,但是我通常发现我的按钮的高度至少为40px,文字大小通常至少为13px。我还认为,对于具有至少某些图形组件的导航和其他按钮,重要的是使整个区域都可单击,而不是仅单击文本。

0
Virtuosi Media