随着今天的HTML和CSS进一步提高了网页设计师创造迷人的动画和视差效果的能力,新的网页设计已经出现,为他们的访问者提供迷人的体验。尽管这种设计可以吸引和诱惑,显示适量的动画,人物,和运动平衡,因此可能是一个挑战,一项棘手的任务。如果你是一个规划设计或自己的这样的一个网站,查看一些例子可能是明智的,会给你一些宝贵的想法如何创建它。下面,让我们来看看这些讲故事的网站的一些例子,这些网站是我们为您和您的方便而收集的。
Reverend Danger是一家专门从事互动设计的数字机构。在他们的网站上,他们把有趣的人物融入到半平面设计中,并使用CSS动画使他们更有趣。导航是用户友好和有趣的,你将滚动到页面的最后。人才花园是一个平台,为有才华的艺术家和创新者提供一个社区。在他们网站的首页,你会看到一个创意和信息的介绍,什么是这家公司是通过滚动鼠标滚轮。它会告诉你他们的校园,活动,他们参与的公司,以及这家公司背后的人。mariomuseum of mario由HTML5 Pub的people of HTML5创建,它位于IGN,为你提供了一个关于超级马里奥系列在不同时代是如何发展的时间表。在时间轴中,许多效果通过HTML5、CSS和视差被整合在一起,在每个时代都提升了用户体验。
网站可以通过不同的方式导航:左边的面板、鼠标滚动条和键盘上的箭头。Jess和RussThis下一个功能是一个婚礼邀请,但不是一个简单的。这个网站首先通过时间轴讲述了新娘和新郎的故事——新娘在右边,新郎在左边。故事线也充满了视差图像和书法字体,使整个故事线更有趣。最后,邀请函会从信封中弹出,要求回复。每一滴水每一滴水都是一个娱乐性和知识性的网站,旨在通过提高人们对日常用水量的认识来减少水资源浪费。这个网站结合了平面设计和一些最小的动画贯穿整个故事,这是通过滚动或点击页面右下角的箭头图标导航。在页面的最后,有一个视频可供读者观看,以获得一些如何在日常活动中节约用水的提示。奥林匹克故事奥林匹克故事是一个网站,旨在讲述历史上关于冬季奥运会的故事和有趣的事实。您可以使用键盘上的箭头在事实和时间轴中导航。这下一个网站讲述了现实主义和平面设计如何在数字设计领域争夺主导地位的故事。网站设计处理不同的效果,如视差滚动,CSS动画,以及贯穿故事线的时间扭曲效果。
总的来说,这个设计足够有创意,足以吸引读者的兴奋和乐趣。最后一部分展示了inTacto的幕后人员,他们创建了这个站点。这是另一个由inTacto设计的网站。该设计使用视差滚动,有效地说明了火箭飞船起飞到太空。它通过展示一个时间表,展示了该公司在不同阶段的成就、合作关系和扩张,传达了该公司在数字前沿领域的十年历程。英国能源消费指南EvoEnergy,一家太阳能专业公司,创建了这个网页设计,展示了英国能源消费的互动指南。这说明了过去几十年所利用的能源。它使用图表、图形和其他信息图形,这些图形因其生动的颜色而更加引人注目。奴隶制足迹是一个谴责现代奴隶制的组织。web设计使用平面设计来解释奴隶制是如何发生的。视差滚动的作用使一些香料的表现。当你向下滚动的时候,这些段落是用手和其他各种工具创造性地放到合适的位置上的。下一个网站是关于水力压裂的。故事情节基本上讲述了这个过程是如何运作的,以及它是如何危害环境和健康的。该网页采用了平面设计与噪声纹理。Babel the KingBabel: the Cat Who Would be King是一款面向儿童的互动应用程序。网页设计是一个丰富多彩的环境,也是专门为孩子们设计的。