Responsive User Interface, Simple Do and Don’t

Prerna Prasad
1 min readFeb 7, 2021
Image from freepik.com

“Web design is responsive design. Responsive web design is web design, done right.” — Andy Clark

Responsive design is a graphic user interface design approach used to create content that adjusts smoothly to various screen sizes.

Responsive design is not a program to be coded it’s a design that is to be understood by the developer. In simple words, you have to design something which looks good on all the devices.

Some Key Points to be kept in mind while designing a responsive User Interface are:

  • Always just the “mobile-first” approach, design the User Interface of Mobile-first and then eventually go to the web,
  • Include at least 4 breakpoints for making it easier for the developer
  • The breakpoints can be at 1920, 1200, 1000, 900, 700, 500, 400 and 272
  • Use Scalar Vector Graphics (SVGs) for icons,
  • Try to keep the design minimal

Pros of Responsive Design

  • Have a great UX
  • Relatively cheap and easy to implement
  • Minimal in Design

Cons of Responsive Design

  • Less control over design screen
  • Problem with advertisement format
  • Longer load time on mobile devices

Responsive design is a powerful and economical approach, but its “easy” nature is deceptive.

--

--

Prerna Prasad

Designer, learner, information geek. I love to write, design and fantasize…