当前位置:首页 > 新闻中心 > 互联网动态
网页设计中吸引用户注意力的5个技巧责任编辑 :李飞    文章来源 :星翼创想(www.iswweb.com)    发布时间 :2020-03-27    阅读次数:264     专题 :网站设计

网站内容的某些部分比其他部分更重要,这是事实,比如说,几乎可以肯定,“立即购买”按钮比整个“关于我们”页面更为重要,如果您确实希望进行这种销售,则需要相应地确定用户的关注重点。这就是深圳网站建设公司的小编这篇文章的原因:您可以将其称为控制焦点的新手指南。


  您将以一种自然的方式一步步构建网站。


  我的姐姐过去常常庄重而镇定地控制我的注意力,不管在什么地方,一天要跟我说15到40次:“回去写作业”。但是您的用户不会像单曲循环那样全神贯注地完成浏览您的网站,你需要做点什么来吸引他们。


  号召性用语(例如“购买”按钮)需要看起来不错。



  1.对比


  吸引眼球的第一个也是最简单的方法是使用对比度。“对比”是指设计的重要元素必须以有意义的方式与众不同。看看我在那里做什么?


  现在,讨论几种对比:


  ●亮/暗对比


  ●色彩对比


  ●尺寸对比


  ●风格对比


  其中大多数都是自我解释,但让我们仔细研究一下。


  光线暗


  明亮的事物与黑暗的事物脱颖而出,反之亦然。很简单,对吧?好吧...这取决于,如果您的网站大部分内容都很明亮,那么将号召性用语设置得又大又暗(或者至少比其他所有内容都暗些)。



光线暗的网页



  但是,有很多设计都具有高明暗对比,这是整个布局的特征,并且这种对比可以使所有东西都具有结构感。在这种情况下,您将需要使用另一种对比来引导人们的注意力。


  颜色


  这是不言自明的。光彩夺目的颜色,甚至只是不同的颜色,足以使事物脱颖而出。在此示例中,颜色用于消除大量排版干扰。



网页上的颜色



  尺寸


  使重要按钮大于其他按钮;使标题文字大于其他文字。大小对比不仅可以使事物脱颖而出,而且还有助于在页面中建立层次结构。



突出网页中重要按钮



  样式


  风格上的差异可以用我之前做过的粗体文字笑话来说明。但是,要看一个更注重UI的示例,我们来谈谈“Ghost按钮”。Ghost按钮是带有轮廓但没有背景色的按钮,通常与常规按钮结合使用,例如IndieGoGo的主页上:



网页样式



  我敢打赌,您可以说出他们真正要您单击哪个按钮。风格上的对比使这一点很清楚。



  2.图片


  无论我们是在谈论摄影,插图,绘画或3D图形,图像都能吸引眼球。您可以轻松地通过图片重定向任何人的注意力。唯一真正的例外是被其他图片包围的图片。


  当然,您可以将图像用作它们自己的焦点对象,但也可以使用它们来吸引其他事物,例如文本或放置在其上方的按钮。您不认为这些只是漂亮的背景,对吗?那可能是事情开始的方式,但是如今,一切都经过了更多的计算。


  如果您真的想全力以赴,请以图片指向的方式发出号召。这就是所谓的“协同作用”,尽管听起来听起来很有合作精神,但它往往会起作用。



网页上的背景图




  3.动画


  如果您认为我们喜欢图片,那么让我告诉您有关动态图片的信息。没错,但是,如果房间中没有其他有趣的事情发生,那么无论播放什么,我的眼睛都会无情地吸引着剩下的电视。可能是体育比赛,白天脱口秀,甚至是肥皂剧,我都很难将视线移开。我们大多数人都会。


  运动就是那样吸引眼球。它最初是作为生存反射,现在我们只需要知道Brian是否会重拾记忆并与Patricia结婚,或者她是否会永远被邪恶的双胞胎Drake困住。通过将一些动画效果融入按钮,有用的工具提示以及您真正希望人们首先阅读的任何文本等内容中,从而利用反射效果来发挥自己的优势。



动图网页示例




  4.惯例


  最后,利用用户的默认行为模式。作为网络用户,我们大多数人都受过训练,可以在顶部搜索导航,在其下方搜索号召性用语,在底部搜索更多的CTA。将重要的信息和功能放在人们期望找到的地方是一种完全有效的策略。


  还请记住,您是为从右到左还是从左到右阅读的人设计的。例如,说英语的人通常会首先看着屏幕的左侧。虽然有话要说打破常规,但不要低估简单却根深蒂固的习惯的力量。



利用用户习惯设计的网页



  5.少用重点


  当所有内容都是粗体时,粗体文本往往会模糊在一起,而不是将重要信息消耗到用户的大脑中。如果页面上有很多图片,并且您没有运行摄影作品集,则用户可能会分心。而且不要让我开始过度使用动画。当一切进展顺利时,您如何期望他们阅读长于一句话的任何文本?


  要将用户的注意力真正吸引并集中在一两件事上,您需要消除或至少不加强调可能吸引他们注意力的事物。与其他网站竞争,而不是与您自己的内容竞争。


文章转载请保留网址:http://www.iswweb.com/news/industry/2710.html