本文长度为5729字，预估阅读时间10分钟。

我们今天要向大家介绍的是电商网页的搭建和优化从网站的顶层导航到交易内容，在打造电商页面时，会需要很多的考虑。

在今天的白板星期五，Rand用他个人最喜欢的一个例子，一步步详细地给你讲述如何创建一个真正精湛的电商网页。

大家好，欢迎来到白板星期五的特别版。我叫Rand

Fishkin，Moz的创始人，今天我想跟你聊聊如何在网络上打造/设计最好的电商页面。我将用我喜爱的电商页面中的一个例子，那就是Bellroy纤薄钱包页面。现在，实际上Bellroy的所有页面都是与钱包相关，Bellroy制造钱包并主要在网上销售。他们制造了一些很经典的产品。我也拥有Bellroy的一款钱包并使用了很长的一段时间，正是这个页面让我相信并去购买。那么，还有什么更好的例子呢？

所以我今天要做的是让我们了解这个经典的电商页面的元素，谈谈一些我认为Bellroy可以改进的地方，然后在最后，通过这个过程来改善你自己的电商网页。

• 一个经典电商页面的元素

让我们从第一项开始，很不幸的是，很多人都不谈论但对于电商流程和电商页面来说却是至关重要的，那就是…

1顶部导航

尽管页面顶部的导航所需要做的事情很少，但它必须帮助用户：

• 了解并知道他们在网站结构中的位置，尤其当你有一个较为复杂的网站时。在Bellroy的案例中，他们不需要强调任何东西，因为你知道你在一个钱包的网页上，可能是在官方商店里，对吧？但对亚马逊（Amazon）而言，这就至关重要。对百思买(Best
  Buy)，这也非常重要。即使是像三星和苹果这类的平台，让用户了解到其在网站结构中的位置也是非常关键的。

• 我想了解关于品牌本身的信息。如果有用户第一次浏览该网站，他们通常是您对品牌首次曝光的切入点，这是电商网页常见的情况。让我们回想一下，从我们所知道的关于转化率优化的知识中，要在用户第一次浏览品牌或者网站页面时转化用户是不太常见的，但是你可以给用户留下一个较好的第一印象，而这其中的部分内容就是你的顶部导航所需要做的。所以它应该帮助用户认知品牌，了解品牌的风格和细节。

• 你需要知道从哪里可以进入网站。在哪里可以搜索？如果这是我第一次或第二次浏览，我尝试想要了解更多关于公司的信息，我希望能够简单地找到类似“关于我们”，又或者我想能够了解更多关于他们的产品或他们是做什么的，了解更多的实用手册，了解更多关于他们的产品系列，并且了解他们能够提供给我的其他东西。

• 我也想要在购物车周围有这种简单的导航，尤其是对于电商的重复访客和购物不止一件商品的客户。实际上，我并不喜欢Bellroy如何最小化导航，但你需要确保搜索栏也要在这里面。搜索实际上是一个功能。对于电商页面平均大约10%到12%的访问者将使用搜索来作为他们的首要导航功能。所以，如果你让搜索真的变得薄弱、难以找到相关商品或者不好使用，搜索功能真的能够限制你对于这批群体的影响。

• 我想要有关购物过程的信息。在Bellroy的案例中，我喜欢他们所做的。他们在每一页导航栏内都写有“美国范围内免邮”，我想，这显然对他们来说肯定是他们一直以来都在关注的关键问题之一。毫无疑问，他们已经做了一些A/B测试和优化，以确保把“嗨，你知道吗？放在每个人面前，因为它不会伤害用户感知并且能够有助于提高转化率。”

2核心产品信息

核心产品信息往往是上述图片的关键部分。在关于Bellroy的案例中，核心产品信息非常简约。我们只是在谈论这款钱包的图片，然后你可以点击图片的左边或右边，或者同样可以通过在桌面上实现自动滚动展现。我可以看到更多的照片，这些照片展示了这款钱包能够装多少张卡，放进裤子口袋里是看起来怎么样，它是如何测量的，以及所有与之相关的东西。这里确实是一些很好的拍摄照片，同样重要的还有产品名称和价格。这些核心细节可能因产品而异。例如，如果你正在销售一项更为复杂的技术，核心功能实际上可能也是相当真实的，那没有关系。通过这些核心产品信息，我们正尝试帮助用户理解这个产品是什么，它能做什么。所以，钱包就是一个非常明显的例子。如果我们所谈论的是关于实验室设备或科学机器，那就有点复杂了。我们最好确保我们正在沟通的是关键的内容。

• 视觉效果将服务于什么呢？在这个案例中，我认为他们做的很好，他们向用户全面地传达了产品本身的定位。所以，Bellroy显然就是极简主义。他们传承着工艺。他们是小小的利基商店。他们没有要去做10000件东西。他们专注于钱包，并且他们尝试将这个定位变得更加清晰。他们也试图使产品的品质成为其中的重要部分，尝试把产品本身的焦点聚焦到“纤薄”。当你进入页面时，你真的可以很明显的看到命名规范，同样也包括拍摄的照片本身，都在向你展示与其他的钱包相比，这款钱包有多么的苗条。他们取相同数量的卡片，将它们放入两款不同的钱包，并向你展示他们的厚度，Bellroy非常、非常地纤薄。因此，这就是定位的意义所在。

• 在这里，我们可能需要视频或动画。但我要说的是，当它真正有意义的时候，只是核心内容的一部分。Zappos就是一个很好的例子。Zappos在网上宣传推广的每一款鞋和鞋子品牌都有他们的视频。他们见到了转化率的巨大提升，因为用户对于鞋子有很多问题，关于鞋子穿着行走和移动，与某些衣服搭配起来如何？让别人给你解释细节，正如我给你在视频中讲解电商页面一样，结果证明对他们的转化率有很大的影响。你可能想要测试这个，但视频和动画内容可能在下面。我们将在视频的的末端讨论如何在底部的照片和流程中存放更多的视频。

• 命名规范。我们要价格，我们想要核心结构的细节。我喜欢Bellroy，他们所展示的核心内容非常的简洁，仅仅只有图片、商品名以及价格。

3购买路径的明确选择

我认为，在某种程度上，很多人都不幸被亚马逊的模式所影响。如果你是亚马逊，那没事，它有惊人的点击率，惊人的参与度，惊人的转化率，但你不是亚马逊。亚马逊做的一件事情就是他们在网站上堆砌了成百上千种商品，并且他们建立了几十年，几十年！他们建立起来的是我们都熟悉的亚马逊网页、电商页面，以及我们所期待的内容。我们知道这里会有很多东西。我们知道这里有大量的行为召唤，以及其他我们可能购买的东西，还有与这些东西经常一起购买的，还包括捆绑销售的东西。这些对于亚马逊来说这是很有益的。除非你的网站和亚马逊非常相似，否则对你而言这些绝不会很有益。因此，我看到许多人被拖到这个方向，“嘿，我想要有10个不同的行为召唤，因为用户可能想要X，Y，和Z。”对于电商产品而言，有一些方法可以实现“用户可能想要X，Y和Z”的功能，而不需要在其着陆页面的核心部分做这些具体的行为召唤。我一会儿会讲到这些。

但是我想让你在这里做的是：

• 帮助用户了解什么是可用的。快速示例，你可以选择颜色。这是你唯一能用这个钱包做的事。没有不同的尺寸可选，也没有不同的制成材料可选。这里仅仅只有颜色可以挑选。选择颜色，结账，顺便再强调一下，免邮。

• 我正试图推动用户采取主要行动，这就是你的电商页面所需要做好的工作。如果有的话，使选项明确，并让购买路径最简化。

• 我们正努力消除障碍，我们正努力消除可能出现的任何问题，并且我们希望消除任何未知的挫折。举个例子，我将在这里做的事情之一，但Bellroy没做，我将基于IP地址进行地理定位。所以我会看看访问这个页面的访问者的IP地址，我会说，“我很确定你现在位于华盛顿州。因此，我就知道我所需要收取的销售税额。”或者说，“Bellroy不在华盛顿州。我不需要向您收取销售税。”所以我可能会在这里说一下“销售税”，如果你知道，然后通过下拉式菜单选择提前预填好的华盛顿或邮政编码，那么展示的销售税为“$0。”这样做就是预测。就像已经说了这样，“哦，很好。我知道我将要点击的下一页面是叫我询问关于销售税，又或者是我进入我的信用卡后的页面。”你知道吗，提前回答这个问题很好。现在，Bellroy也许已经测试过这一点，他们发现它同样也不能转化，但是我猜测有那些信息在的话，它可能会更好地转化。

4产品功能的详细描述

这就是经常出现在电商页面、产品页面上大部分内容。在这种情况下，用户得到了功能列表，包括尺寸、它是如何做成的、它是由什么材料制造的以及它能够容纳的内容等等。

我在这里想要做的一些事情是：

• 我想帮助用户了解这款产品有什么值得期待的。我不想要高回报。特别是如果我已经提供免邮服务，我肯定不想要高回报。我希望用户可以对这款产品满意，并且知道他们将会得到什么。

• 我想帮助他们确定产品是否符合他们的需求，是否符合他们正努力完成的事情，是否符合他们想要解决的问题。

• 我想引导他们快速地回答一些常见问题。所以，如果我知道很多访问这个页面的人都有这样的情况，“哦，天啊，你知道，我不知道他们快递的过程是什么样的？需要多长的时间？因为这次旅行我需要一个钱包，我想要把这款钱包放进我的裤子口袋里，所以我不要厚厚的钱包，这也正是导致我需要在Google里搜索纤薄钱包，并引导到这个页面的原因？”快递，这是一个很重要的部分，你已经回答了这个问题，或者正如他们所问的那样，这真的很重要。在用户开始对结账过程感到恐慌之前，预先回答给出他们想要的答案。

你可以通过与用户沟通来解决这个问题，“嘿，我想让你想象你将要购买这款商品。把你脑子里想到的10件事情告诉我。我想要你大声地说出当你看见这个页面时你所想到的每一件事情。”你可以和真正的客户一起实验，可以是回头客，可以是那些符合你的目标人群和目标客户但还未在你那里购买过的客户，可以是在你的竞争者那里购买过的客户。当你这样做的时候，一段时间后你将会发现答案非常地相似，然后你就能够通过功能内容正确地回答客户的问题了。保质期是另一个明显的大问题。他们注意到这里有三年的保质期。用户可以点击“+”号了解更多的信息。

我同样也喜欢他们回答那些还没有被问到的问题。“Okay，钱包的尺寸是80毫米*95毫米。”“但是我不知道一毫米是多少。我不能在我的头脑中保留这样的信息。”但是你会发现，他们在页面上有一个链接“与其他比较。”如果你点击这个链接，它将向你展示这款钱包和别人提供的其他款钱包的全方面比较。太棒了，在我提出问题之前，你已经在回答问题了。

5大量的可靠内容

我们前面谈论的关于视频或者动画或者其他的一些内容都属于功能部分，或者仅仅只是结账部分，但是还没有达到我们所要求的重要程度，这就是你可以把内容放上去的地方。可以做成折叠，并向下滚动展示。我还没有见到有电商页面提供了用户真正关心的事情的细节。我看到过有电商页面提供了大量的内容，但却没有用户关心，尤其是当内容影响到页面的加载速度时，在移动终端上将会影响你的转化率和你在Google中的排名，因为站点速度是一个真正的问题。但是可靠内容应该：

• 让用户觉得舒服并构建信任。所以，如果当我向下滚动页面到这里，我所看见的是更多关于这款钱包是怎么制造的，人们是如何使用它的相关图片。他们将其巧妙地命名为透明化方法，我确信它能够带来很多的点击。用透明化方法构建一款钱包，展示为什么皮革如此纤细，为什么钱包如此轻便，为什么它能使用那么长时间，所有诸如此类的事情。

• 它试图利用社会证明或其他心理诱因来摆脱用户的任何怀疑。所以，如果你知道潜在购买者有什么怀疑的内容，你可以通过这个更深层次的内容来回答这个问题。

好吧，你也许会对自己说，“这些听起来都很棒，但我如何运行这个过程,Rand？”答案都已包含在我们刚刚谈论的内容中。你将需要咨询你的客户，你的潜在客户，以前从你这里购买过的客户，以及还没有从你这里购买但却最终从竞争对手那里购买的客户，了解这些内容元素。你将需要进行测试，这意味着你需要一些基础设施，如Unbounce或Optimizely测试平台，或者你想让你的工程师为你构建一个属于你自己的测试平台，以便能够更改这些元素和信息，并看着它们如何实现转化。但是，改变像按钮颜色这样的事情，或改变功能列表，或者在问题出现时更改特定的图片是没有帮助的，总的来说，你还是没有解决这些问题。如果你不解决这些问题，世界上最好看的按钮颜色也无法帮助你提升转化率，这就是为什么我们需要形成理论，并对阻止用户购买的原因形成假设。这应该通过我们的真实研究。

• 电商页面的搜索引擎优化

电商页面的搜索引擎优化只是基于几个非常简单的事情。我们搜索引擎优化的元素是关键词、内容、参与度、链接和在某些情况下的新鲜度。你了解了这5项，你也就基本上掌握了搜索引擎优化。擎优化。

• 关键词，当用户搜索你的产品时，用户所称呼的产品与你所提供产品是相同的吗？如果答案是否，你还有机会来提升。即使你想使用品牌名称，我建议将其与所有人都常用的产品名称相结合。因此，如果这是一款纤薄钱包，如果历史上Bellroy已经将其称呼为纤薄钱包，我会强烈推荐给他们的，“嘿，用户正在寻找一款纤薄钱包。我们怎么找到合并这些东西的方法呢？”

• 内容是关于这个页面的内容，Google正在寻找解决搜索者问题的内容，即搜索者的问题。这意味着要做好这些事情，并且必须要以Google能够识别的格式处理。视频可以，视频的录音也应该可以，图片也可以，详细的描述也应该可以。Google需要那样的文本内容。

• 参与度，这将来自于访问这个页面的用户，而不是点击后退按钮并返回Google，搜索其他的东西，并点击你竞争对手的链接。它将来自于用户点击结账按钮或在网站上浏览更深层级的内容，来自通过在站点上与这个页面的交互并且没有跳出。这是你的工作和责任，这些东西都能帮助你。

• 来自媒体的链接。它可以来自博客。它可以来自一些高质量的目录，在目录链接构建关系要非常小心。它可以来自友情链接。它可以来自供应商。它可以来自于产品的粉丝。它可以来自评论。诸如此类的东西。还有那些给你见证的人，你可以向他们索要链接。这些链接，如果它们来自不同的领域，并且它们含有很好的锚文本，文本内容具体为实际产品的名称，它们将特别指向这个页面，也将极大地帮助你提升在竞争中的排名。

• 新鲜度。在某些行业和某些情况下，当你知道受众对最新和最好的信息有大量的需求时，你应该尽可能频繁地使用新的信息内容更新这个页面，这些新的信息是与你的受众最契合和最相关的。

你做完SEO以及上述打造电商页面这些事情，那么你将拥有网上最好的电商页面。

作者：Rand Fishkin是Moz的联合创始人，也是团队的个人贡献者。喜欢写博客、旅行，喜欢市场和技术方面的知识。