网站首页
手机版

2018响应式网页设计教程!

更新时间:2022-04-01 07:44:27作者:佚名

2018响应式网页设计教程!

  当客户提出产品功能移动化的需求时,有一些解决方案可供我们选择,包括原生客户端应用、Web应用等,究竟怎样的方式更合适,还是取决于具体的需求情况。

  

  另外也要考虑网站本身是否需要实施移动化,虽然响应式站点并不能算是一种纯粹的移动化解决方案,但是在某些情况下,这种方式是非常值得考虑的。

  

  1、你心里没谱

  

  设计开发一个全新的移动版本站点或是客户端应用,整个过程是有很大挑战性的,除非产品正式上线,否则你无法真正了解它是否会成功,与其单纯的为了移动化而花费资源打造移动版本站点或是开发客户端应用,不如先花些心思将原本的网站打造的更具弹性,使其在各种主流移动设备中都拥有尽量优秀的用户体验。

  

  2、你想节约成本

  

  要打造响应式站点,自然离不开有经验的交互、视觉设计及前端开发人员,所需的资源,尤其是时间方面,比起普通网站来说大约增加20%到30%的样子,但比起单独打造移动版本的网站,或是设计开发客户端应用的成本来说,却要低很多,从维护的角度来说,也会轻松很多。

  

  3、你希望网站可以兼容未来的新设备

  

  所谓的移动版本站点,通常是针对某类具体规格的设备进行单独打造的,弹性比较差,新的移动设备层出不穷,传统的移动版本站点需要不断的进行更新维护,才能尽量保证在新设备中工作良好,响应式设计可以根据设备浏览环境的具体规格进行判断,使用不同的呈现方式来展示内容,无需针对某种特定的规格进行维护,适应性更好。

  

  用户研究与设备规格预估

  

  前期,通过用户调研,我们可以了解到用户群所使用的设备类型分布情况,并预估出几种典型的响应规格,用来规划不同的呈现方式,有几个问题建议大家需要特别考虑下:

  

  1、用户在不同设备上的目标有多大区别?

  

  过去,我们通常会假设用户在使用移动设备访问网站时,其行为都是高度目标驱动化的,例如在旅途中获取酒店地址、预订房间一类。

  

  但实际情况不仅如此——智能手机、平板电脑等各类移动设备的用户,会越来越多的在相对稳定从容的状态下使用网络,所以在很多时候,用户使用不同设备的目标差别并没有想象的那么大,我们不能片面的假设不同类型设备的用户对功能的需求差异。

  

  2、关于功能与内容呈现,从技术的角度出发,需要考虑哪些?

  

  对于功能繁多复杂的网站,需要针对不同的设备类型进行功能和内容的优先级排序,以便在开发阶段通过CSS定义不同的响应规则,以最合理的样式规格和布局方式进行呈现,尤其对于手机等小屏幕设备,需要多花些心思。

本文标签: 网页设计  标签  简介  教程  

为您推荐

excel表格怎么大批量筛选(excel表格怎么大批量筛选重复项并快速删除)

1、在选中单元格后,点击排序和筛选。2、在展开的界面中,点击筛选。3、在单元格界面中,点击全部显示。4、在展开的界面中,点击确定即可。

2023-03-21 15:30

Word2007文档水印怎么去除(word2007文档如何去除水印)

Word2007文档水印怎么去除 Word2007文档水印怎么去除 方法一 页面布局-页面背景-水印-删除水印,文档中的水印被删除. 方法二 页面布局-页面背景

2023-03-15 00:31

Word2003文档中的回车符怎么隐藏(怎样隐藏word里的回车符)

Word2003文档中的回车符怎么隐藏 Word2003文档中的回车符怎么隐藏 隐藏回车符 1.单击菜单栏"工具"下的"选项",在打开的窗口中取消勾选"视图"选

2023-03-15 00:30

Word2007自动滚动怎么设置(如何设置word自动滚动)

Word2007自动滚动怎么设置   Word2007自动滚动怎么设置 1.首先打开一篇长篇文档,单击其左上角的"office按钮"在弹出的快捷菜单中选择"Wo

2023-03-15 00:29

Word2013文档中大纲视图如何使用(word2007大纲视图)

Word2013文档中大纲视图如何使用 在Word 2013中,用户可以使用大纲视图来查看并编辑文档的大纲结构,同时可以对正文进行处理.在大纲视图模式下,文档的

2023-03-15 00:29

Word怎么用快捷键快速修改文字格式 word快捷键修改

Word怎么用快捷键快速修改文字格式   Word怎么用快捷键快速修改文字格式 1.电脑上新建word文件,例如命名为"word技巧" 2.双击"word技巧"

2023-03-15 00:27