Comments · 134 Views

Looking at the desktop and mobile versions of the site, it is clear that they are fundamentally different from each other. Thus, using the main version for the computer, the user has the opportunity to view more information, the interface is convenient and clear, and the font allows, even

This is not the case with the mobile version. Sometimes the text is not readable, it is not always convenient to control the functionality, because you have to click with your finger rather than with the mouse, and it is sometimes several times wider than the button. All of these details are taken into account by competent developers at the stage of creating a resource so that the user does not feel disadvantaged when using the mobile version of the resource.

In this case, one of the best examples is the site of Qatar Airways. The carrier has certainly tried to use the maximum number of "chips" to make the resource convenient for mobile versions. The interface is simple, even though the site itself has a branched structure. After all, we don't know why each user goes to the site, whether he wants to buy a ticket, just read the prices, find out his e-mail, or is just interested in the company. There are nine buttons at the center of the site, which is easy to click on, and the font allows us to quickly understand where the user will go with each click.

While the design of this site is very dynamic and intense, it doesn't distract from the message. A gradient is used to show the user which button is highlighted for selection while eliminating the harsh contrast with the background hue, which enhances the style. In general, the very idea of using translucent buttons is relevant for sites of any orientation.

The following example is also an example of an effective solution. Thus, the imposition of characters and letters on the photo is acceptable only if we are talking about a small text, such as the name of the section. If you plan to place a long text, it's better to use a light (but not white) background and text whose color is close to black. This contrast will allow you to study the information without stress and will not deter users. The most popular are shades of background close to muted natural, such as light beige or the color of book pages. In our example, a light gray shade is chosen for the background.

The interface for booking tickets on the site also deserves special attention. Everything is very simple. Only the most important blocks necessary for booking are selected, including the class of service, destination, number of passengers, and departure date. At the same time, using the button, it is possible to go back to the tickets the user has previously viewed. And to return to the main menu, just click on "house". This symbol intuitively tells you where the click will lead.

So, having looked at the three pages of the airline site in detail, there are several advantages to the chosen solutions:

If you create a multifunctional online resource, then you should not skimp on the development of convenient navigation on it. After all, this is the first thing that should see the user, going to the site.
If your goal - is to achieve the user of some action, then on the screen is to leave only the important blocks, and all unnecessary information removed, so as not to distract him. All as in the case with the booking page of the ticket.
Any section should have a button that allows you to go straight back to the main menu without going through a back chain of clicks.
To the user do not strain his eyes and do not get tired while studying the site, choose a loyal contrasting shade. The background should be close to white, and the font - to black. Not unimportant fact is mobile website cost