All posts by shaynemoore

Why Responsive Web Design Should Not Be Your Only Mobile Strategy When Making A Website

How To Make A Mobile Friendly Website

UPDATED: AUGUST 16, 2016 – ARTICLE: HOW TO MAKE A MOBILE FRIENDLY WEBSITE

Category: Website Design & Development

responsive-web-design

How To Make A Mobile Friendly Website

Many designers today seem to believe responsive website design to be end-all solution when it comes to producing user-friendly websites for all users, no matter their device. This is the clear trend being witnessed in the industry, as separate mobile websites are slowly but surely becoming a thing of the past.

But in reality, although responsive website design is indeed an important and even crucial aspect of providing a seamless experience for visitors, there are other measures that must be taken in order for it to be fully effective.

After all, even though mobile devices are indeed becoming more like their desktop counterparts every year, there are still significant differences which require the website to be able to adapt to specific needs of each platform.

So while responsive website design largely deals with ensuring a comfortable experience on different devices with varying screen sizes, it is not the only thing that makes for a good user experience.

But What Other Mobile Strategies Should Be Followed To Ensure Best UX Across All Devices?

 
Well, since the most important metrics to measure the user experience is not only ease-of-access, but also performance and speed, they should all be emphasized, although the ease-of-access might be at least partially taken care of by a well thought out responsive design.

So for designers that want to go a step further in ensuring that their websites’ performance is optimal on all devices, here are a few things to consider for implementation during the design process:

Design From A Mobile Visitors’ Perspective

 
It may seem more important to design your website from a desktop visitors’ perspective, since they usually make up the majority of a sites’ viewership, but this can result in negligence for the mobile version of the site, which can sometimes work against the very purpose of a responsive design.

Because of that it is a good idea to start working from a mobile perspective right from the beginning – this way you can get ahead of any later design problems that might occur and when you make a website the design will be a lot more functional across multiple devices.

Additionally, this approach often forces you to strip the design of any unnecessary features or functions, which helps keep the site clean and to the point. It’s much easier to add something in the process than having to strip down a completed design.

Use JavaScript Wisely

 
JavaScript can be used in multiple ways to dramatically improve the user experience for your mobile visitors. A great way to achieve faster load times is to use responsive images – these are relatively simply to implement and can help improve performance with older devices or slower internet connections.

Another good tip is to use conditional loading, which means loading only the JavaScript that will be needed with that device. Also, consider displaying them only after the website has completely loaded.

Device Feature Detection By Server

 
Many designers are afraid or simply not willing to utilize the back-end potential of implementing adaptive server scripts, even though it could greatly improve performance for mobile users.

The reason for this is that designers are not always in control of the server and it is managed by a remote development team. In these scenarios, it can become a strain to coordinate all the minor tweaks, and thus front-end designers seem to prefer staying away from responsive design and server-side components.

However, for the sake of the mobile performance of a website, it’s a good idea to have a service side architectural layer, such as Node.js, which can serve as a platform between back-end and front-end when creating a website. This way an optimal performance can be achieved for mobile devices, without being forced to meddle with the back-end directly.

Mobile Connection Limitations

 
This aspect of the mobile surfing experience has dictated the choices of designers since the very beginning – internet speed has been one of the fundamental aspects that always had to be taken into account.

And even now, with the emergence of 4G mobile networks, it is still something that should not be overlooked; while the 4G bandwidth can get up to 50 Mbps, compared to just 5 Mbps on the 3G network, bandwidth alone is not what decides page load time.

An even more important metric is latency, which is the time that each file takes to start loading. And when you have a lot of different files, no matter how small, a mobile device will need time to complete the assignment.

A possible solution to this is using small files to present above-the-fold content, or the content that a visitor would see before scrolling down, as soon as possible. This can be achieved by limiting the size of the first data package received as much as possible.

Conclusion:

 
What have you found to be the best solutions to improving your mobile websites’ performance? How important do you think a responsive and fast mobile website is to a business? Share with us your experiences, views and thoughts in the comment section below.

Shayne Moore is a Director at a leading web design agency in Christchurch, having a pool of professional graphic designers who design and build beautiful designs. Shayne is passionate about digital marketing and loves to share his creative ideas on the latest design trends. You can know more about him on Linkedin.