Responsive design is quickly becoming an essential part of designing for the web. Of course, as with other new techniques and trends, there are mistakes to avoid from the get go. Here are 3 common design errors:
1. Designing for Devices Rather than Screen Size
One issue some businesses face when incorporating responsive design is focusing their energy in the wrong place. More specifically, they focus on designing for individual devices rather than for screen size. As Modern Web puts it:
One should instead design for micro-screens, small screens, mid-range screens, large and extra-large screens. Using screen classification for responsive design helps in more ways than one since one cannot lump all phones in just one category. The sizes of tablets, desktops and mobiles vary in multiple ways any way.
2. Using Size Breakpoints
Falling into the trap of the first mistake listed can constrain new designs because of issues that arise when conforming a new product into a standardized size breakpoint. According to The Next Web:
If you only use current device sizes as breakpoints, your site will feel strained on these newly introduced screens. To meet this challenge, you can use a method I call “building to the design, not the device… Start with the Mobile First approach and build your site with smallest screen that’s relevant for your users.
3. Thinking Small
Regardless of how it seems, responsive design does not solely revolve around mobile devices. Even with an increase in mobile usage, desktop use still accounts for 42% of digital media time in the U.S.
For a complete run down, plus a bonus mistake, check out this article.