你可能有很好的内容要与你的网站访问者分享,但是如果你不帮他们找到这些内容,这些内容就等于不存在。这篇文章将帮助你计划网站的布局、结构、导航和措辞,使你的网站内容更有趣,减少混乱,具有更多的点击价值。
“值得点击”是什么意思?除了一般意义上的“值得点击和浏览/阅读”,还意味着用户可以很快找到你想要他们找到的信息,并且采取你想要他们采取的行动。
1. 从确认你的网站目标开始
在你开始做一个网站,甚至打开PS之前,请停下来问问自己:这个网站应该达到的目标是什么?”
比如说:
你是想增加网店的产品销售吗?
你是想让人们预约吗?
你是想让你的内容吸引更多的读者吗?
如果有上述不同目标的三个不同的企业主,他们应该建立三个截然不同类型的网站。他们为网站选择的布局、内容、结构,甚至技术都应该是不同的。
当你找到你的整体目标后,请像下面的列表所列的问题那样,研究更多、更深刻的问题。这里我再说一遍,你在想出这些重要问题的答案之前,不要开始动手开始做你的网站,寻找布景主题或规划出线框什么的。注意,下面不同的模拟问题答案,可以很大程度上地改变一个网站的设计:
模拟问题1:如果我的访问者访问我的网站时可以做一件事,并且只能做这一件事,我想让他们做的是什么?
模拟答案A:
-我想让他们在一个大的目录下找到一种产品,然后购买那种产品。
对比答案B:
-我希望人们能预约来见我。一旦他们来到我的办公室,销售基本上就可以确定了。
模拟问题2:我怎样才能帮助我的访客做那件事情?
模拟答案A:
-我的店有300种产品,我要把它们分成不同的类别,并允许用户过滤搜索他们正在寻找的产品类型。
-我要在一个非常明显的位置设置一个搜索栏。
-我要把购物车放在容易找到的地方。
-我要在我的主页上特别报道产品类别。
-我要我的访客不是优先关注谈论我的公司的网页设计,同时也并不全部忽略他们。
对比答案B:
-我的主页要有一个明确的号召来点击”明显位置”
-我会请人们在我的网站的每一页上填写预订表格,同时没有妨碍或阻止他们继续浏览网站的弹出窗口或干扰元素。
-我会确保我的预订表格不太长,这样人们不会因为填写表格而望而却步。
-我将用写得很好的网页详细描述我的服务,并且可以给有任何问题的人立即解释清楚。这样,我就可以排除不填写我的预订表格的任何理由。
-我会建一个服务之前和之后的图片库,这样人们会看到它,他们会发现,通过联系我,他们也可以得到同样的结果。
模拟问题3:当我的访客登陆我的网站时,我如何让他们知道他们“在哪里”,和“做些什么”,以及“为什么他们应该关注我的网站”?
模拟答案A:
-我要在我的logo下方有一个品牌口号,确切地说明我卖的是什么。这个标语不要卖弄或炫耀,使用双关语,或包含只对我有意义的文字。它将是很特殊的,甚至会替我打发走不想要我产品的用户。
-我的导航标签将按产品类别名称编制,这样人们就会知道在我的商店他们会寻找到什么。
对比答案B:
-我要放在我的主页顶部一个动词为主的介绍性标题,紧随其后的是一个简短的预告片,解释如果我填写预订表格人们会得到什么。
-我将使用强大的摄影和视频展示我的信誉,并且展示我能做些什么来帮助人们。
模拟问题4:我可以用一句话回答以上问题吗?
模拟答案A:
-挂件商店- X 挂件,Y挂件和Z挂件,免运费!
对比答案B:
-“现在预定获得X挂件绝对免费,我会额外附赠Y挂件!
-空间是有限的,但你不会后悔做这个预订,因为你会得到_______,并且将通过提高____________改变你的生活”。
当然,以上只是样本,而且还是过度简化的样本。在开始一个网站的设计之前,先要问几个问题。要真正实现网站目标,你还需要关注其他的事情,比如你的文案。这也是我们需要讨论的下一个问题。
2. 使用清晰、明确的文案
文案标题对网站的成败至关重要。为了确保你的标题、导航标签,甚至你的正文内容都足够明确,最好的方式是问问你自己:在另一个上下文中,你的话是否可能意味着别的东西?如果可能,那么这说明你表述得太模糊不清了。
继续这一思路,问问你自己:“一个15岁的人会理解我所做的或所出售的东西吗?如果有人登陆了我的网站,并且他对这个行业一无所知,如果我只使用像‘创新’,‘多元化’,‘战略’或‘行业’之类的词,他们会买它吗?”
“行业”包含了无数的公司和交易。“创新”和“战略”是过度炒作的词,不再有任何意义了。所有好的公司都有战略,所以他们都具有“战略性”。你应该知道我在说什么吧?
来看一个真实的例子,看看在谷歌的提示信息窗口上是如何描述这家公司的(摘自维基百科):
(图片上的部分文字:Ingersoll Rand Inc.是爱尔兰全球性多元化工业公司,成立于1871年。通过与Ingersoll Sergeant Drill 公司和RandDrill公司结合,1905年开始使用英格索兰(Ingersoll Rand)的名称。-维基百科)
如果你之前从来没有听说过这家公司,这个说明是不能帮助你了解他们是做什么的。你会了解到的是他们是爱尔兰人,他们进行全球化经营。并且一度他们和钻井有关。他们是经营钻井或出售钻头你还不清楚。他们是否还好?我们也不知道。但是,嘿,我们知道他们是“工业的”和“多元化的”。
访问他们的网站也没有太大的帮助。你首先看到的是一个带标题的标识,上面写着“一个创新的世纪”。
那个标识会很快消失,但你仍然不知道这个公司是做什么的,或者你为什么要关注它,更别说谁才应该关注它了。
“创新”标题消失后,用户将看到一个拿着平板电脑的男人在一个大城市的照片。这占据了主页上“明显位置”的很大一部分。
那么,他们是一家技术公司吗?
我们仍然不知道这家公司是做什么的。
顶部的导航写着:“发现我们”,“加入我们”, “投资者”,“产品”。
嗯,那我们试着看看,在“产品”下面是什么?
“汽车俱乐部(Club Car)”,“英格索兰(Ingersoll Rand)”,“冷王(Thermo King)”和“特灵(Trane)”。
唉。好吧。让我们试着来消化这些东西。
“汽车俱乐部”-这是一种汽车服务吗?或者你是卖车的?
“英格索兰(Ingersoll Rand)”不是公司的名字吗?或者现在也是一种产品的名字?
“冷王(Thermo King)”听起来像一种保暖床垫。
“特灵(Trane)”-这是一个拼写错误。是吗?
退出导航菜单。让我们来看看那张大幅照片下面写些什么。
“关于我们
帮助|构建|交付|滚动”
英格索兰(Ingersoll Rand),你现在真的把我们弄糊涂了。为了帮助访客你是怎么做的?我们现在又回到“床垫”了吗?你构建什么?你交付什么,交付给谁?你是否类似于UPS?“滚动”是怎么回事?
标签在这里不起帮助作用。
我们刚刚认识了它的标识。我们完成了这个网站。该离开了。
在这个例子中,我们看到,对于不熟练的用户来说,标签、标题和产品的照片可能只是在制作相关网页时的一个起点。这个网站可能只是以内部员工和管理人员为主要受众制作的,而不是以新的客户为主要受众制作。
然而,为了避免变成一篇讲UI的文章,我们会停在这里,并且回到我们的原点:
确保你非常清楚,你是用文字,而不只是用照片或设计理念来销售产品。不要依赖用户对你的品牌意识。他们可能从来没有听说过你的品牌。
尤其对创业公司而言,当你的产品或服务是一种新兴趋势,或你在现有市场是一家新的参与者的情况下,明确的表达变得十分重要。比较出售几乎相同产品的两家不同的公司的主页。一家公司的主页让你觉得对于他们销售的是什么毫无疑问,而另一个公司的主页让你觉他们卖的是“高雅”:
你更倾向于从哪一家公司购买?是说明其产品并告诉你产品优势的公司,还是使用单词“高雅”,并且试图出售一些看起来像是室内设计一样东西的公司?
3. 使用动词,大量的动词
我能想到的优秀销售导向文案的一个最佳例子是在23andme网站(个人基因测试网站)上。
他们的许多标题都以一个动词开始,要求用户“做”点什么。而且,每一页都用显而易见的按钮号召用户行动,要求用户“现在预订”,这也是一个行动导向的动词。
这样做减少了用户的被动性。即使站点的布局把你的眼球吸引到了他们行动号召上,他们也特别清楚网站的意图是什么,这个公司想要他们做什么。(23andme网站信息的其余部分是次要的,但是如果用户想要了解的话,它就在那里。)毫无疑问,这个网站的主要目的是让人们订购一个DNA检测试剂盒。
这似乎是显而易见的,但是你如果知道很多公司竟然就那么容易在夸夸其谈和追求设计感中忘记自己的网站目标时,你一定会大吃一惊。这样用户就会没有一个可以瞄准的“目标”和一个可以遵循的“路线图”。
23andme的主页以这一理念作为引领,同时它也遵循我们上面提到的所有”规则”。让我们来看看在下面的截图中说明动词用法的红色框:
注意网站的顶部标题中显示的品牌口号,这个品牌口号所描述的正是这个公司所做的和所提供的内容(见上述第2条规则)。介绍性的标题则向用户说明了从中他们可以得到什么。此外,这个网站并没有一直谈论公司有多么“创新”,而是主要关注用户的利益。它开门见山地要求人们做一件简单的事情:现在订购。然后它不断给出去做这件事情的更多理由,如:
另一个要大量使用动词的地方是在你的导航菜单中。许多文章对导航菜单的建议会告诉你,不要改变网页的命名公约。这是真的,但如果你保持使用明确和明显的表达,你仍然可以利用动词化的导航菜单。
第一个启发我这样做的网站是biblesforamerica.org。我了解到这个网站己经接受了超过一年的规划和深入研究。对我来说最吸引人的项目之一是主导航菜单使用动词,它使每个可点击的项目都成为了行动的号召:
要注意的重要的事情是,这个导航菜单使用双层。第二层文字进一步说明用户可以在每个动词的下面发现什么。在这种情况下,只有主导航栏,没有额外的文字,操作菜单将会不起作用。
例如,如果动词“访问”是一个独立的链接,用户会问:“访问?你想让我去访问你的办公室吗?”但第二行清楚地表明“访问”的地方是博客。
有时没有第二行说明的单字词链接也可以起作用,但如果它旁边的动词差异不够充分,或者太含糊不清,就可能会引起混淆。看下面这家博物馆网站的例子:
在这里,当使用动词“访问(visit)”时,毫无疑问该网站是在邀请用户参观博物馆。而我们都知道博物馆是吸引面对面访问的,富有教育意义的地方。
然而,如果没有第二行的说明,单独使用动词“探索”时,菜单就会变得混乱。“探索博物馆吗?不,那不就是我要参观博物馆的原因吗?你是想要我们做两次相同的事情吗?”用户需要进一步调查才能知道“探索”是指什么。
4. 利用约定俗成的网站布局展示你的优势
本节的副标题可以是“不要为了显得时尚而时尚”。换句话说,要坚持传统的网站布局,除非你真的知道你在做什么。如果你没有上过一个用户界面设计的课程,最安全的办法是遵守规范,因为规范已被证明对用户来说比较管用。
不要试图通过把你的导航菜单放在你的主页的底部或者使菜单在一些页面上消失而显得不同。不要试图把你的logo放在右上角而不是左上方。如果你不足够了解排版(超过会导致注意力不集中的每行的字符限制),不要移除你的侧边栏。总之:不要步出传统网页设计的“安全区”以外。
记住,你的布局不应该是为了让你满意而存在。它是用来使你的用户尽可能容易地找到他们正在寻找的东西,并且采取你希望他们采取的行动。用户没有太多的精力、注意力和时间来关注如何使用新的“时尚”的布局。
一个让我很迷惑的网站是kgms.ca。当你发现右侧框是网站的主导航菜单后,点击它的一个项目,你就会滚动到看上去似乎是一个单页网站的新的一节;但是,事实上,它是新URL两级子文件夹上的全新页面。
(小编友情提示:斜体部分实际上你可以快速跳过去……)在这个层面上,你会在顶部获得另一个菜单,但这不是一个顶级菜单;它是一个子菜单。如果你点击在这个原本应该是顶级菜单位置的其中一个子菜单,你将会转到新的页面。
如果你想从这里去主页,那么你到达不了主页,至少用任何可见的“主页”按钮或链接到达不了主页。左上方的标志已经消失了,所以那是不可能的,因为对到达主页有“怀疑”。
为了从这里到达主页,你可以试着做的唯一事情是向上或向下滚动。如果你向上滚动,你就会被带到一个看起来就像主页的区域,但它不是。它的URL显然是一个子级页面。如果你点击侧边菜单上的另一个链接,你就会到达一个新的URL,并且会出现文本。这的确很棒,但是,一不注意大的照片就会从左侧滑入,并且你不知道你的文字在哪里。
如果你上述内容没看懂,那么,你就会知道我打开它时的感受啦。(明白小编为什么在上面提示了吧?)
要点是,你自己千万别做这样的事情。是的,也许你已经表明了你有做一个网站的能力,并且当然,是非常美观的。但问问你自己:“非常美观”的设计和过度使用“酷”的技术,和让用户困惑比起来,值得吗?
有时候你可以“打破常规”吗?当然可以,但首先你要知道你在做什么。同时,记住你的网站目标(上述第1条规则)。例如,moz.com网站是新的,时尚的,但不会引起困惑。他们的网站上的每一页都引入了一种新的布局,这样有助于突出内容。但顶部导航保持固定位置以便帮助用户可以很容易地从一个页面到达另一个页面(除了在博客区域,因为有时候它会迫使用户使用浏览器的“后退”按钮)。
5. 不要试图复制别人的页面
当我面对只是因为竞争对手这样做就提出(甚至坚持)一种想法的客户时,我觉得很困惑,因为这决定并不是基于任何研究或网络营销原理作出的。你的竞争对手可能并没有特意设计,或得到更多的点击,他们很有可能是“即兴表演”。
这与上述第4条规则并不矛盾。这不是指网站规范。如果你的对手,或一个大品牌,遵守网站的规范,并且对于他们来说这些是行之有效,那么你也应该这样做。但这并不是说你要“复制”。
你不应该做的是,当你不了解这些网站设计和布局是如何运作的,为什么它被放在那里,以及还有什么其他的解决方案可以实现网站目标,而只是因为在另一个网站上看到它就复制一种布局或功能(见上述第1条规则)。
例如,不要只是因为你觉得星巴克是个大公司,就尝试使用像星巴克一样的导航菜单。你看得出他们目前的导航菜单有什么毛病吗?
这个导航菜单中使用双行,只是第二行试图挤进三个单独的子标题,“把混淆不清的词放在一起,好像他们是一个句子的一部分。”这不是你使用双行菜单的方法!
例如,标签“咖啡馆(coffeehouse)”本身是令人困惑的,因为在这个网站上显然没有咖啡馆(除非星巴克已经找到了一种方法来虚拟地提供咖啡)。用户必须依靠导航标签中的第二行来了解“咖啡馆”是指什么。用户可以得到什么?“音乐Wi-Fi社区(Music Wi-Fi Community)”。
哦,有趣。星巴克有“音乐Wi-Fi社区”。是我们在他们的网站上通过互联网谈论音乐的地方吗?或者是一种新的社交网络?
不,都不是。如果你看一看其他菜单标签,你就会看到他们试图列出三个不同的词并且做的很差。如果你的鼠标悬停在标签上,你会看到一个弹出的“大菜单”,这个“大菜单”被分隔成他们的网站的不同的子区域。通常,大菜单能够很好地帮助大型网站在一个集中的位置为用户组织内容。
然而,这个大菜单需要重新做一些简单的标签,以及重新组织。这些区域没有像在第二行标签中那样用“音乐”这个词。此外,这些子部分中的任何一个都看不出是如何与“咖啡馆”这个词相关的。那部分内容是想说发生在他们的咖啡馆里的事情?但是,如果是这样,为什么还会说是“在线社区”?而且,他们为什么在这部分发布手机应用广告?
这个网站设计可能已经超越了其本来的目标。应该试图用内容的更新来延长它的虚拟寿命。如果你现在复制这个“大品牌”,你的网站战略将不会如期完成。最好坚持现在流行的做法,雇佣实际内容架构师、网络营销师和用户界面设计师来帮你一起做。
最后,我们学到了什么?
如果你想要使你的站点更值得点击,你需要:
A)作为第一步,首先确定你的目标:
开始设计之前问自己正确的问题。
问自己你将如何去实现你的目标,以及对于你的目标来说什么样的战略是最好的。
B)使用合适的文案:
在你的写作中突出特点。用任何人都能理解的文字,来确保你的文案不是模糊不清的,并且可以说明你到底是做什么的,你能提供什么,以及人们为什么应该关注你。
当你在编写你的网站的文案时,要从别人以前没听说过你的公司这点出发。
避免使用在任何情况下,几乎任何人都可以使用的“无意义”的字和词。换句话说,你可以说诸如此类的话:“我们把X卖给喜欢Y的人”时,不要使用“战略”和“创新”之类的词。
使用动词和行动导向的词组。只要你语言够简洁,又有足够的空间,你也可以在你的导航菜单中这样做。
C)在你的设计和布局决策中运用常识:
如果你不是一个用户界面设计师,不要试图追求“时尚”的布局。坚持人们习惯的传统;这样终究是安全的。
不要只是因为你觉得“他们会知道他们在做什么”,而试图复制竞争对手或“大品牌”。这样做你可能会复制一个错误或过时的战略。坚持你的网站目标,并为你的独特的网站需求征求专业建议。
你还有什么要补充的吗?你如何使自己的网站更值得点击?说出你的故事!