在WordPress网站上创建美丽页面转换
好的，所以你之前听过它:人类的注意力跨度比金鱼更短.如果你思考它，那就不是制作的公平比较.
你的宠物金鱼可能只有一些有趣的东西来看看你家里.他们可能偶尔调整电视上的任何展示或电影，但否则，它只是一堆家具，他们必须盯着看.没有太多的分心，对吗?但对于人类来说，这是一个不同的故事.
是否在我们周围的世界或数字空间中，有分心的加热器-他们都在竞争我们的关注.现在.这就是为什么有很多重点在于有效地设计网站.使用颜色和图像引起正确的情绪和反应.通过您的故事引导访客简单，易于找到的导航.放置直接的呼叫行动，准确地在何处以及当游客感到有动力做某事时.
我们尽可能地尝试开车的一点是您网站速度的重要性.如果您无法为访问者提供(附近)即时满足访问您的网站并在其中开设新页面，那么所有其他努力工作都是为了被淘汰.
在2000年后，您可以使用12秒的网站加载时间(当时的平均人类注意跨度).但在2016年，您正在处理更短的时间范围来勾勒你的"鱼".现在，我们正在观察大约8秒的平均注意力.然而，营销研究表明，在他们在网站上跳过船之前，您真的只有3秒钟才能获得某人的注意.
所以你做什么?
如果您强制访问者坐下来等待加载页面，您将失去它们-他们希望与您所设计的网站制作的转换.不要让他们有机会分心.如果你有一个网站，那将不可避免地需要一些时间来加载，或者你只想从页面到页面跳转一点PEP，将一些动画添加到您的页面转换中.
继续读取，或使用以下链接跳转:
- 更顺畅&更快的页面加载
- 为什么使用页面转换?
- 页面转换动画
- 基本页面动画
- 页面动画工具
更顺畅&更快的页面加载
有许多方法可以提高您的网站的速度.您可以使用插件(如HummingBird)以尽可能多的网站文件缩减和压缩.这总是一个开始的好地方.如果您希望减少由来自地球各地的访问者造成的任何滞后时间，也是必须进入网站的遥远服务器文件的延迟时间.
无论您使用的工具都要保持网站的速度检查，请考虑将您的页面转换有点寿命是一个好主意.
让我们说有人点击主页的链接，突然存在白色(不超过半秒)作为新页面加载.这可能会带一些人吃惊，让他们想知道为什么页面不立即加载.也许它甚至不是一个下一页加载的问题.让我们说，你有一个单一页网站，你的访客通过页面乱丢的静态横幅条钻孔.平面设计在保持简单的情况下非常伟大，但保持访客的注意力并不总是很好.
这是页面转换中的动画进来的地方.
为什么使用页面转换?
动画通常是为网页设计添加更多生活的好方法.但是，它应该战略性地使用，并应与网站的整体风格相处.这适用于基本元素动画(如迫使某人悬停在其上)以及从页面到页转换时强制旋转图标.
以下是动画尤其适用于页面转换的原因:
- 运动:正确的类型和右速度有助于让访问者在屏幕上作为您的站点加载在背景中的内容.
- 娱乐:如果您的动画允许某种形式的交互性，您可以让访问者在等待页面加载页面时积极与您的网站进行积极交互.
- 流:当您告诉您的网站的故事时，您需要从一个页面到下一个页面的平滑过渡.而不是依靠简单的页面改变，使用过渡元素，使故事能够无缝地移动.
- 悬念:旨在创建一种"流行音乐"或惊喜，因为访问者遇到它们-这些工作尤其适用于通过滚动显示不同的"页面"的单页网站.
- 现代化:具有正确种类的动画的网站看起来比静态对手更现代，无论是通过使用视频，视差滚动，以及在这种情况下，页面的转换.
如果您想最大限度地减少由较慢的装载站点引起的UX中的任何差距，或者只想让游客通过您的网站移动，请页面到页面动画是持有他们参与的好方法并提高转换率.虽然执行是至关重要的，但请记住.
此处有些提示，有助于在接近页面转换时可及时通行跟踪:
- 一个用动画乱丢的网站(页面转换或其他)可能只是分散注意力和不专业的看起来作为设计不明智的网站.
- 试图将您网站上的动画量保存到最低限度，以便在页面之间发生时，它具有持有访客注意的预期效果.
- 页面转换不应该是Jarring.他们应该有助于从您网站的一部分到下一个并与整体故事相关的顺利过渡.
- 过渡动画不必始终超过顶部.如果要在页面上使用兔子跳跃以指示加载进度，请参加.
- 保持您的页面过渡的风格.因此，如果您在两页之间使用了故事书页面翻转，则应在整个站点之间维护.
- 确保动画的速度对您想要的目标是有意义的.较慢的过渡往往不太令人震惊，更有效地控制访客的焦点.然而，快速动画倾向于将访客从一个州(几乎像一个叫醒电话)摇动，并将它们带入另一个相关的状态.
应该清楚的是，动画是将访问者从网站的一个部分引导到另一个动画.应该没有混淆他们正在看的或接下来做什么，并且应该始终存在两页之间的连续性感.
故事的寓意?
仔细选择动画.如果没有正确使用，他们可以对您网站的接待和商业声誉进行危害，作为一个糟糕的设计选择.访客不应该看到页面过渡并意识到您隐藏了一个缓慢加载页面，也不应该在第一个地点被为什么会感到困惑.过渡应该增强通过您的网站旅行的经验，并激励访客等待，看看您还有什么提供.
页面转换动画
在我们讨论如何进行WordPress中的建筑页面转换之前，让我们花点时间审查可能性.
旋转器
对于最基本的页面转换，您可以依靠页面中间的奇异旋转或旋转对象，让访客知道下一步.
domani是一个专门从事战略，营销和技术的数字代理.
平滑滑块
对于具有简约设计的网站，更简单的页面转换将最佳工作.平滑的幻灯片将为您提供一个简单的，但在一个页面到下一个页面的简单转换，同时为您的网站添加一个有趣的移动触摸.
这个有趣的网站测试您了解工具的程度.
页面翻转
如何设想您的页面移动?如果您正在构建作者的网站，您可能希望页面转换以模拟书籍页面的翻转.
3D对象
也许您的网站服务于创意，但更多的结构化艺术家类型(如设计师或开发人员).3D页面旋转可能会更好地工作.
烟幕
如果您的网站更倾向于戏剧性，您可以添加烟幕或其他自然类型过渡元素(无论您的网站的整体风格最佳).
train robber是一个基于洛杉矶和纽约的虚拟现实代理.
重建
在视差滚动网站上最常见的是，"页面"过渡可以像网站中央部件的解构和重建一样简单.通过这些转换，您将始终希望确保重建在屏幕的同一部分上发生，因此访问者不必找到它.
碎片是一个互动展览转向世界上最有趣的30个，但不幸的是濒危物种.
元素渐进
PAGE FACES一般往往更加细微过渡.但是，对于一些额外的流行音乐，您可以采取上面的重建的想法，并使用它在下一页的各个元素中淡化.
检查Loflo记录，了解一个美丽的页面渐渐消失.
loflo记录，歌手-songriter jane mcnearly的在线主页，是一个漂亮的例子元素褪色.
Basic Page Animation
上面的示例都演示了页面转换如何在正确的设置和正确的公司内工作.
- 风格与网站的整体氛围匹配.
- 动画很简单易于专注于.
- 运动有助于从一个页面到下一个页面的无缝和逻辑流量(通常从上到下或左右).
如果您刚刚入门页面转换，请考虑查看此页面转换样式的集合.他们都非常基本的本质上，但他们也在运动，方向和风格(特别是旋转)中提供足够的品种，以便您的网站的动画可以从其他人中脱颖而出.
记住:您的目标是为访问者提供从一个页面到下一个页面的无缝流;不要因为疯狂的古怪的翻译效应而压倒它们.有时，更简单的样式将是您网站最有效的选择.
现在，如果您已经准备好了，让我们谈谈如何创建这些转换.
页面动画工具
谈到网站动画时，您只能使用CSS，HTML和jQuery拉开这些影响.如果您不熟悉脚本或编码更新，从不担心.当然，WordPress确实有一些工具可以提供帮助.但是，重要的是要注意，虽然有WordPress插件来帮助您动画页面转换，但大多数都受到其功能的限制.因此，如果您更习惯于依赖WordPress插件和主题来帮助您构建网站，请务必相应地设置您的期望.
无论WordPress还是编码中的技能水平如何，这里都有一些工具，我们建议为您的页面转换带来一些额外的寿命.
-
页面滚动到ID
对于平滑滚动动画-垂直，水平，或者一些比这更复杂的东西-这个插件将帮助您设置.这也有一个非常全面的设置屏幕，您可以在其中调整动画速度，滚动样式，目标目的地或页面位置等.
此插件可能需要一些CSS编辑，以便将其正常工作，因此如果您易于进行所需的更改，只能使用此插件.
-
css动画库和教程
css动画是新的闪光灯，但它们在大多数浏览器类型中都更轻量级和工作.在向WordPress网站添加CSS动画时，您可以实现此处的几种方法.
- 您可以相应地编辑主题的样式表.为此，您需要知道要定义哪个属性以及将它们添加到样式表中的属性.如果您要去这条路线，你应该只使用CSS动画！插件，因为它会完成同样的事情.
- 您可以下载并使用此CSS3库的动画.您可以在该页面上测试每个效果，并在将哪种页面转换效果施加到您的网站之前.
- 记住早期的那些基本页面转换样本?嗯，Tympanus还创建了一个相当简单的教程，您可以用于对您的网站创建这些影响以及每个动画的源文件.
-
jQuery插件和教程
如果您愿意使用jQuery并正在寻找一些更高级的页面转换，这是您想要采取的路由.nino dezign网站将此非常有用的JavaScript插件和教程列表放在一起，以便您可以用来达到一些美丽的过渡风格.
- 有价值
- 可用
- 找到
- 可信
- 可访问
- 理想的
- 有用
包装
你以前听过过用户体验蜂窝吗?基本上，它铺设了你总是希望与您的网站相关的七个UX品质:
这些特征都是非常简单的想法，但他们在网页设计的背景下发出了很大的意义，并且我们与我们的在线观众有效地效果很好.他们不希望花哨的技巧，他们不想被不必要的过剩陷入困境.这对于您的网站整体而言，这对于页面过渡尤其如此.
您的目标建立页面转换应该是进一步加强UX，并让访问者与每个新页面负载一起参与.如果您可以通过从页面跳转到页面的一些引人注目的动作，您可以将它们保持对网站感兴趣，您可以削减许多人可能需要逃离其中的许多人，并给予他们有利于并信任自己的理由-建造品牌甚至更多.
