- Responsive Web Design with HTML5 and CSS3
- Ben Frain
- 240字
- 2021-08-06 20:03:38
Defining responsive web design
The term responsive web design was coined by Ethan Marcotte. In his seminal List Apart article (http://www.alistapart.com/articles/responsive-web-design/) he consolidated three existing techniques (flexible grid layout, flexible images, and media and media queries) into one unified approach and named it responsive web design. The term is often used to infer the same meaning as a number of other descriptions such as fluid design, elastic layout, rubber layout, liquid design, adaptive layout, cross-device design, and flexible design.
To name just a few! However, as Mr. Marcotte and others have eloquently argued, a truly responsive methodology is actually more than merely altering the layout of a site based upon viewport sizes. Instead, it is to invert our entire current approach to web design. Instead of beginning with a fixed width desktop site design and scaling it down and re-flowing the content for smaller viewports, we should design for the smallest viewport first and then progressively enhance the design and content for larger viewports.
Tip
Responsive web design in a nutshell
To attempt to put the philosophy of responsive web design in a nutshell, I would say it's the presentation of content in the most accessible manner for any viewport that accesses it. Conversely, a truly "mobile website" is needed when an experience requires specific content and functionality based upon the device accessing it. In these cases, a mobile website presents an entirely different user experience to its desktop equivalent.
- Moodle Administration Essentials
- Kubernetes實(shí)戰(zhàn)
- CMDB分步構(gòu)建指南
- 深度學(xué)習(xí)經(jīng)典案例解析:基于MATLAB
- JMeter 性能測(cè)試實(shí)戰(zhàn)(第2版)
- 跟老齊學(xué)Python:輕松入門
- Learning Linux Binary Analysis
- INSTANT Weka How-to
- 假如C語言是我發(fā)明的:講給孩子聽的大師編程課
- 精通Scrapy網(wǎng)絡(luò)爬蟲
- Mastering ServiceNow(Second Edition)
- Mastering Leap Motion
- 安卓工程師教你玩轉(zhuǎn)Android
- Android智能手機(jī)APP界面設(shè)計(jì)實(shí)戰(zhàn)教程
- ASP.NET Core and Angular 2