良好 的企业网站计划 有哪些「 良好 公司网站计划 」（企业网站规划）
?
翻译：徐莹
原文作者：ANNA CHEBANOVA
原文链接：https://steelkiwi.com/blog/how-design-great-homepage-examples/
本文由非科班计划 翻译小组翻译
在本日 如许 一个互联网+期间 ，绝大多数企业都意识到通过线上资讯来吸引更多的潜伏 客户是多么的紧张 。这些潜伏 客户对你的公司及产物 印象的优劣 ，很洪流 平 上取决于你在网站计划 上投入精力 的多少 。以是 花时间构思一个好的网站计划 ，特别 是主页部分 的计划 非常关键。
用户点击完搜刮 结果 后起首 跳转到的页面就是该网站的主页，主页直接影响到访客对该公司及其产物 的第一印象 ，以是 必须把这个页面尽大概 计划 得友爱 且抓人眼球。
在欣赏这20个良好 的主页计划 之前，我们先来先容 一下当代 主页计划 应包罗 的根本 要素 。
有效 先容 你的公司的本领
一个主页最紧张 的部分 在于它可否 有效 地吸引访客的留意 力。以是 关键在于，你的主页可否 在几秒钟内解答访客心中的三大疑问：
1.这是个什么性子 的公司？
2.这个公司具体 是做什么的？
3.和竞争对手比 ，你的上风 在哪？
假如 你的主页可以或许 正确 清楚 地答复 这三个题目 ，那么访问者就能在相识 你的公司的底子 上有把握地购买你的产物 及服务。
很多 企业有其独特的标语或简短的标语 ，用以凸显其代价 主张（UVP） 。他们通过简洁 的语言转达 出公司理念 ，与访客创建 起一种接洽 。以是 这些标语常常 出如今 主页上，并大量地用于公司的品牌营销战略 。
自顺应 、简约的计划
访问者会通过PC 、平板电脑或智能手机等装备 登入你的网站 。随着环球 移动遍及 率的不绝 进步 ，最新的数据表现 将近 60％的网站流量是移动装备 提供的。
为了确保你的网站有更好的用户体验 ，在页面计划 时思量 其自顺应 性很关键。自顺应 计划 意味着无论通过什么装备 接入你的网站，用户的体验是雷同 的或非常相似的 。起首 ，导航要计划 的方便，使得用户可以快速欣赏 差别 的页面；其次 ，功能必要 雷同 ，如许 用户无需切换装备 即可访问网站的全部功能；末了 ，计划 要简单 ，如许 才华 确保你的计划 在差别 尺寸的屏幕上都可以清楚 地转达 。
一个风格同等 且相应 及时 的网站将有助于保持品牌的着名 度，为访问者跨平台与公司保持接洽 提供方便。
动态感，互动性和接洽 性
人们更倾向于记取 那些能变更 他们感情 的事变 。将这个秘诀 应用到你的主页计划 上可以为访问者创造一种非凡的体验 。
一个动态主页可以让访客保持心情愉悦 ，在利用 的过程也更轻易 留下深刻的印象。而充实 利用 变革 的插图、动画、视频或迷你游戏可以加强 开辟 者和用户之间的互动性。在页眉和页脚加迷你动画如许 的小细节，也是进步 用户体验的不错选择 。
动态布局 可以让访客相识 你的团体 想法。假造 实际 或360°场景环游 页面可以更立体地向用户展示公司业务及其产物 ，到达 巩固其与品牌之间接洽 的结果 。
定期更新主页内容 、及时 反映客户所需或分享公司的最新动态 ，这些都是使网站保持活力并与访客加强 接洽 的方式 。IBM.com提供了很多 动态主页布局 的案例。
换言之，在计划 和布局 主页时采取 动态方式可以加深你与用户之间的相助 ，为他们提供风趣 而又独特的体验 ，如许 他们就会时不时地上你的网站逛逛啦！
简单 、流畅 的导航
整个网站的利用 过程应该是很流畅 的。假如 访客在访问网站过程中产生了挫败感，那么这种负面感情 将会极大地影响你们之间的关系 。
一个奇妙 且直观的主页计划 起首 应该利用 简单 的导航，通过颜色和对比度等视觉分隔本领 来打造易于辨认 的菜单。其次，差别 页面标签之间应具有公道 的逻辑关系 ，如许 用户才华 快速找到导航选项卡或按钮的位置。确保访问者知道本身 在网站所处的位置也黑白 常紧张 的，因此选定之后产生一些视觉变革 （如：突出表现 ，对比度或颜色更改）可以带来不一样的结果 。一个良好 的主页计划 可以使访问者在差别 页面和分屏之间轻松游艺 ，时候 保持与用户的精密 接洽 ，以激起他们继承 访问的欲望。
得当 参加 招呼 性用语
你的主页有人访问了！这是一个很好的开始，但你要怎么留住他们呢？很多 当代 主页通过具体 的招呼 性用语（CTA）吸引访客留意 ，比方 “立即 注册”、“参加 我们 ” 、“免费试用”、“立即 订阅”等等，这里有一些可以增长 点击率的CTA示例
网页应该致力于吸引目标 用户的留意 力，引导其进一步相识 公司 ，找到本身 想要的信息，留下接洽 方式，或以其他方式与公司举行 接洽 。恰到长处 的CTA可以引导访问者在你预期的路径上欣赏 ，如许 本来 只起到宣传手册作用的主页将从变为强有力的贩卖 引擎。
和期间 标准 保持同等
就在不久之前，计划 的天下 还是 相称 寂静 、封闭和对称的 。随着平面计划 技能 的日趋成熟，计划 师们变得越来越大胆，开始挑衅 既有规则并采取 创新性更强的计划 。
如今 ，我们已经看到越来越多的不对称的网站布局 ，由于 计划 师们已厌倦美满 均衡 的天下 ，那偶然 意味着单调 、无聊和教条。采取 极简主义本领 构建框架 ，并在定位元素和色板选择上参加 更多创意，计划 师们通过玩转计划 创造奋发 民气 的新标准 。
只管 云云 ，大多数当代 网站通常还是 由以下部分 构成 ：
创意的布局
相干 CTA用语
奇妙 运用的留白
令人愉悦的配色
符合 的字体元素
高互动性、大片式用户体验
动听 的配景 音乐
总的来说 ，主页关系到访问者对你公司的第一印象，以是 它必须能有效 地先容 你的公司及产物 。你还必要 思量 到计划 的顺应 性，同时确保该页面是动态的、有吸引力的 、易于欣赏 地 ，如许 用户才会更乐意 去注册。根据必要 更新你的主页和网站，保持你线上内容的话题性和有效 性，如许 你的网站肯定 会有很高的回访率！
先容 完一个良好 的主页所需的理论部分 ，下面让我们来看看20个顶级的首页计划 实例，分析这些理论在实践中是怎样 举行 运作的 。
1.PLEX.TV
这个计划 幸亏 哪？
资料丰富，但简便 。利用 视频和滑动客户保举 页等互动方式，利用 最少的笔墨 乐成 形貌 了产物 的内容。
通过以内容为主的方式让用户获取产物 的具体 信息 ，如这款产物 可以在那边 利用 、怎样 利用 以及怎样 开始利用 。
用户提示语的公道 放置。页面计划 和布局 不但 实用 于新用户，也为想添加更多装备 的老用户提供方便。
访问网站： Plex.tv
2.SLACK
这个计划 幸亏 哪？
简单 的主页，丰富的标语 。
没有不须要 的动画或太过 装饰分散用户的留意 力。消息清楚 且切中关键 。
团体 计划 与应用程序的表面 保持同等 ，使整个品牌具有连续 性。
纵然 有很多 的内容，导航仍旧 清楚 简单 。
访问网站： Slack.com
3.Dropbox
这个计划 幸亏 哪？
干净、简单 的计划 ，幻化 多端的布局 。
吸引人的搞笑手绘 ，有效 倾销 产物 的语言。
一个强有力的标语，充实 形貌 了产物 功能：“随时随地，与人分享 ” 。
小贴士：Dropbox是一个闻名 的品牌 ，该公司如今 重要 致力于推广他们新的文档创建工具Paper 。Paper的主页被分割成三个色块，分别代表的产物 的三个差别 部分 ：业务办理 方案，文档工具和经典应用。简约、清楚 的计划 与Dropbox的其他品牌相同等 ，但功能强大 到独树一帜 。
访问网站： Dropbox.com
4.STORYTRAIL
这个计划 幸亏 哪？
当代 元素计划 和易于操纵 的导航。
将其功能清楚 地展示在首页，便于访客相识 。
通过毫无违和感的动画表现 其特性 。
笔墨 陪伴 流畅 的动画结果 出现和消散 ，让访客产生一种参加 感，想继承 往下欣赏 。
访问网站： Storytrail.co
5.MEETTHEGREEK
这个计划 幸亏 哪？
配景 视频有两个目标 ：吸引访客的留意 力 ，创造风趣 的体验。
餐厅在主页设置了如许 的一个主人公脚色 ，乐成 媚谄 了用户，与用户创建 起精密 的感情 接洽 ，让他们有进一步探索的欲望 。
柔和的颜色和简单 的字体让访客产生一种好像 在与主人公交谈 的感觉。
友爱 的计划 和简单 的导航与配景 视频融为一体。
点击菜单栏时，屏幕会分割成两部分 。如许 访客在欣赏 相干 信息的时，视频也在屏幕另一边同步播放 。
主页计划 让人布满 积极的能量 ，并天然 而然地产生一种“内部”视角。
访问网站： Meetthegreek.com
6.FORHONOR
这个计划 幸亏 哪？
主页计划 利用 户一步步沉醉 到游戏天下 。
有一套良好 的字体与之美满 共同 。
打击 剑的音效渲染了团体 氛围。
与用户的微交互依照 着简单 的规则：触发 - 规则 -反馈 -循环模子 。微交互是一个无休止的循环 。
访问网站： Forhonor.com
7.ENJOY-AIIA
这个计划 幸亏 哪？
简约 、豁亮 、夺目 标 计划 。
符合 的字体组合。
清楚 可视化的操纵 按钮在表现 品牌特性的同时，与用户形成互动 。
在不影响团体 风格、保持品牌认知度的条件 下，每个页面通过个性化方式向用户展示不一样的东西。
访问网站： Enjoy-aiia.com
8 TRELLO
这个计划 幸亏 哪？
主页计划 明白 指出Trello差别 于那些老掉牙的任务 管理程序。
给出一个强有力的标语 ：“让你的事变 井井有条 ” ，并通过简短的图文表明 Trello是怎样 做到这一点的 。
时尚的图标元素（如萌萌的哈士奇）让用户对该品牌有一个好的印象 。
风格化logo提示相应的服务。这些小细节会给访问者留下深刻的印象。
豁亮 的颜色组合奇妙 地转达 出他们提供的服务兼具意见意义 性和专业性 。
访问网站： Trello.com
9.SOUNDCLOUD
这个计划 幸亏 哪？
个性 、豁亮 、大胆的页面计划 。
以跳跃的颜色突出关键元素，提示访客留意 。
通过单一的主页就能同时吸引到作曲家和听众的留意 。
简短但正确 的标语 反映该应用的宗旨。
访问者不消 离开 页面就可以体验相应的服务，享受顶级音乐带来的爱好 。
访问网站： Soundcloud.com
10.IGEGROUP
这个计划 幸亏 哪？
该网站有着豁亮 的颜色和简单 的情势 。
简约的布局 和难以置信的排版将用户眼光 轻松锁定在关键位置。
主屏的配景 动画动员 了感情 ，在显现 公司成绩 的同时，让访客留意 到该公司的业务本领 。
放置在页面的一角的小巧奖杯图标展示了其得到 的荣誉，在增长 代价 和信托 感的同时，引发 访客的好奇心 。
动画流畅 ，相应 及时 。
时尚的视差滚动结果 与布满 当代 感的分屏画面美满 契合。
加载动画保持该公司的风格 。
访问网站： Igegroup.com
11.SAGMEISTERWALSH
这个计划 幸亏 哪？
这是最具创意的主页计划 之一，通过机动 的导航选项卡展如今 线网络摄像机拍摄的特性。你可以随意点击地板上或标语上的任何元素。
你可以观察如今 办公室里的人在做什么。
导航标具名 体雅观 ，页脚中也出现了相应的导航 。
时下最盛行 的长滚动页面。
该公司大胆地展示了一个轻易 记取 的标记 ＆ ，这与他们的品牌符合 合 ，也与行业相干 。
访问网站： Sagmeisterwalsh.com
12.POTTERMORE
这个计划 幸亏 哪？
利用 低面计划 产生视差 。
在按钮、文本 、窗口弹出方式等细节处利用 动画结果 。
互动感十足的主页搭配着梦幻般的音乐。
干净的计划 ，没有一点冗余元素 。
光标的移动带来意想不到的结果 。
易操纵 的导航。
访问网站： Pottermore.com
13. 2050.EARTH
这个计划 幸亏 哪？
给人留下深刻视觉印象的360°交互式计划 。
直观、逼真 的界面。
强大 的视觉结果 激起访客进一步探索的好奇心。
让访客沉醉 于将来 天下 的配景 音乐 。
视频和图形的奇妙 运用抓人眼球 ，使访客乐不思蜀 。
访问网站： 2050.earth
14.TIPCOW
这个计划 幸亏 哪？
全部 相干 服务都在主页上突出表现 。
布满 盛行 元素且契合主题的视频。
时尚的配色 。
滚动页面共同 吸引人的标题以及符合 的的CTA按钮。
角落中突出表现 的“注册 ”按钮可以轻松找到。将重点放在交际 网络上，让粉丝有机遇 和他们最喜好 的乐队零间隔 交换 。
访问网站： Tipcow.me
15.MATCHA
这个计划 幸亏 哪？
优雅、轻盈 、干净的计划 。
绝佳的配色和字体组合（Playfair Display和Montserrat字体）。
公司任务 及其上风 清楚 展示 。
简单 时尚的菜单栏被突出表现 。
访问网站： Matcha.com
16.SUBSIGN
这个计划 幸亏 哪？
起首 映入眼帘的一个简单 到不能再简单 的标语 ，却以绝对的力气 形貌 了该公司的是做什么的。
全部 导航标签都共同 着超赞的动画 。
突出表现 的CTA按钮被静态地放置在右上角 ，如许 无论用户处在什么页面，都能快速的完成注册。
用户友爱 ，导航简单 。
访问网站： Subsign.co
17.ILIKETOFU
这个计划 幸亏 哪？
豁亮 的计划 ，淡出的动画捕获 用户的留意 力 。
产物 及其重要 特点一览无余 。
创意的加载页面。
简单 、风雅 的导航。
访问网站： Iliketofu.eu
18.STUDIOLOVELOCK
这个计划 幸亏 哪？
这是一个极具时尚感的不对称平面颜色计划 案例 。
大号、加粗的字体和易于阅读的排版使导航菜单更清楚 、有效 ，同时也有助于弥补 空间。
简单 却用心 的动画。
导航标签别致的放置方式 。
对公司任务 和上风 的清楚 形貌 。
访问网站： Studiolovelock.com
19.JACQUICO
这个计划 幸亏 哪？
它有着非常机动 的计划 布局 ，访问者可以在主页欣赏 好久 。
大量的动画元素吸引着用户 。
以游戏情势 举行 互动。
令人愉悦的柔和配色。
访问网站： Jacquico.com
20.VALAIRE
这个计划 幸亏 哪？
这个乐队的网站导航很不一样平常 。
俏皮的配色。
标示着新专辑的按钮放置在右上角，一系列的滚动页面勾起你的爱好 ，这个方案简直太赞了！
页面底部的订阅表单是一个迷人而风趣 的动画。
该网站有一个标记 性的网格计划 ，和动画结果 美满 共同 。通过如许 的方式将信息出现 ，访客会产生想进一步相识 这个乐队的欲望。
访问网站： Valaire.mu
开始动手 计划 一个良好 的主页吧 ，就本日 ！
老虎帮：laohubang.cn
欢迎 参加 学UI网25群：526438489
老虎帮第9期6月1日开学，增长 了8课新内容，报名前必要 稽核 底子 ，请加QQ群:499971705具体 相识 老虎帮高级课程。