07 Apr Mistakes in responsive design and their decision
Responsive design appeared relatively recently, but has already successfully entered the ranks of the must-have. It is necessary for the correct operation of both sites on the desktop and on mobile devices, automatically installing the necessary browser settings.
But this trend has a negative side. Many designers successfully working on the usual version of the site happens to avoid lapses in creating a responsive design. In this article we look at some of the common mistakes and possible “removal”.
Lack of analysis of the needs of the target audience
Of course, desire to run a site and be in the digital stream is familiar to many. But hurry, in this case, gives quite the opposite effect. The site, without the prior audience monitoring, which is calculated, can simply not be clickable.
What does the analysis of the target audience?
-Helps to identify which users are using mobile gadgets, coming to life.
-Shows, what actions are committed by people using the site: browsing the whole or in part, whether the pictures reveal.
-Allows you to determine if the growth of the mobile user conversion.
It is important to remember, that this monitoring should be carried out continuously. His data significantly improves the further work on responsive design, helping to account for all “possible” disadvantages site.
Minimum or incorrect display of the information
A common mistake is often encountered when working on responsive design, this is the wrong mapping of data. It’s easy to “withdraw” the site, but does not calculate in what proportions it should be. And if on the desktop contents of the resource is consistent with the size, it is not always that works with smartphones, where information can easily turn into unreadable.
What should pay attention to?
Pick the right fonts, with which the text will look neat and not “flow away” on the screen. With content for online retailers similar situation. Carefully check the display of photographs of the goods, the price and a description of each of them. Having missed something of the above, you agree to run the risk of a negative impact on website conversion.
It is unlikely that visitors who decide to make a purchase, they want to spend a lot of time to search for the desired product, and just go to another site. In addition, two important call to action, “Shopping” and “Buy product” must also be allocated. It is they should focus. A common mistake – buttons are too small or are located too close. On the screen of smartphone, by virtue of its size, it may not look just not aesthetically pleasing, but also to be uncomfortable, because of the inability to quickly click on the appropriate link.
Slow page loading
The “cumbersome” video files and images are often “slow down” the work sites. This happens with the web resources on the desktop, but for smartphones, this problem is becoming much more urgent. Internet surfing on mobile devices popular for several years, but it was in 2016, according to experts, will bring most of the traffic.
If the GUI is filled with heavyweight content, it is logical that the user will have to wait much longer to get acquainted with the site.
What is important?
Keep in mind that every day is available to the user a huge range of information on any subject. Slow loading of data – one of the key reasons why people go to the opponents.
Analyze website content filling. So you can understand which media make it difficult to work and do not carry no informational value. Videos on the home page of the desktop version of the site will look much more appropriate than in the mobile. In addition, it is important to determine the optimal size and file extension for smartphones.
Do not forget about the target audience of the site. Monitoring of user preferences will help to choose the right amount of content.
Lack of responsive in an email-newsletter
It often happens that the site / blog successfully operated on, and on the desktop and on your smartphone. But the e-mails is displayed incorrectly in the latest version. Users are forced to consider the fine print, or messages, or to scroll endlessly to find the necessary information about the goods / made purchases.
Do not forget that email-newsletter – a reliable communication with clients, as well as an important factor in the growth of sales and the level of conversion of the whole site.
The e-mail should be an integral part of the responsive design, designed with a graphical interface and similarly tested on multiple devices simultaneously. A characteristic feature of well-written e-mails – is “optimal” and “light”, which is expressed both in the visual content and informative. Do not make the letter “multi-layer”, that is, add more blocks that impede viewing on mobile devices.
Design desktop version
In most cases, developers are beginning to design a website design with a desktop version, while experts recommend first to study design for mobile devices, and only then to scale it for PCs and notebooks. Designers that is most often can not properly relate the “proportion” of the site for the desktop to the smartphone screen.
By doing the opposite, that is, starting with mobile version, it will be easier to improve the user experience, and to finalize the site for the desktop according to the analysis of the target audience’s needs.
Insufficient testing mobile version
Testing – an intermediate step between the development and launch of the site. But if on the desktop version, as we have already mentioned, are paying more attention to the adaptive version is not always being tested. As a result, user interaction with the site on a smartphone can be kept to a minimum because of the constant errors and omissions. A common example – the buyer is trying to make a purchase via the mobile version, but the page can not boot or does not respond to the request.
In this situation, as in many others, must be tested. But most customers do not hurry to invest money in the process, or simply do not have additional funds and launching “crude” site, which in the future is unlikely to bring them profit.
Minimum test that does not require extensive cost – site checking for multiple mobile devices across different browsers and operating systems. It must be done in several stages, that is every time the site will undergo revision. Simplified procedure will programs such as BrowserStack and Viewport Resizer.
The material has been prepared on the basis of article site http://www.practicalecommerce.com