单页网站建设!对于合适单个页面的小规模网站,有一些几乎是神奇的东西。它们可以高雅,易于导航,并在封闭空间中提供更佳客户体验。
虽然有一段时间大家回避单页网站,但用户第三拥抱它们(谢谢,移动!),你也应该如此做。
大家正在研究十个提示,想法,示例和建议,以帮助你为下一个网站制作工作激起想法。这可能是维持简单的正确机会,并使用单页方案!
1.在“页面”中考虑
在设计单一的滚动网站建设时,请考虑“页面”。
每一个卷轴应提供一个页面式体验,专注于单个元素。这为网站建设创造了独特的组织和步骤感。
Cote通过具备交替的浅色和深色(或完整照片)分色的“页面”来完美地做到这一点。当滚动一位内容结束而下一位内容开始时,用户可视地了解。
2.更长页面的时间线导航
对于单页网站而言,它们并不一直非常轻松。一些更好的单页设计是更长滚动,更长格式的网站。
对于这类项目,请考虑时间轴导航,以便用户一直了解他们在内容流中的地方。假如有重新检查的内容,它可以比较容易地跟踪你的地方与怎么样返回。
UV Hero用高度可视化的时间线导航功能,可以显示可见光谱中的每种颜色,由于它与设计中的内容有关。更好的部分?你可以单击任何颜色并向右跳到该内容。
3.页面导航
单页网站无需缺少容易见到的用户界面元素,比如菜单,尽管不少人都觉得。
你仍然可以用传统外观菜单(它可以帮助用户流动和搜索)。区别在于菜单链接会跳转到单页设计的特定部分。对于喜欢以这种方法导航的用户,他们甚至不了解你已经创造了这个好看的方法。
Happy Tools看着像一个多页面的网站,但它们都包括在一个页面上。菜单工作得很好,并为用户提供导航选择。
4.使其具备高度互动性
假如你期望用户继续滚动,交互式元素可以成为鼓励该操作的方法。
从视频到视差成效到动画或游戏化的触摸,交互性可以鼓励更多的移动和现场时间。单页设计特别这样。
Lobods具备愚蠢的风格,具备充足的互动性。有悬停动画,幻灯片和弹出元素与滚动文本。它们以一种帮助用户轻松浏览内容的方法汇集在一块。(这种设计的另一个好处是它包括足够的空间,以便更容易看到微妙的动作和交互。)
5.全屏在一个屏幕上
假如你没不少内容,那样一页式设计就能在一个屏幕上提供好的客户体验。
将此网站建设视为具备一些信息的大导航元素,然后是异地或联系链接。它可以非常不错地用于马上推出的设计或简单的投资组合登陆页面。
Sylvain Theyssens为他们的投资组合设计做到了这一点。(它事实上有两页:一个可爱的“屏幕保护程序风格”动画,通过鼠标移动变成主要设计。)页面简单,信息丰富,让人印象深刻。单屏设计为你提供了所需的所有,不需要任何额外的妨碍。
6.马上推出设计
说到马上推出的网站,这是单页设计的完美作用与功效。
在大部分状况下,马上推出的页面内容不多 - 可能只不过徽标和介绍或联系信息。在大部分状况下,这可以非常不错地适用于一个页面,并且在主站点上线之前有效地借助用户时间。
绿色变色龙就是如此做的。one =网页设计特别好,由于非常酷的动画和有趣的文本用。它创造了一种期待感并唤起好奇心 - 这是你即将来临的页面中你期望的东西。
7.有点时髦
假如你想尝试一些有点不同或时髦的东西,单页网站可以是一个非常不错的游乐场。一个不一般的显示器适用于较小的设计,由于你不会过度做“方法”。
Rou Hun Fan用专业字体和背景网格来突出他的信息,作品集和作品。创意展示和简洁风格足以鼓励滚动非常短的时间,很合适投资组合。
8.给用户做点什么
为了维持参与并让用户对设计有兴趣,请在单页网站上给予他们不少帮助。
很多这类设计的一个失败是它们只不过长卷信息。用可点击的元素,号召性用语和要做的事情来分解。这类元素不仅能够帮助你确定用户对设计的需要(与它们是不是达到预期目的),还可以帮助他们维持较长期的互动。
Plethora打破了长卷的滚动,有很多的卡式按钮来预约旅游套餐。这类点击交互中的每个都用箭头标注,以创建一致的客户体验。
9.维持组织
将所有网站内容放在一个页面上,设计比较容易失去控制。但它也可以为内容创建一个有组织的画布。
当涉及到用一个页面时,紧密的网格和统一的结构可能是你更好的工具。用它们可以维持内容的有序组织和分组,便捷用户浏览和理解。
Podcasts Repo通过完美的播客网格可以做到这一点。该网站足够灵活,用此网格和样式可以参考需要增加到尽量多的内容项,而不会叫人不知所措。
10.明智地用Space
对于较长滚动或单页设计,更要紧的设计考虑原因之一是空间的用法。内容需要间隔开,以便明确打造内容更改,辨别操作,并且所有都易于阅读。(请记住,过多的滚动或许会引起一定量的双眼疲劳。)
Werner的Nomenclature of Colors是一个单页网站,内容丰富。该网站事实上是1821年的一本书的复制品。太空使这个设计工作。
具备明确网格和很多空白地区的类别和子部分增强了可读性和扫描性。这里有不少,但因为整个空间的用法,它感觉很平易近人。