Home » Business » Digital Transformation » Website Responsivity in Modern Business
Gone are the days of creating a website for a screen on a single desktop unit. In today’s climate of rapidly advancing technology, businesses have to prioritise how their shop front through a multitude of digital windows.
In 2016, mobile device user-numbers hit 4.6 billion, a figure set to surpass five million come 2019. Tablet computers are now resoundingly popular, with over 50 per cent of Britain’s population using them in 2015; the total is predicted to rise to 59.8% of the population and 73.6% of internet users in the next three years.
The concept of responsive design underpins the approach of all businesses that wish to optimise their webpages, so users get the perfect user experience (UX), whether they are visiting your site on a 17-inch desktop or 4-inch smartphone.
Through fluid, proportioned grids, dynamic images and CSS styling, the design and layout of websites can adapt to browser sizes. Below are some key considerations that should inform how companies can excel in this department.
Responsive web design is often regarded as simply stuffing your site into different screen formats, but the real approach is rather more subtle, and will depend on the context of the content you’re using.
A smaller screen obviously means you have less room to play with, so adapt your information accordingly. Consider the most vital aspects of your website – what your consumer or client really needs to know – and lose elements that are less critical.
Product descriptions are the perfect example: a full-fat website might feature dynamic 360-degree camera imagery of products, complete with comprehensive descriptions. A smaller screen may not do this presentation justice, so think about using a few images and streamline prose into bullet points.
Branding will dictate font size and style; while Millennials will probably cope better with smaller fonts than older generations, it’s best to have each word on your site readable without zooming. Google recommends using a base font of 16 CSS pixels that scales across devices. Alternatively, you could execute user testing to find out how and why fonts may be causing you problems.
No matter how impressive a website looks, if it’s difficult to use and awkward to navigate, users won’t hang around long to find out more about what you do. Simultaneously, navigation is one of the hardest aspects to master and replicate across the device spectrum in a way that matches customer expectation.
Users need consistency if they are to buy into brands, which boils down to smaller details such as the colour, size and characteristics of menu bars and buttons. Quicker and clearer is better for mobile users; list most relevant content categories and mobile phone calls-to-action to give the user the most direct route to what they want.
Remember to accommodate touch-screen; the mouse pointer brings precision, but tablet and smartphone users are going to be navigating with their fingers. The average finger needs around 44 pixels, left to right and up and down – dimensions that take fingertip size and inherent inaccuracy into account.
So build navigation buttons with a target of below 40 pixels and you can expect user numbers to drop. Even when you have the pixel number nailed, bring in a colour change or button indicator that enables the user to see that they have pressed the desired button.
In our image-centric culture, designers need to use bigger, more impressive and more relevant imagery to stand out from the crowd. However, the wow-factor will be ruined if images are too big to download in the blink of an eye, causing problems for smaller devices with lower bandwidth capabilities.
Of course, when you have your designs laid out and ready to go, there’s no better way to gauge the environments you’ve created than to conduct a thorough, controlled test-run on real users. Don’t limit this test to an informal check by the core designers; testing should be formal, relying on the feedback of a broad demographic.
The constant evolution of technologies and the capabilities of devices, means responsive design is an ongoing issue. Smaller devices will be the driver of your greatest iterations and responsivity developments, so stay tuned to what’s going on in the handheld markets. And remember, user experience is the key to a fantastic website that can be accessed anywhere.