网页按钮制作的视觉表现 如何设计重量级网页按钮

魚兒
魚兒 这家伙很懒,还没有设置简介...

0 人点赞了该文章 · 17 浏览

网页按钮制作的视觉表现 如何设计重量级网页按钮

    当你在进行网页浏览的时候,都会去点击相应的按钮来浏览自己所需要的内容。说起网页按钮,不得不先提一下链接,因为在大部分人看来,似乎网页按钮与链接差不多,都是完成一个页面的跳转。其实不然,按钮与链接还是有一定的区别。
    以下人理解的按钮:有一个外框(这个框可以是任何几何形体,比如方、圆、椭圆等等),再上面有一些文字(比如:下载、注册、充值、搜索、登录,抽奖等等),满足了这两个基本条件的,大家就认为是按钮,按钮的本质特点就是可以点击,因此要使用链接,来进行导向。
    当前在页面里要强调的链接自然会以网页按钮的形式表现,尤其所谓重量级网页按钮是促成观者完成页面功能的一个很重要的部分,所以对于其本身来讲,应该具有“勾引眼球”的效果。对于一个可以起到“勾引”作用的网页按钮制作,建议从下面几个方面来思考。
    1.按钮的位置
    按钮的位置也需要仔细考究,基本原则是要容易找到,特别重要的按钮应该处在画面的中心位置。
    2.按钮本身的用色
    本身的颜色应该区别于它周边的环境色,因此它要更亮而且有高对比度的颜色。
    3.按钮上面的文字表述
    在按钮上使用什么文字传递给用户非常重要。需要言简意赅,直接明了,如:注册、下载、创建、免费试玩等,甚至有时候用“点击进入”,这一点上就是千万不要让观者去思考,越简单、越直接越好。
    4.按钮的尺寸
    通常来讲,一个页面当中按钮的大小也决定了其本身的重要级别,但也不是越大越好,尺寸应该适中,因为按钮大到一定程度,会让人觉得那不像按钮,潜意识的认为那是一块区域,导致没有点击欲望。
    5.注意鼠标滑过的效果
    给予较为重要的按钮适当加一些鼠标滑过的效果,会有力的增强网页按钮的点击感,给用户带来良好的用户体验,起到画龙点睛的作用。这里要注意的是,不太适合按钮集中的地方,每个都增加高亮的鼠标滑过的效果,这样会造成视觉过于杂乱,影响用户浏览的舒适度,所以要强调的是“恰当”地添加鼠标滑过的效果。
    6.让其充分通透
    你的按钮不能和网页中的其他元素挤在一起。它需要充足的margin才能更加突出,也需要更多的padding才能让文字更容易阅读。
    设计师在平常的工作当中,经常会遇到一些网页按钮修改的意见,时不时听到产品人员提到“让这个按钮更像个按钮”,面对这样的问题,不防从上面的6个方向去思考与改进。
    其实在我们平常的设计当中有很多重量级不那么高的按钮,需要“低调”处理,也就是说在一个页面当中,众多的按钮,是有功能优先级别的,这样就务必让一堆按钮也呈现出视觉的优先级别。如下面的图片,右边的按钮群除了大小、位置区分了优先级之外,很重要的一点是色块的区分,高饱和色块的按钮群是不建议存在的。高饱和色调的应用往往是为了突出重点,而非强调整体,所以这种局面的处理方式建议用众多的低饱和色调来衬托小部分高饱和的重点信息。
    因此,要让自己的网页按钮能够吸引大众眼球,就必须要做到以上的几个方面,让自己网页的整体达到最佳的效果。

发布于 2022-09-29 17:06

免责声明:

本文由 魚兒 原创或收集发布于 火鲤鱼 ,著作权归作者所有,如有侵权可联系本站删除。

火鲤鱼 © 2026 专注小微企业服务 冀ICP备09002609号-8