响应式网页设计

名词解释

响应式web设计：所谓响应式web设计，就是网页内容会随着访问它的视口及设备的不同而呈现不同的样式。

HTML 5：万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言（HTML）的第五次重大修改。

CSS 3：CSS即层叠样式表(Cascading StyleSheet)。 在网页制作时采用层叠样式表技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。

IDE:集成设备电路，一种磁盘驱动器接口类型，控制器电路就驻留在驱动器中，不再需要单独的适配器卡。IDE 接口有许多优点，例如提前高速缓存以提高整体性能。

JavaScript：JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。

RWD：响应式网站设计(简称RWD)是一种新的网站设计模式，以此构建的网站可自动适应不同的访问设备(从桌面电脑、平板电脑到智能手机)，方便用户阅读和导航浏览，减少用户的放大/缩小/滑动操作，从而提供完整而友好的用户体验。
（以上专业名词解释均来自于网络或者响应式web设计书本）

市场调查机制statcounter

image.png

面对不断扩展的浏览器和设备，响应式web设计可以让一个网站同时适配多种设备和多个屏幕，可以让网站的布局和功能随用户的使用环境而变化。随着移动客户端使用数量的不断增加，为了人们能够更好的使用，相应式网页设计是十分重要的。

是否采用响应式web设计

采用了响应式web设计：http://www.1ke.co/
没有采用相应式web设计:http://www.iqiyi.com/

RWD三项组成科技

弹性网格布局：网格布局是一种新的布局方法，该方法使你能够基于固定数量、浏览器窗口中的可用空间或二者组合划分网页主要区域的空间。通过将网格布局与媒体查询（@media）结合使用，可以使布局无缝地适应设备外形尺寸、方向、可用空间等因素的变化。

响应式图片：根据用户的设备和使用场景提供合适的图片？？？

媒体查询：媒体查询包含媒体类型和零个或多个检测媒体特性的表达式。width，height和color都可用于媒体查询的特性。使用媒体查询，可以不必修改内容本身，而让网页适配不同的设备。
（以上解释均出自于书本或者网络）

RWD和前后端的关系

需要依赖后端方案的RWD：网页版，手机版，等等分开服务，设计，产出页面
不需要依赖后端方案的RWD：网页版，手机版，等等一起服务，设计，产出页面
（以上内容均出自于课件）

什么是响应式Web设计

“响应式Web设计”这个名字是Ethan Marcotte在2010年发明的。当时，他在A List Apart上写了一篇文章（http://www.alistapart.com/articles/responsive-web-design)，这篇文章综合运用了三种已有的技术（弹性网络布局，弹性图片/媒体，媒体查询）实现了一个解决方案，这就叫“响应式Web设计”。（以上内容均出自于响应式web设计书本内容)