资讯
  • 首页
  • 网站建设
    定制网站报价
    网站建设方案
    模板建站
  • 小程序开发
  • 网校系统
  • 网站优化
  • 案例
  • 资讯
  • 问答
  • 帮助中心
  • 服务项目
  • 关于我们
  • 5个提升你的单页网站品质的设计要素(一)
  • 2019-03-12 13:06   分类:网站建设  阅读数量:阅读(3258)
  •      很明显,单页网站比多页网站更容易构建。事实上,要让一个单页的页面既有友好的用户体验又具有视觉吸引力往往要困难得多。

      通常,一个单页多页面切换网站设计比一个多页面站点需要花费更多时间。挑战在于,要把你想传递的内容都展示在页面上,你需要做大量的计划。当然,你可以随心所欲地创建一个页面,但是大多数访问者也许在第三次滚动之后就会放弃。更好地构建单页网站的指南围绕5个关键元素展开。
     

     
      1、目标:确定网站的目标并朝着这个目标努力

      在你明白你的网站的目标之前,就匆忙开始你的设计是没有意义的。基于网站建设目标,你将能够更好地计划它的结构。你应该寻找可能导致访问者快速退出的原因。这甚至可能发生在访客点击网站行动按钮之前,比如说网站加载速度过慢。一个单页的网站需要把用户的注意力引向一个单一的目标;这可能是:
     
      ●销售产品
     
      ●展示作品集
     
      ●发布活动
     
      Bistro Agency(http://www.bistroagency.cz/work/skoda-4x4/web/#4x4)
     
      该网站的折叠切换产品的交互效果并没有减慢其加载速度。
     

     
      Be Moving网站(https://themes.muffingroup.com/)
     
      这个单页网站的特点是将静态图像展示成动态的。
     

     
      Sheerlink(https://sheerlink.audio/)
     
      这个网站也是一个很好的例子,说明了大型图像和滑动切换面板在吸引用户方面所扮演的重要角色。
     

     
      2、文本:尽量简化,让它易于阅读

      在单页网站中,在页面上方填满文字,很少有用户会费心向下滚动页面。相反,你需要通过强调粗体标题将文本数量保持在最低限度,你可以搭配简短的段落和项目列表。避免在页面的任何地方使用大段文本。将文本分成几个部分,并将它们集成到视觉效果中。你可以通过多种手段,使文本有趣和容易理解。
     
      Hello Alfred(https://www.helloalfred.com/)
     
      网站导航位于网站的上方,简洁突出的标题和正文有助于核心信息的传递。
     

     
      Mercedes-Benz(https://www.mercedes-benz.com/en/mercedes-benz/vehicles/passenger-cars/eqc/the-eqc/)
     
      当汽车品牌达到了奔驰这个品牌的高度,多关注高质量的图像,极简化文字就足够了。该网站的360°旋转背景也让汽车更加真实形象,可以让用户多角度观察它。
     

     
      3、视觉效果:识别正确的模式,巧妙地使用负空间

      人们倾向于以F模式阅读文本,而以Z模式查看图像。因此,正确放置文本和图像以保持平衡的视觉流是有必要的。在这个区域中,大量使用留白有助于分隔各个部分。你可以使文本易于阅读,让人们参与其中。
     

     
      Dribbble’s Year in Review(https://dribbble.com/year/2018/)
     
      本例子中,设计者运用几个不同的设计原则,以最大限度地创造一个醒目的视觉主题。
     

     
      Nasal Drops(https://en.soplyam.net/)
     
      该推广页面可能主题不是特别突出。但是由于巧妙地使用了幻灯片、留白和动画,设计打破了常规,画面看起来还是很新颖。
     
  • 下一篇:企业邮箱选择都需要从哪些方面考量?
    上一篇:超越完美:如何在2019年更智能地设计
  • 标签:网站设计 单页网站设计 

    猜你会喜欢下面的内容

    • 关键词的选取对营销型网站建设的重要性
    • 打造创新的外贸门户网站,开发国际市场
    • 电商网站建设需要技术 关注开发团队的服务
    • 定制建站怎么进行 需要专业有经验的团队完成
关于摩恩 | 联系方式 | 支付方式 | 服务热线: 021-61984272

扫一扫!

微信咨询

网站所属 上海摩恩网络科技有限公司 备案号:沪ICP备07024853号-1 © 2003-2017 omooo.com 版权所有
  • 电话咨询
  • 在线咨询