如果你应对的是个小型网站，常日只有几个页面的那种，可以考虑利用单页设计，看看它是否能简化项目，对用户更加友好。连续阅读，你将理解它的益处，何时利用（或不该利用），还有一些你该遵照的绝佳老例。
单页设计的益处
很显然，单页设计并非所有项目的空想选择。但如果可能的话，有一大堆情由利用它。
直不雅观易用
默认情形下，用户要浏览单页网站，只要知道如何滚动就行。你也可以加入箭头或其他浏览暗示，但除了少数例外，实在滚动就足以让用户在各部分间穿行。
完备不用担心用户身陷多层导航中，无休止地探求他们所要的东西。如果页面上有多个部分，页头或其他导航链接常日很有帮助，不过纵然没有它们，网站仍旧是可用的。
掩护起来更快速、更大略
这点并非既成事实，编码良好的单页网站，或许编写起来比多页网站更快。设计过程有时可以花更少的韶光，只管这取决于单页网站的繁芜程度。
一旦你脑海中有基本的布局，单页网站还能利用某些特定的设计约束来加快进程。尤其较之于多页网站而言，单页网站各个部分要保持无缝衔接。如果你已经明确哪些能做哪些不能，这类约束的确能加速页面开拓。
掩护也更大略。当你只须要处理一个页面，掩护事情就大大简化了，只要网站本身编码良好。
它迫使你进行简化
这条构筑了上面一点。当你只有一个页面要处理，你不得不把统统简化为它们最基本的形态。不再须要一页页毫无用途的市场宣扬。你必须刀切斧砍、开门见山。
更具SEO潜力
高质量的站内链接，是网站在搜索引擎中的表现的主要组成部分。只管搜索引擎并不是很多网站必须的最大流量源，它们仍旧主要。
单页网站的链接总是指向自己。搜索引擎抓取时，这可以增加网站的权重。
叙事的手腕匆匆利用户有所行动
单页网站每每从叙事角度出发，这点多页网站可不善于。这可以促进转换，引发用户采纳行动。
人们习气于聆听故事，不论在线上还是线下，以是这点有着显而易见的用户体验上风。我们儿时就开始阅读和听故事，于我们而言，这是自然而然的事情。
易于组织
再也不须要组织一列列数不清的页面和子页面了。无需多虑每个页面是父级还是子级。也没有繁杂的导航菜单和子菜单。所有都在一页上。是要包含导航链接，还是让用户滚动，这取决于你，就看是否有助于提升用户体验。网站如果有多个页面，是绝对不会这么考虑的。
减少带宽占用
只管不像从前，对做事器而言已经不成问题，不过想想近年来有多少用户通过移动设备访问你的网站。减少网站的带宽占用，会赢得流量有限的用户的感激。
消灭了移动版网站
当然，相应式设计不但限于单页网站。但纵然采取了相应式设计，网站越繁芜，让它适应小屏幕还是愈发困难。单页网站并不繁芜，这是一定的。利用相应式设计总体来说更随意马虎。简化导航和类似改变，也更随意马虎造诣适用于小屏幕的设计。
要不要用视觉差滚动？
视觉差滚动可能是互联网中发生过的最美妙的事情，也可能是个被滥用的噱头，来蹂躏我们浏览器，这取决于你怎么看。无论你站在哪一方，它彷佛近期并不会消逝。
就我而言，我希望有韶光和地方来实现视觉差滚动。这个效果对付某些单页网站大有裨益，而对付另一些则是噱头，乃至更糟：难以利用。关键是要明确一点，你利用视觉差滚动真的能提升网站的易用性吗，还是由于你以为它看起来很酷？
如果要利用视觉差滚动，还要考虑一件事，利用Javascript还是纯CSS技能来实现。关于这两个选择，请拜会资源部分理解更多信息。
何时利用单页网站，何时不用
虽然有单页网站大有益处，但它们也不是完美的全尺寸适配方案。虽然很多时候单页网站比多页网站更合理，但也有很多时候不应该利用单页设计。
总之，如果你的网站只有少数页面，单页网站或许是最佳选择。将统统浓缩在一个页面上，能让网站整体具有更当代的外不雅观，如果内容精简，那么单页网站可以让它看起来更丰富。
单页网站的另一个普遍案例，便是发布预报页面。它们常日是单页网站，带有新闻邮件的注册表单。多数情形下，发布预报期间面向大众的信息很随意马虎组织在一个页面上，以是，设计这些页面时优先考虑这种风格是很合理的。
产品单一的电商网站，也是单页网站表现精良的领域。如果你只卖一种产品，无论它是实体或是虚拟的，何必劳烦利用多个页面呢？一个大略的单页网站才是更好的发卖工具。
可能你以为更繁芜的电商网站不适宜用单页网站，但它仍旧可行。当然，有十多种产品的网站中我会避免利用，不过单张页面也足以轻易支撑一个大略的在线商店，通过弹出窗口来承载产品详情和支付流程。
不该利用单页网站的情形十分明确：弘大、繁芜，或必须保有海量信息的网站不适宜做成单页网站。在这些情形下，利用相对传统的网站构造更加明智。
稠浊型网站
虽然有大量的单页网站存在，但也有很多稠浊型网站。它们给人印象是个单页网站，但通过ajax、弹出窗和类似技能，它们事实上包含了多页内容。
网站Dang & Blast便是这方面的绝佳案例。
如果无法让所有东西彻底融入单个页面，这会是和很好的办理方案。
说到单页网站，某些站点用了某种“取巧”的办法。它们的主站是个单页网站，但在其他域名下也有个博客（有时是Tumblr或托管在WordPress.com的网站）。这么做没有问题，它能突出主站的信息，也不用舍弃博客带来的好处。
单页网站的绝佳老例
精良设计的多数准则，在单页网站中仍旧适用，实在也适用于任何网站设计。还有一些额外的东西须要牢记，个中有些之前已经提到了。
保持大略
设计如果对付你试图表现的内容而言过于繁芜，对你和你的用户都没有任何好处。相反，要尽可能简化设计和内容，还能表达出你要的信息。
导航链接还是有帮助的
正由于用户可以通过滚动来浏览你的网站，但并不虞味着这是最友好的办法。如果你的网站很长，有很多部分，这点尤其精确。除非有特殊好的情由，还是该当加入直达特定部分的链接，来使你的网站更加友好。
分割内容
单个页面不代表一全体冗长部分。实际上也不该如此。将内容根据逻辑划分为几大块，用户才能更随意马虎找到他们所需。
让所有的背景都有所作为
单页网站常常有大幅背景。当然，有时候这些背景很朴素，或带有平铺纹理；不过也有单页网站利用所有的空间来挥洒创意。前面提到了，这也有助于划分内容。背景未必要是单一的图片。可以是一系列图片，如果这样做与内容更符合的话。
单页网站的资源
单页网站的资源成百上千，还包括模版；我们这里重点关注表现突出的几个。
PureCSSParallax Scrolling：Keith Clark的这篇文章阐释了如何通过纯CSS打造视觉差滚动效果。如果你不想用JavaScript（或者不懂）的话，这是个很好的选择。
Skrollr：“为剩下的人准备的视觉差滚动”。这是个独一无二的库，适用于移动端和桌面。不须要jQuery，只有原生JavaScript。
Stellar.js：Stellar.js是另一个大略易用的视觉差滚动库。它供应了很多设置选项和iOS支持。
One Page Website Wireframes：如果你不愿定如何构建你的网站，这个单页网站线框图集是很好的出发点。免费下载。这里还有第二集可供下载。
One Page Love：One Page Love是压倒一切的单页网站凑集，里面有超过5000个网站案例，并且一贯在更新。他们还主打大量模版和其他资源。
Start Bootstrap：Start Bootstrap集成了海量的免费单页网站Bootstrap主题。主题适宜机构、自由职业者、作品集、着陆页等等。
One Page Love Templates：除了丰富的网站凑集，One Page Love也供应免费和收费的模版。
One Page Mania：One Page Mania供应独特的网站和模版凑集，供你下载或购买。
结论
对各种网站来说，单页设计都是非常棒的选择。只管它们不是小型网站的唯一设计方案，对很多项目而言它都是值得考虑的。思考利用单页设计的情由，然后也思考不用的情由，再做决定。
译者：可乐橙；译文地址：http://colachan.com/post/3418
可乐橙，微信公众年夜众号：可乐橙（colachangreen）。UI/UX设计师，关注互联网，关注科技。现居杭州，与小伙伴们正在创业途中。或许不是一名精良的设计师，至少是个快乐的设计师。
