Skip to content

DSC-FPTU-HCMC/responsive-web-design

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

15 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Responsive Web Design Presentation


Presenter: Quang Dat Pham

Objectives

  • Understand Responsive Web Design
  • Breakpoints and @media queries technique
  • Flexbox and CSS grids for efficient layouts
  • CSS units in Responsive Web Design

COMPATIBLE Almost every business these days needs a mobile version of their website. iPhone, Android devices, iPad, Kindle, and moreover all screen resolutions.

What is Responsive Web Design?

  • Respond and adjust accordingly to the prevalence of mobile browsing from devices like laptops, tablets, and smartphones.
  • Responsive web design is a concept, which when implemented the right way can improve the UX.

Concepts:

  • Responsive Website Design (RWD): Websites that are built with responsive design use media queries to target breakpoints that scale images, wrap text and adjust the layout so that the website can shrink to fit any size of the screen.

  • Adaptive Website Design (AWD): Adaptive design typically uses multiple fixed layout sizes—when the system detects the browser size, it selects the layout most appropriate for the screen.

  • Fluid Website Design: Websites that are built with fluid design use percentages for widths.

  • Fixed Design: Websites that are built using fixed design rely on fixed pixel widths. While a design with fixed dimensions can sometimes be the quickest way to get up and running, it’ll provide a less user-friendly across multiple devices.

References

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published