超实用的单页网站设计指南｜「学一学」（这都可以？）单页设计素材，

萨德基：周三无海洋学！这篇好文将给全校师生科学普及若想用白眉林中文网站，结构设计时有什么样基本上功，有什么样杰出实例能先进经验，以及variations所推荐两大波专精的白眉林中文网站资源，蔬果分量当然足，电池时间到 >>>

@十萬個為什麽 ：白眉林结构设计，是一项处置较大型中文网站的极佳基本上功，甚至有些中文网站你可能认为一张网页不乐意，也同样适用。从更易保护，到减少频宽占用，采用白眉林中文网站的好处数不胜数。

倘若你应对的是个较大型中文网站，一般来说只有几个网页的那种，能考量采用白眉林结构设计，看看它与否能精简工程项目，对采用者更加友好。继续写作，你将了解它的好处，何时采用（或不该采用），还有一些你该遵循的极佳惯例。

白眉林结构设计的好处

很显然，白眉林结构设计绝非大部份工程项目的理想选择。但倘若可能的话，有两大堆理由采用它。

直观功能强大

默认情况下，采用者要下载白眉林中文网站，只要知道如何慢速就行。你也能加入斜线或其他下载暗示，但除了少数例外，其实慢速就足以让采用者在各部份间穿行。

Green13

完全不用担心采用者深陷多层导航系统中，连续不断地寻找他们所要的东西。假如网页上有数个部份，页头或其他导航系统镜像一般来说很有帮助，不过即使没有它，中文网站依然是可用的。

保护起来更快速、更简单

这两点绝非断然，编码良好的白眉林中文网站，或许编写起来比页中文网站更快。结构设计过程有时能花更少的时间，虽然这依赖于白眉林中文网站的精确性。

Andreaballerino

一旦你脑子里有基本上的布局，白眉林中文网站还能利用某些特定的结构设计束缚来Grandvaux。尤其圣索弗页中文网站来说，白眉林中文网站各个部份要保持点对点衔接。假如你已经明确什么样能做什么样不能，这类束缚的确能加速网页开发。

它迫使你进行精简

这条构筑了上面一点。当你只有一个网页要处置，你不得不把一切精简为它最基本上的形态。不再需要两本页毫无价值的市场宣传。你要隐晦、隐晦。

Varsity

更具SEO潜力

高质量的站内镜像，是中文网站在下载器中的表现的重要组成部份。虽然下载器并不是很多中文网站要的最大流量源，它依然重要。

白眉林中文网站的镜像总是指向自己。下载器截取时，这能增加中文网站的权重。

写实的手法促使采用者有所行动

白眉林中文网站往往从写实角度出发，这两点页中文网站可不擅长。这能促进转换，激发采用者采取行动。

Wild

人们习惯于倾听故事情节，不论在线上却是实体店，所以这两点有着显而易见的采用者新体验优势。我们小时候就开始写作和听故事情节，于我们来说，这是自然而然的事情。

更易组织机构

再也不需要组织机构两列列许许多多的网页美树网页了。无需话虽如此每个网页是父级却是子级。也没有繁杂的导航系统工具栏美树工具栏。大部份都在两本上。是要包含导航系统镜像，却是让采用者慢速，这依赖于你，就看与否有助于提升采用者新体验。中文网站假如有数个网页，是当然不会这么考量的。

Stefansohlstrom

减少频宽占用

虽然不像从前，对服务器来说已经不成问题，不过想想近年来有多少采用者通过移动设备访问你的中文网站。减少中文网站的频宽占用，会赢得流量有限的采用者的感激。

消灭了移动版中文网站

当然，响应式结构设计不只限于白眉林中文网站。但即使采用了响应式结构设计，中文网站越复杂，让它适应小屏幕却是愈发困难。白眉林中文网站并不复杂，这是必然的。运用响应式结构设计总体来说更容易。精简导航系统和类似改变，也更容易成就适用于小屏幕的结构设计。

Bearonunicycle

要不要用视觉差慢速？

视觉差慢速可能是互联网中发生过的最美妙的事情，也可能是个被滥用的噱头，来蹂躏我们下载器，这依赖于你怎么看。无论你站在哪一方，它似乎近期并不会消失。

就我来说，我希望有时间和地方来实现视觉差慢速。这个效果对于某些白眉林中文网站大有裨益，而对于另一些则是噱头，甚至更糟：难以采用。关键是要明确一点，你采用视觉差慢速真的能提升中文网站的功能强大性吗，却是因为你觉得它看起来很酷？

假如要采用视觉差慢速，还要考量一件事，采用Javascript却是纯CSS技术来实现。关于这两个选择，请参见资源部份了解更多信息。

何时采用白眉林中文网站，何时不用？

虽然有白眉林中文网站大有好处，但它也不是完美的全尺寸适配方案。虽然很多时候白眉林中文网站比页中文网站更合理，但也有很多时候不应该采用白眉林结构设计。

总之，倘若你的中文网站只有少数网页，白眉林中文网站或许是最佳选择。将一切浓缩在一个网页上，能让中文网站整体具有更现代的外观，假如内容精简，那么白眉林中文网站能让它看起来更丰富。

白眉林中文网站的另一个普遍案例，就是发布预告网页。它一般来说是白眉林中文网站，带有新闻邮件的注册表单。多数情况下，发布预告期间面向大众的信息很容易组织机构在一个网页上，所以，结构设计这些网页时优先考量这种风格是很合理的。

Clientsy

产品单一的电商中文网站，也是白眉林中文网站表现杰出的领域。假如你只卖一种产品，无论它是实体或是虚拟的，何必劳烦采用数个网页呢？一个简单的白眉林中文网站才是更好的销售工具。

Franzsans

可能你觉得更复杂的电商中文网站不适合用白眉林中文网站，但它依然可行。当然，有十多种产品的中文网站中我会避免采用，不过单张网页也足以轻易支撑一个简单的在线商店，通过弹出窗口来承载产品详情和支付流程。

Simplygum

不该采用白眉林中文网站的情况十分明确：庞大、复杂，或要保有海量信息的中文网站不适合做成白眉林中文网站。在这些情况下，采用相对传统的中文网站结构更加明智。

混合型中文网站

虽然有大量的白眉林中文网站存在，但也有很多混合型中文网站。它给人印象是个白眉林中文网站，但通过ajax、弹出窗和类似技术，它事实上包含了页内容。

中文网站Dang & Blast就是这方面的极佳案例。

Dangblast

假如无法让大部份东西彻底融入单个网页，这会是和很好的解决方案。

说到白眉林中文网站，某些站点用了某种“取巧”的办法。它的主站是个白眉林中文网站，但在其他域名下也有个博客（有时是Tumblr或托管在WordPress.com的中文网站）。这么做没有问题，它能突出主站的信息，也不用舍弃博客带来的好处。

白眉林中文网站的极佳惯例

杰出结构设计的多数准则，在白眉林中文网站中依然适用，其实也适用于任何中文网站结构设计。还有一些额外的东西需要牢记，其中有些之前已经提到了。

保持简单

结构设计假如对于你试图表现的内容来说过于复杂，对你和你的采用者都没有任何好处。相反，要尽可能精简结构设计和内容，还能表达出你要的信息。

Petertoth

导航系统镜像却是有帮助的

正因为采用者能通过慢速来下载你的中文网站，但并不意味着这是最友好的方式。假如你的中文网站很长，有很多部份，这两点尤其正确。除非有特别好的理由，却是应该加入直达特定部份的镜像，来使你的中文网站更加友好。

Fraudforcesummit

分割内容

分割内容

单个网页不代表一整个冗长部份。实际上也不该如此。将内容根据逻辑划分为几大块，采用者才能更容易找到他们所需。

Ritchiejacobs

让大部份的背景都有所作为

白眉林中文网站常常有大幅背景。当然，有时候这些背景很朴素，或带有平铺纹理；不过也有白眉林中文网站利用大部份的空间来挥洒创意。前面提到了，这也有助于划分内容。背景未必要是单一的图片。能是一系列图片，假如这样做与内容更相符的话。

Johnjacob

白眉林中文网站的资源

白眉林中文网站的资源成百上千，还包括模版；我们这里重点关注表现突出的几个。

PureCSSParallax Scrolling：Keith Clark的这篇文章阐释了如何通过纯CSS打造视觉差慢速效果。假如你不想用JavaScript（或者不懂）的话，这是个很好的选择。

Skrollr：“为剩下的人准备的视觉差慢速”。这是个独一无二的库，适用于移动端和桌面。不需要jQuery，只有原生JavaScript。

Stellar.js：Stellar.js是另一个简单功能强大的视觉差慢速库。它提供了很多设置选项和iOS支持。

One Page Website Wireframes：假如你不确定如何构建你的中文网站，这个白眉林中文网站线框图集是很好的出发点。免费下载。这里（Graphicburger）还有第二集可供下载。

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提供独特的中文网站和模版集合，供你下载或购买。

结论

对各种中文网站来说，白眉林结构设计都是非常棒的选择。虽然它不是较大型中文网站的唯一结构设计方案，对很多工程项目来说它都是值得考量的。思考采用白眉林结构设计的理由，然后也思考不用的理由，再做决定。