首页顶部应该放置什么内容——“首屏”内容技巧

作者:

在

Tips-For-“Above-the-Fold”-ContentWhat you put in the top of your front page has a huge impact on the success or failure of your website. Put the wrong thing in, and you’ll probably see your visitors quickly navigating away from your site. Put the right content there and you may see your sales go up.

This article isn’t an all-in-one guide for creating above the fold content, nor is about an all-encompassing rule on what you should put in. Rather, I will give you a few tips, recommendations and a little bit of helpful research about this topic.

在直接深入探讨之前,最好先了解一下首页最顶部的区域叫什么。它有一个比“网站顶部”更贴切的名字。

file000153814713_

“首屏”(Above the Fold)

它被称为“首屏”(Above the Fold,直译为折痕以上)。为什么呢?因为在早期人类阅读纸质报纸的时代,报纸通常是折成两半贩卖的,所以人们第一眼只能看到上半部分。那上半部分(即“折痕以上”区域)刊登着当天最重要的一条或多条头条新闻,而当你展开报纸时,才会看到其余次要的新闻。网站也是如此,您网站的最顶层部分是人们首先看到的内容,当他们向下滚动时,就会看到网站的其余部分,这就像展开一份报纸一样。

继续沿用报纸的例子,假设你走在街上,看到一个报摊。当你看到报纸时,如果头条新闻很吸引人,你可能就会买下报纸阅读其余的内容。这与网站本质上是一样的,如果访客浏览你的网站并发现首屏内容很有吸引力,他们可能就会被打动,进而向下滚动或浏览你网站的其余部分以获取更多信息。

尼尔森的研究

Earlier I said that your above the fold content may make or break your site. Nielsen Normal Group has written a few research articles about this across the years. I’ll quote the summary of their article The Fold Manifesto: Why the Page Fold Still Matters

The average difference in how users treat info above vs. below the fold is 84%.

If you just got confused about the wording of the quote, I did too at the start. Let me clarify: That study doesn’t mean that 84% of people do not scroll down, on the other hand I’ve seen other research say that most people do scroll down to the bottom of the page. It also doesn’t mean that the lower part isn’t important. Instead it means that the behavior of your visitors in your site is largely impacted by your content above the fold.

这是合乎常理的,因为网站的顶部区域是您第一眼看到的内容。

既然知道了首页首屏内容有多重要,那么您应该在网站顶部放些什么呢?

开门见山,直奔主题

立即说明您的网站是关于什么的。您的首页和首屏区域是整个网站的命脉。如果您的访客感到困惑,他们会很快离开并关闭标签页。如果您是一位新书作者,就写明您的身份并展示您的最新作品。如果您是一位婚礼策划师,就写明您是一位能为访客打造终生难忘婚礼的策划师。或者,如果您正在为自己的小型酒店建站,那就写明您是当地最好的民宿旅馆。(我会在下面更多地使用这些示例。)

您的访客不应该去费心猜测这个网站是做什么的。他们应该能立即看懂,只有这样,他们才会向下滚动去查看更多详情。

有针对性地引导访客互动

接下来,您必须考虑您网站的实际目的。您当初建站的初衷是什么?无论原因是什么,您也必须将其放在首屏。

让我们看一下上面提到的几个例子。对于新书作者,您可能希望获得更多曝光。如果您有一本免费电子书,那么可以放置一个按钮供访客下载。对于婚礼策划师,您希望人们就您的服务联系您,那就放上您的电话号码或联系表单。或者对于小型酒店,放上预订表单和您的电话号码。

对于 Page Builder Sandwich,我希望人们能更多地了解这款插件,并最终成为付费客户。因此我在那里设置了一个按钮,让访客可以立即试用演示版,另一个按钮用于购买插件。

设计首屏

现在我们知道要放什么内容了,接下来就是决定设计的时候了。就我个人而言,我更喜欢干净利落的分区内容,因此我们首页采用了纯色背景。但用图片或视频来配合您的首屏内容也是一个好主意,可以让它更加生动。

Screen-Shot-2016-01-29-at-12.11.19-AM_Here’re a few examples of what you can do about your front page.

Add a background image. A large background image behind your large statement is a great eye-catcher and can further encourage visitor engagement. For new book author, maybe adding a background image illustrating the setting of his free ebook would entice people more.

Add an introduction video. Admit it, people can be lazy, especially when it comes to reading. So if your site is a bit complicated, it might be a good idea to add a short video that introduces your site/product quickly. For the wedding organizer, then this can be a video of their latest wedding. Or for our site for example, we can add in a quick intro about the features of our plugin.

Add a video background. This is a bit of a trend nowadays, but I find it appealing at times. If this suits your taste, then this might be a good idea.. I know PayPal had a video background before in their site. For the small hotel, you can put in a stationary video of a scenic area of your hotel as the backdrop.

结语

为首页创建首屏内容并不难,但需要经过思考和测试才能做好。如果您已经拥有一个网站并且框架已经固定,但 Google Analytics 中的跳出率很高,那么我建议您根据上述技巧,尝试重新构思您的首屏内容。

If you have tips on creating above the fold content, kindly share them in the comments!


Page Builder Sandwich can Help You Design Your Front Page & Above The Fold Content

Page Builder Sandwich is a WordPress plugin that allows you to create any design you want without writing any piece of code.

了解有关 Page Builder Sandwich 的更多信息