响贝的网站规划合理吗

近日很多网友咨询小编企业官網怎么做?今天脚本之家小编就给大家分享5大设计要点教你搭建好看又好卖的企业产品官网这5大设计要点分别是1.善用首屏大图吸引视线2.銷售主张明确传达产品价值3.合理的导航方便访客获取信息等

企业网站是企业在互联网上进行网络营销和形象宣传的平台,相当于企业的网絡名片不但对企业的形象是一个良好的宣传,同时可以辅助企业的销售通过网络直接帮助企业实现产品的销售,企业可以利用网站来進行宣传、产品资讯发布、招聘等等因此一个精致的企业官网对产品来说至关重要,那么企业官网怎么做呢?这5大设计要点教你搭建恏看又好卖的企业产品官网!

在谈到企业产品的营销时(本文中提到的“企业产品”是指“给企业客户使用的软件/应用”)一种观点认為客户肯定是靠线下推广来获取的,另一种观点认为应该让用户主动购买而不是被动推销持这种观点的公司尤其重视通过产品官网来获愙。

无论持哪种观点不可否认的是官网是客户对你产品的第一印象,很多潜在客户在购买之前都是先通过官网来了解产品的然而很多公司在产品官网设计这件事上投入的精力还不及线下推广的万分之一,有的只把官网当作摆设粗制滥造套个模板结束,甚至还忽略了移動端适配

作为企业产品的设计师,我们要如何设计好看又好卖的产品官网有没有一些套路可循?

企业产品官网的作用是传达信息和促進转化传达信息是告诉访客这款产品是什么/能为你公司做什么/为什么值得我购买,再配合一些增强说服力的手段来促进转化——将尽量哆的访客(潜在客户)转化为注册用户并最终完成购买按照用户浏览网站的顺序,有以下 5 大设计要点:

一、善用首屏大图吸引视线二、銷售主张明确传达产品价值三、合理的导航方便访客获取信息四、无处不在的CTA推动转化五、客户案例增强信任感

一、善用首屏大图吸引视線

首屏大图占据了官网最宝贵的第一屏它决定了访客对官网的第一印象。首屏大图可以辅助产品Slogan来有效传达产品价值同时还会影响到官网整体的气质。常见的首屏大图有以下 5 种表现形式:

1.实景照片营造场景氛围

在实景照片这个形式上企业级产品的表现力远不及消费级產品(对比一下Salesforce和Apple的官网就知道了),因为企业的商务属性决定了他们不能像消费级产品那样大胆地彰显个性企业产品官网一般会用客戶使用产品的场景照来说明产品给他们工作带来的益处,或用一些开阔的风景照来表现公司的价值观和愿景

这种传统的照片形式常见于┅些大公司,例如微软的CRM产品Microsoft Dynamics 365:

客服应用HelpCrunch则用来表现公司未来的愿景:

2.概念图用隐喻表达产品价值

经过设计处理之后的概念图比真实照爿的表现空间更大,可以通过一些隐喻的手法来传达产品价值

近年来一些企业重塑品牌向更年轻更有活力的方向发展。插画的形式有利於塑造轻松时尚的品牌气质同时也是最适合用来讲故事的表达形式。

Intercom用生动的手绘风插画描绘了一副工作中遭遇的混乱场景引出了使鼡Intercom可以结束这一切混乱的概念:

Atlassian用配色明快的图形插画描绘了齐心协力的工作场景,烘托出“Team up”的产品价值主张:

4.产品界面图简单直观

简單直观的运用产品界面图作为首屏大图让用户对产品使用过程有一种直观的体验,也是一种对于自己产品的设计很有自信的表现

云存儲应用Box用产品界面和照片混搭的形式来表现“Work as One”的产品理念:

5.客户照片更具说服力

使用真实客户的肖像作为首屏大图,兼具客户案例的作鼡使产品更有说服力。

自助建站应用Squarespace用高清的客户肖像图配合产品界面来表现他们的应用可以为不同人群定制专属网站的理念:

用视頻代替静态图出现在首屏成为近年来流行的一大趋势,比起静态图动态视频更容易吸引目光。视频的内容可以是产品功能解说/客户案例講述/企业文化传播等视频的触发方式有自动播放/预加载/点击播放等。

自助建站应用Weebly的首页视频融合了各类用户的生活状态和使用场景來表现“DO WHAT YOU LOVE”的产品理念。

首屏大图和销售主张是官网的重中之重既是营销的核心,同时也是页面布局和表现的核心首屏大图是传达产品品牌的绝佳机会。不同子产品页可以用不同的首屏大图但是要注意尺寸和风格保持一致。

二、销售主张明确传达产品价值

当用户被首屏大图吸引住目光之后想要进一步留住客户,就必须立即向他们传达产品的核心价值让他明白购买你们的产品可以获得什么好处。在營销领域这被称为USP(Unique Selling Proposition),意为“独特的销售主张”

1.销售主张需要多次强调

在企业产品官网中,销售主张会多次出现完整的销售主张通常会由以下三个基本部分组成:首屏标题、强化阐述和最后重申。

首屏大标题是USP的核心简短明确的slogan是一个强有力的开场白。通常位于官网首屏最显眼的位置用大字体突出,同时可以用小字在旁边进行辅助说明

MailChimp的首屏标题简短有力:

用来强化和丰富USP,让它看起来更有說服力可以从正面出发列举产品功能、强调产品优势,也可以从侧面来印证比如成功案例、资质证书等。

MailChimp用与首屏标题同样风格的文案配合界面图来强化USP:

当访客浏览了长篇的强化阐述,浏览到页面底部时最后再重申一下USP,首尾呼应

MailChimp在页面底部最后重申,号召转囮行动:

2.文案风格会影响销售主张的表现力

根据不同的产品功能和品牌调性销售主张的文案风格也各不相同,主要有以下几种类型:

a.清晰直白的功能陈述

清晰直白的功能陈述可能会有点无趣但却是最直观、最易于理解的。用一句话讲清楚你的产品是做什么的比含糊其辭的描述更容易让访客产生好感。

Xero是一款为小型企业提供会计服务的应用他们用一句话清晰传达了Xero的功能价值与目标用户:

b.令人印象深刻的号召型言语

使用一些强有力、干脆利落的slogan,去号召用户行动使用这类USP的公司一般都已建立了一定的用户基础和品牌形象。

光看Asana的大標题是不是很难猜到这个公司是提供什么服务即便如此,这几句简短大气的标语还是能给人留下深刻印象:

c.抓住用户痛点唤起情感共鳴

这种类型的slogan一般会从反面切入描述痛点,例如“工作不用那么麻烦用xxx你可以…”,然后引出产品可以解决这些痛点这是一种逆向思維,通过描述产品可以“规避负面结果”来突出其解决问题的能力这是与“获得正面结果”相反的一种思路。

Basecamp整个官网的措辞风格都是洳此:

在寻找案例的过程中还发现了一种动态的多合一文案表现形式。它的做法是保持核心文案固定不变其余的则不断切换。动态的表现形式更吸睛也赋予了USP更全面的展现。

规划USP时要站在客户角度强调你的产品能为他们带来什么好处。不要怕首屏标题太短讲不清功能旁边小字的作用就是补充说明,同时丰富排版没人会喜欢空洞的营销口号和行话,客户喜欢能解答疑惑、简单直白的USP

三、合理的導航方便访客获取信息

当访客被你的首屏大图和价值主张吸引之后,接下来他可能想要在你的官网上四处看看了解更多信息合理清晰的導航可以带领访客快速找到想要的信息。导航是网站的路标也是网站组织架构的体现。如果访客的浏览体验不顺畅他们会对你的产品囷公司失去信心。

1.不是所有网站都需要导航

导航是网站组织架构的体现在规划网站架构前,首先明确一个问题:我们是否需要导航当伱的目的是引导访客按照预设路径进行浏览,不希望他们跳出当前页面这个时候可以没有导航。这样的网站组织方式也叫线性结构:

对於功能简单的产品使用线性结构能有效带动访客参与性,推动转化行为企业产品官网的路径通常为头图-产品展示-注册试用。

例如办公協作应用Trelllo的官网顶部没有导航只保留了登陆和注册入口。页面的信息组织

按照“头图-功能总览-功能细节-客户展示-注册试用”的顺序由浅叺深、从宏观到微观的顺序引导访客完成浏览和转化到页面底部才会出现一排弱弱的链接:

线性结构的劣势在于访客不能按照自己的想法浏览网站,比如当他们找不到急切想了解的关键信息比如价格页时可能会觉得沮丧。

使用扁平结构可以减小网页深度让访客用较少嘚点击就能到达目标页面,同时有利于搜索引擎抓取效率在寻找企业产品官网案例的过程中我发现,对于功能相对简单的产品大多使用┅级导航而对于规模庞大的产品,他们的导航层级最多也只到二级可见扁平结构的导航是网站导航的主流。

例如企业邮件应用Mailchimp和Slack就是扁平结构的典型代表它们的导航都只有一级,把所有页面入口都放在外面最重要的功能、定价位于前两个位置,其余的根据重要性递減排列最右边一般会放注册或登陆入口:

对于一些规模庞大的企业产品,首先要尽量精简选项舍弃不必要的信息、隐藏次要信息,再栲虑在有限的空间里把信息入口展现完整

以Intercom为例,它是一款大型CRM应用公司旗下有三大子产品。官网首页设置了 5 个一级导航其中前两個是折叠导航。最重要的Products导航的下拉菜单中按照产品和解决方案两个维度展示了对应的信息配合icon和简介,有序又直观:

在Resource下拉菜单中则收拢了客户案例、帮助中心、产品演示等资源入口用清晰的组织方式把这些信息集中在一起,让想要了解更多信息的人自己去探索:

使鼡类似结构的还有Atlassian等大型公司:

3.确保访客清楚自己所处的位置

网站是一个虚拟空间访客在页面之间的跳转是无法预料的,如果没有清晰嘚导航在时刻提醒他们所在的页面他们早就已经迷路了。要让访客时刻知道自己所处的位置就要在不同页面上保持导航的一致性,并茬滚动页面时保持常驻

继续以Intercom为例,首页导航在滚动时保持常驻当点击首页导航到达子产品页面后,导航保持一致只是在原先的主LOGO旁多了一个子产品LOGO来表明当前所在页面,点击主LOGO可以返回首页:

子页面开始向下滚动时导航暂且消失当滚动到首屏以下时导航出现并常駐,注意到此时的导航样式已经悄然发生了变化——简化了主LOGO右边部分变成了 3 个针对当前子产品页面的导航。整个变化过程过渡地十分洎然:

再看看Atlassian的设计到达子产品页后会保留主导航,随着页面滚动子产品导航会把主导航推出,继而代替主导航的位置:

规划访客的瀏览历程保持顺畅自然的体验。保持导航结构的一致性确保用户始终知道自己所处的位置。保持导航的使用简单性删除不必要项目。简单很好但是要确保提供了访客想要获得的信息入口。

四、无处不在的CTA推动转化

CTA(Call to Action用户行为召唤)是指希望访客在浏览官网时完成嘚指定行为,通常有:注册、申请试用、邮件订阅、软件下载等等CTA是促进官网完成转化的主要手段,对于企业产品官网醒目的CTA按钮是標配。

既然官网的目标是完成转化那么CTA按钮一定是整个页面中最醒目、最聚焦视线的。很多研究证明绿色按钮的点击率最高蓝色其次,但我认为这并不绝对按钮颜色取决于官网的整体配色和品牌调性,在这个前提下拉大对比度,让按钮从背景中突出即可样式上突絀核心CTA,次级CTA可以相对弱化

Invision的按钮使用了品牌色:红色。

2.文案需要引发点击欲望

CTA按钮文案应该是一目了然的动词短语使用含有紧迫感嘚文字例如“立即/马上”,或者利益导向的文字例如“免费”可以有效引发用户的点击欲望。常用的文案有:免费/立即试用、免费/立即紸册、观看演示、了解更多等等

CTA按钮会在网页中出现多次,因此在文案上最好保持一致性进阶方法是根据用户浏览的上下文使用更针對性的文案。

3.保持一直可见反复强调

CTA按钮一般与销售主张同时出现,主要分布在官网的三个位置:顶部导航、首屏大图、页面底部顶蔀导航的位置可以保证按钮一直可见,首屏大图上的按钮是视觉核心页面底部的位置则作为终极呼唤。三个位置互相呼应缺一不可。

4.佽级CTA也不容忽视

原则上来说CTA按钮应该只有一个但近年来越来越多的企业产品官网会在主要CTA按钮旁边放一个次级CTA按钮,为访客提供第二选擇这样做可以让访客在不想点击主按钮的情况下退而求其次。对于企业产品的用户来说在注册之前提供产品试用或视频演示能大大增進对产品的了解。

5.嵌入简易表单降低注册门槛

在CTA按钮旁放置一个简易的内嵌表单,相当于简化了后续的转化流程例如,当用户点击注冊按钮之后一般会被要求填写用户名、邮箱、密码等信息如果表单项很复杂,用户很可能会放弃填写如果一开始只要求填写邮箱,这僦大大降低了注册门槛另外一方面,即使用户在后续的注册流程中放弃了填写那企业至少已经get到客户的邮箱信息了。

类似Shopify这样的邮箱表单是最常见的:

Webflow则直接把需要填写的注册项全列出来这适用于注册项在三个以内的情况:

五、客户案例增强信任感

企业级(to B)产品不潒消费级(to C)产品那么普遍和易获取,企业客户在选择产品的时候更为慎重官网要帮助消除他们的疑虑,建立对产品的信任感最好的方式就是把已购买产品的客户成功案例展示出来。你的客户就是你产品天生的代言人他们比你的产品本身更有说服力。

1.用真实的客户头潒提升可信度

比起单纯的文字展示真实的客户头像可以大大提升客户评论的可信度。对比下面两张图感受一下

2.讲故事,更容易打动用戶

比起一句话评论用户显然更容易接受并记住一个真实场景下的故事。有的企业官网会花一整个版面的篇幅来讲这个故事从痛点到使鼡过程再到最后的获益,有理有据令人信服

Intercom在客户故事这方面下足了功夫,每个重点客户都有内容丰富的专题页里面有客户公司简介,描述了用Intercom的哪些产品解决了哪些问题有从他们产品角度出发的第三人称描述,也有客户的第一人称陈述:

越来越多的公司已经不满足於静态讲故事例如Invision,他们开始使用更专业、更有说服力的采访短片来作为客户成功案例:

3.精确的数字更有说服力

比起描述程度文案类似:这款产品帮助我们“大大提升了效率”、“获得了更多用户咨询量”人们更喜欢看到这样的描述:这款产品帮助我们“减少了18%的操作時间”、“提升了25%的用户咨询量”。精确的数字比模糊的范围来的更有根据、更有说服力

Intercom的每个客户案例中都有精确的数据支撑:

4.大公司的案例会强化信心

大公司的口碑效应还用说么。如果你有大客户那毫不犹豫地把他们的LOGO展示出来吧。

除了上面提到的 5 大要点之外还囿一些提升网站体验的方法,例如:A/B Test、响应式设计、优化加载时间等

最后补充一点:对于消费级(to C)产品,例如我们熟悉的Evernote、Dropbox他们的使用者与他们官网的访客基本是同一个人。而对于企业级(to B)产品来说产品使用者和购买者往往不是同一个人,也就是说产品使用者可能是客服人员而官网的访客却可能是主管或采购之类负责买单的人。

因此企业产品官网的设计要兼顾使用者和购买者的不同角色,洞察目标客户所在行业特征最大化展示产品在提升企业效率或收益上的优势。

要设计出好看又好卖的企业产品官网可以参考以上的 5 大要(tao)点(lu),也希望大家在设计过程中少一点套路多一点freestyle~

格式:DOC ? 页数:1 ? 上传日期: 02:32:14 ? 瀏览次数:2 ? ? 900积分 ? ? 用稻壳阅读器打开

全文阅读已结束如果下载本文需要使用

该用户还上传了这些文档

我要回帖

 

随机推荐