四个步骤实现层级清晰的导航栏

【编者按】本文作者为 Wes McDowell,主要介绍通过四个步骤实现层级清晰的导航栏,进而提高网站的转化率。文章系国内 ITOM 管理平台 OneAPM 编译呈现。

精心规划的导航策略可以成就一个网站,反之,则可能毁了一个。规划得好,网站访客就会顺着你安排的路径走下去,要么购买你的商品、成为你的潜在客户,要么填完网站咨询表单。

规划得不好,访客们就会在网站上随意游荡。他们有可能达成你的目的,也可能不会。何必冒险呢?

出色的用户体验是不应该如此随意地对待客户转化问题的——我们应当手把手地指导用户,给出能吸引他们注意的、明确的提示。这样,他们才能找到自己想找的东西,同时你也能获得自己想要的东西——客户转化。

在本文中,笔者将向你介绍一个简单的、提升转化率的策略,它适用于所有网站。

只要使用得当,你交付的网站不仅美观大方,还能帮客户实现他们的商业目标。

也就是说,你是他们的大英雄。

第一步:着陆页策略

我们知道对2016年的网络营销来说,每个网站都应当配有着陆页,这是转化策略的一部分。如果你打算重新设计你的网站,这一步并不要求你删掉已有的页面,而是增加一些内容。

你需要建立一个信息齐全的页面,这个页面应当囊括了刺激转化所需的所有内容。着陆页的数量不定,取决于具体的业务和目标。为了简便,我们用私人作品网站为例。

假设你提供网页设计和商标设计两种服务,那么在你的作品网站上,除了简单的作品集页面,还应当建立两个全新的着陆页——每一个着陆页对应一种业务。在各个着陆页上,你可以放上重点作品、有说服力的销售文案、服务特点列表、客户推荐信、以及清晰的行为召唤(CTA)按钮。

着陆页存在的原因是:客户无需在不同页面之间来回切换,而可以在一个页面上看到所有信息。如此一来,你的销售漏斗将更加成功,同时,因为省去了切换环节,客户也不会再半途放弃。

第二步:重点放在可以“生利”的页面

除了着陆页以外,是否还需要一些别的页面来刺激转化?例如一个专门放客户推荐信的页面?或者是其他服务项目的介绍?

如果你觉得需要的话,那么你有以下几种选择:

相关链接

在着陆页的正文中插入链接,可以有效地引导客户走向预设的方向。假设你的着陆页上有一些案例分析,那么可以在案例的下方加入相关链接,引导客户前往查看更多案例。

精简的标题导航栏

另一个方案是,做一个精简的标题导航栏,指向两三个最常用的页面。还是以作品网站为例,你可以把那两个着陆页都放到标题导航栏里,这样访客就可以在不同服务之间来回切换。

理想状态下,标题栏应当是“静止的”,即使用户滚动页面,标题栏仍会保持原位。

第三步:弱化其它内容

你听说过“选择疲劳”吗?它的意思是,当人们面临太多选择时,往往更不可能采取任何行动。有个著名的果酱试验阐释了这一概念。

研究人员在一家食品店的小货架上放了五种果酱。路过的人们会停下来看一眼,其中大部分人会购买一种果酱。之后,研究人员不断增加果酱的品种,直至三十种之多。人们还是会停下看看,折服于如此之多的选择,然后就走开了。

我们不想这种情况出现在网站上。如果导航栏有太多的选择,访客们就没有一条清晰的路径,于是干脆离开。我们可以这样解决这个问题:

所有其它页面的链接都不应出现在主要选项中。 我们可以把它们放在次级导航中。

你可以随意处理次级导航。既可以把它们放在不那么重要的位置,(例如页脚上方,)或者把它们放在一个会自动隐藏的侧边栏菜单中,访客可以点击菜单按钮来访问。

是的,我知道这个问题是用户体验专家们争论的焦点。有很多人非常讨厌隐藏式导航,认为它为用户的使用创造了一个障碍。但是请记住:你的着陆页以及主要的导航项,应当足以刺激转化了。次级页面只是为那些想要寻找它们的访客而准备的。

消除了那些不重要的选项,(或者至少弱化了它们),访客们将会拥有一条更为清晰的路径。从任何角度来说,这都是不错的用户体验。

第四步:设置你的CTA(行为召唤)按钮

清晰、明确的CTA代表着网站的所有目的。

还是以作品网站为例,假设你的最终目标是让潜在客户填写一份表格,定下一个咨询时间。一旦想清楚了这一点,你一定会想把这个链接放在最显眼的地方。

除了放在着陆页的正文位置,笔者建议还可以在标题导航栏再放一个。

但是,为了使它有别于其他导航选项,你可以把它做成一个按钮。这样更具视觉冲击。如果它的颜色是亮丽的流行色系,那突出效果将更佳。

整体效果

一旦完成了上述步骤,你就完成了层次清晰的导航设计,你的导航就会变得非常有层级:

  1. 最重要的:CTA按钮

  2. 第二重要的:主导航栏选项

  3. 不太重要的:隐藏的或弱化的次级导航选项

一旦建立了这样的层级关系,由于突出了CTA,并且辅以其他的主要导航选项,网站的转化率将会全面提升。

其他的那些对于转化帮助不大的元素都可以隐藏起来,以免访客分心。

总结

作为一名网页设计师,我们的首要任务就是帮助客户最大化他们的营销工具——网站——可能带来的优势。当我们的网站拥有一条明晰的路径,直通更高的转化率,就能够促成客户的成功。这种附加价值往往会让我们从其他设计师中脱颖而出,进而找到更优质、愿意投入更多经费的客户。

网站的美观固然重要,但毕竟,能带来更高的转化率,才是决胜的大必杀。

本文系 OneAPM 工程师编译整理。OneAPM Browser Insight 是一个基于真实用户的 Web 前端性能监控平台,能帮助大家定位网站性能瓶颈,实现网站加速效果可视化;支持浏览器、微信、App 浏览 HTML 和 HTML5 页面。想阅读更多技术文章,请访问 OneAPM 官方技术博客

本文转自 OneAPM 官方博客

原文地址:https://www.sitepoint.com/how-to-boost-conversions-with-prioritized-navigation/

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,189评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,577评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,857评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,703评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,705评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,620评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,995评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,656评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,898评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,639评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,720评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,395评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,982评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,953评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,195评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,907评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,472评论 2 342

推荐阅读更多精彩内容

  • 中国互联网用户群已经成为世界最大的互联网群体。与此同时,中国互联网网站的发展也历经了几个阶段,从单纯的网络媒体到现...
    零一间阅读 4,225评论 1 41
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,424评论 25 707
  • 颈椎不舒服,早早回来,一觉睡到现在,天竟已黑了,大猪也不在家,没有什么事情在计划中必须干,索性就这么躺着,真是无...
    豆子之不爱那么多阅读 416评论 1 2
  • 月光下的踯躅 踮起脚尖 心跳为奏 想成一位 粉红的少女 没有鲜花簇拥 只作孤高的野草 走向阳光 ...
    沉默功夫阅读 215评论 0 1
  • 文 | 厦九九 01 越长大越孤单,谁长大谁知道。很多事没有来日方长,很多人只会乍然离场。 相遇怎样都美好,时光和...
    厦九九阅读 4,250评论 7 16