5 Challenges to Build a Responsive Web Application

www.shivam.com.au

5 Challenges to Build a Responsive Web Applicationwww.shivam.com.au

Responsive web design is all about ensuring that a website or application looks attractive and usable and delivers the full web experience on all known screen sizes of different devices such as smartphones, computers, tablets, mobile gaming devices, television, eBook readers, etc. Responsive design uses fluid grids and CSS queries to build designs that automatically adjust based on the device used.

This sounds nice and easy on paper but the numbers of devices that can connect to the Internet is increasing by the day, and let’s face it, every device has its own unique uses. Therefore, there are many challenges to overcome for mobile website design and development.

5 Factors to Consider While Building Responsive Web Applications:

TIME

It takes time and resources to create a responsive design. Programmers also need the latest software that can build responsive sites/applications, and buying many software licenses can eat into the company’s bank balance. Plus, many companies ask programmers to make their existing website responsive without realising that

1 Shivam Technologies Pty Ltd

5 Challenges to Build a Responsive Web Applicationwww.shivam.com.au

converting sites takes longer than building a site from scratch.The extra time required can delay the product launch and the company’s plans/goals and therefore every project manager must discuss the likely delays with the management.

DEVICE DIFFERENCES

Viewing and interacting with a website or application on different devices requires a different thought process. A person viewing a website on his computer sees a whole lot of data at once, but when he views the same site on his mobile, he sees very little. Let’s assume he usually views the middle-centre of a particular site on his computer and then opens different links in new tabs. Now, doing the same tasks on his smartphone may inconvenience him.

Another example: browsing and booking an airline ticket on a home PC is miles apart from booking the same ticket on a smartphone while on a crowded train. A change in the situation, or in the circumstances, changes the browsing experience and this is something that responsive web design programmers cannot foresee.

There’s another factor to consider – once, companies made different website versions for mobiles and tablets because users interaction is different per device. A viewer can use his mouse pointer, shortcut keys, and even place his arms comfortably on a table while browsing. But, while checking websites on a mobile or tablet, all he has are his fingers. This is why mobile sites were designed separately, and while implementing responsive designing, the website retains the same structure.

CSS MEDIA QUERIES

CSS media queries optimise user experience by delivering different styles to different devices, and when programmers work with media queries for responsive web applications, they make certain assumptions. They can assume that a small screen is a mobile device – but then a mobile device can be more than 1280 pixels wide. If they assume that the user’s screen is lesser than 960 pixels wide, then they also must assume that he will have to scroll sideways to view the content. They also find it difficult to figure out what to do with portions of the site that can be hidden on mobile or eBook reader screens.

So, using CSS media queries to deliver an optimal screen may not work out well. However, programmers need to keep up with their good work without making too many assumptions. One more issue with media queries is that older browsers (IE 8, and before) cannot support them.

NAVIGATION

One of the most important parts of a website is its navigation. Navigation gets complex on dense and content-heavy sites and when such sites are viewed on small devices, it becomes challenging. Some content-heavy sites hide the navigation menu for small devices to counter the complexity, but then that compromises the user’s access to information. So, the programmers and their project manager have to meet

2 Shivam Technologies Pty Ltd

5 Challenges to Build a Responsive Web Applicationwww.shivam.com.au

the website owner and discuss the issues with him, suggest ideas, and arrive at an acceptable solution.

The challenge is that thinking through this takes additional time and effort, which the client will not compensate for. The client also may not agree to the suggestions.

TESTING

The time, skill and efforts taken for testing a responsive web application are humongous. There are multiple devices with multiple display screens and resolutions, and therefore testing responsive designs is repetitive and exacting. Touch screens, regular screens, different resolutions, etc., can take excessive testing time, and the website may still not display correctly on some devices after the testing is over.

These are the top 5 challenges that responsive web application design faces. Other minor issues include image scalability, devices loading CSS behind media queries that are not used thereby impacting site performance, element queries, and a couple more – but these can be tackled. The main challenges still continue to haunt programmers and publishers.

3 Shivam Technologies Pty Ltd