(2) 阅读 (267)

Responsive web design 编辑

词条创建者 匿名用户

What is responsive web design

编辑

Responsive web design or adaptive web design, responsive web design, corresponding web design. Is a technical approach to web design that allows websites to read and navigate across multiple browsing devices, from desktop computer monitors to mobile phones or other mobile product devices, while reducing zooming, panning, and scrolling.

Ethan Marcotte coined the term Responsive Web Design (RWD) in his article on A List Apart. He described the theory and practice of responsive web design in his short book on the subject in 2011. Responsive design was ranked second by top magazine web design trends in 2012 (progressive enhancement was first).

Responsive web design

Elements of responsive web design

编辑

Websites designed with RWD use CSS3 Media queries, an extension to media rules, as well as streaming scale-based grids and adaptively sized images to accommodate devices of different sizes:

  • Media queries allow web pages to use different CSS style rules depending on the characteristics of the device on the site being visited. The most common is the width of the browser.
  • The streaming grid concept requires page elements to be resized using relative units such as percentages or typography, rather than absolute units such as pixels or points.
  • Flexible images are also resized in relative units (up to 100%) to prevent them from appearing outside the elements that contain them.

The Challenges of Responsive Web Design

编辑

Luke Wroblewski summarized some of the challenges in RWD and mobile design, and created a catalog of multi-device layout patterns. He proposed that, rather than a pure RWD approach, Device Experience or RESS (Responsive Web Design with Server Side Components) can provide a more optimized user experience for mobile devices . Server-side "dynamic CSS" implementations of stylesheet languages ​​such as Sass can be part of this approach.

One problem with RWD is that banner ads and videos are not streaming. However, search ads and (banner) display ads support specific device platform goals and provide different ad size formats for desktop, smartphone, and basic mobile devices. You can use different landing page URLs for different platforms, or you can use AJAX to display different ad variations on one page.


内容由匿名用户提供,本内容不代表vibaike.com立场,内容投诉举报请联系vibaike.com客服。如若转载,请注明出处:https://vibaike.com/105132/

发表评论

登录后才能评论

词条目录
  1. What is responsive web design
  2. Elements of responsive web design
  3. The Challenges of Responsive Web Design

轻触这里

关闭目录

目录