As we all know, mobile-friendly design is now absolutely vital for all websites because a majority of web browsing is actually done on mobile devices. To compound this factor, search engines don’t view non-mobile-friendly sites as favourably so it becomes much harder for your older-style website to get noticed at all, even if you had a brilliant design for desktop users.
What is responsive design?
As a result of these changes in the way users browse the web, responsive web design has become a huge trend over the last few years. This is based on the principle of a website that automatically adjusts itself to suit the detected display device. If you view it on a phone, it will rearrange all of its elements to show things clearly instead of presenting a tiny version of the desktop site or redirecting users to a completely different mobile version.
Responsive web design has been billed as the future of web design, and many extremely attractive and functional examples have been shown to business and website managers in an effort to persuade them how great this method is.
What are the potential issues?
In reality they’re now past the point of being potential issues, and many of them are actually widespread. Here we take a look at some of the problems we’ve seen gradually emerging.
1) Bias towards mobile users
Many designers have gone too far the other way when it comes to catering to specific users. More emphasis is often placed on how a responsive site will look on mobile devices, and desktop designs actually suffer. Mobile devices offer a more limited number of options for displaying content, but when the same logic is applied to desktop displays, most of the space and functionality tends to be wasted.
2) Screen size matters more than content?
For responsive design to work, it has to prioritise the dimensions of the browser its being displayed on rather than the content itself. The code of the website can’t understand what text or images mean, only the designer can try to account for this. Unfortunately this distortion of priorities can sometimes mean important content is squeezed into an irrational place on desktop, mobile or both for the sake of compatibility.
3) Hamburger menus
If you’ve noticed the common trope of having to tap an icon with three horizontal lines to expand a navigation menu on a mobile device, you’re familiar with a hamburger menu. You may have also found yourself questioning why the same function needs to appear on the desktop version of the same site, where it suddenly becomes much less intuitive.
4) Monotonous designs
Because template-based responsive design tends to be much easier to implement, and traditional static webpages (which were relatively easy for novices to produce themselves) are redundant, it’s common for new websites to adopt one of a few popular themes. In fact, many websites now look almost identical and it’s fair to say that the need to be responsive has impaired designers who want to show off their creative flair.
How can it all be resolved?
Realistically, there will always be some conflict of interest when an automated code is deciding how to display your website but you need it to be optimised for conversions and engagement. The only way round this is for designers to take back full (or almost full control) perhaps pre-designing a number of different templates per websites and allowing individual devices to determine the exact dimensions within a given range.
This could mean that your website varies between mobile phones, tablets and desktops but still draws on the same resources and content. The platform for this isn’t quite there yet, but we might expect this in the near future.