响应式网页设计
维基百科,自由的 encyclopedia
回应式网页设计(英语:Responsive Web Design,通常缩写为RWD),或称自适应网页设计、响应式网页设计、对应式网页设计。 是一种网页设计的技术,这种设计可使网站在不同的装置(从桌面电脑显示器到行动电话或其他移动设备)上浏览时对应不同分辨率皆有适合的呈现,减少用户进行缩放、平移和滚动等操作。[1][2][3]
此条目需要编修,以确保文法、用词、语气、格式、标点等使用恰当。 |
对于网站设计师和前端工程师来说,有别于过去需要针对各种装置进行不同的设计,使用此种设计方式将更易于维护网页。
此概念于2010年5月由美国网页设计师Ethan Marcotte所提出。[4]
采用 RWD 的网站[1][5]使用CSS3 中的 Media queries(英语:Media queries),[3][6][7]是针对 @media
查询的延伸应用[8],借由流体网格线[9]和回应式的图片[10][11][12][13]针对不同大小的装置提供对应的样式:
- 流体网格线概念要求页面元素使用相对单位,如百分比或em调整大小,而不是绝对单位,如像素或点。[9]
- 回应式图片应以相对单位调整大小(最大到 100%),防止它们显示于它们的上层元素外。
- Media queries(英语:Media queries)允许页面根据浏览装置而使用不同 CSS 样式规则,最常用的是浏览器的宽度。
回应式网页设计变得更加重要,是因为移动设备流量现在占互联网流量的一半以上[14]。因此,Google 宣布移动设备时代的到来(Mobilegeddon)(2015年4月21日),如果搜索行为是来自移动设备,将会提高对移动设备友善的网站排名。[15]。