网页设计的版型技术历经了一些过程,其中一种就是液态版型,让我们很快的回顾一下网页的版型类型:
固定网页版型(Static)
古早的网页设计,用户的萤幕显示宽度必须要配合网站,许多网站底下都会写着「建议显示器解析度1024」否则不保证显示正确,就是这个原因。用户使用电脑上网大多不会出现问题,但使用智慧手机问题就来了。
如果用手机观看固定网页版型,结果就是内容会被硬生生的切掉,用户必须要用手机的卷轴界面观看左右被切除的内容,十分麻烦。
液态网页版型(Liquid)
可以根据网页的宽度改变显示的网页内容的宽度,最常见情况是版面与文字不会超出萤幕的宽度,而是会自动调整行数让内容可以正常显示。
但网页版型的设计外观结构仍无法根据装置的宽度改变,就像是画面被压缩一样,所以显示的内容可能在行动装置上仍无法理想呈现。例如网站为了正确显示内容导致行数过多的情况。
适应网页版型(Adaptive)
版型的设计结构已经可以根据装置的宽度改变,是网页设计的一大革新。举例来说,原本左右并排的网页内容,遇到手机装置就会变成直式显示,已经算是响应是网页设计的雏型。
但,并不像是液态板型会自动改变网页的宽度,适应网页版型遇到了设计师没有定义的装置宽度就会无法对应的问题。举例来说,版面需要500px才能正确显示,手机只有400px的宽度,即使运用适应网页设计技术,仍有100px会无法正确显示。
响应网页版型(Responsive)
响应式网页版型简称RWD,也有人称为自适网页设计。响应式网页版型RWD结合了液态网页的与适应网页的设计概念,可以根据用户的装置萤幕宽度改变版型的尺寸,并根据装置宽度自行改变版型,是当今最主流的网页设计技术。
这也就是今日已经没有人说「液态网页」或「适应网页」了,因为技术已经被整合入RWD内。