即将学习这个，所以先随便看一篇。
网站设计趋势中一个非常热门的话题是响应网页设计。这个概念的流行很大程度上是因为网站访问者的浏览途径已经越来越多样化。iPad，iPhone和Android等手机设备使我们的设计处于一个多元化的时代里。因此，网站建设需要通过访问者的不同设备请求来‘响应’，让同一个网站以最合适的方式展现给用户。
一、运用灵活的网站栅格技术
传统的固定栅格系统并不适合响应式设计，灵活的栅格技术包括自定义的栏目参数、间距以及容器是网页设计师最好的解决方案。事实上，现有的栅格系统采用严格的CSS类来定义大小、间距和对齐，这对于需要打破以像素为设计基础的响应设计而言，无疑是过时、不可取的方法。
二、提高网站图片的可塑性
网站图片也需要能通过浏览屏幕及设备大小来灵活展示。加载过大的图片，然后用HTML属性里的长宽值来适应手机设备上的图片展示，显然不是一个好方法。
其实，在网站制作过程当中，程序员可以通过CSS的溢出属性，根据‘容器’的显示环境来动态截取相应的图片大小。同时，也可以通过动态调用服务器上不同版本大小的图片来实现。
当然，使用无图片显示的方法对于注重文本内容显示的设备屏幕也不失为一个好选择。例如在手机微博当中，文字是最主要的显示内容，可以优先加载文字，甚至只加载文字。
三、通过媒体请求触发合适的内容推送
媒体请求（Media Queries）可以说是一个崭新的内容。对于现有的在线网站设计而言，可能实用性尚不明显，但是，其特性所展现出来的无与伦比的优势却不容置疑。媒体请求能够让设计师不考虑用户机制的特点，例如浏览器窗口大小，而将注意力集中于设计本身。
以下是媒体请求根据浏览端的宽度来决定样式表的例子：
<link rel="stylesheet" media="(max-device-width: 320px)" href="mobile.css" />
<link rel="stylesheet" media="(min-width: 1600px)" href="widescreen.css" />
虽然人们常常会把媒体请求和手机或平板电脑的解决方案联系在一起，但是其存在并不仅仅限于此。相反的，媒体请求和响应设计让我们能够跳出屏幕大小或分辨率的限制，将网站建设灵活的适应各种不同的媒介当中。
Comments are closed!