How to design a mobile website

Source: Internet
Author: User

As a result of the use of smartphones, visitors to the mobile phone almost all things, of course, including browsing mobile website. This led to the enterprise or even individual set off a mobile phone website construction craze, enterprises through the mobile phone site and the public number of links to achieve corporate propaganda and online business, individuals build mobile phone website play a play, dazzle a dazzle, show their riders ability! Then, as the mobile site construction of the first link-Mobile site design, how to make users willing to browse, and improve the user experience? This issue is very important, in the Web site, app, such as the Internet, to make your mobile site can be unique, to impress users, it is necessary to design mobile website work, otherwise it is difficult to achieve.

1. Principles of Mobile Website design

Relative to the design of the computer version of the site, mobile phone station, due to the restrictions of the browsing screen, can not be like a computer site, on a Web page to display too much content, otherwise users can not see the text on the page, and how to talk about user experience it! Therefore, in the design of mobile sites, to follow certain principles, to make users feel that your mobile site is not weird and easy to browse.

    • Mobile phone station, the design of the site from the PC version of the horizontal two, three or four points to the layout of vertical to a sub-layout, that is, the content to block, vertical display, rather than in two on the browsing screen, but also can not be divided into three, otherwise each display area is too small, the Web site users can not see clearly;
    • When designing a mobile website, take full account of the characteristics and habits of browsing user clicks. On the computer website, the user is basically by clicking the mouse to complete, the mouse clicks the precision is very high, even if you in the website design leaves the Click area is very small, the mouse also can click on. But mobile phone build station is different, the user is through the finger to click, each individual's finger thickness is different, if the designer will click the area to stay too small, the user often does not click on, finally had to leave your mobile website. Therefore, in the mobile phone construction station design stage, the designer must make the good picture put on the mobile phone to browse, and try to click the area to stay is big enough, if not, it needs to adjust as soon as possible, otherwise it violates the most basic principles of mobile website browsing;
    • In the design of mobile website, try to limit the use of special effects in the smallest range, do not move full screen! In the computer version of the website design, the site customers will come up with a lot of special effects layout, the purpose is to attract the eyes of the visitors, to achieve the focus of the effect. But mobile site design, too much to arrange special effects is inappropriate, because the mobile phone screen is too small, can browse the area is limited, if there is too much animation moving, the browser does not know where the focus of attention, and even the basic content can not be seen, the use of this special effect becomes counterproductive, this is to be very clear.

2. Mobile website design can be a unique approach

    • Mobile website design style to be unique, special table compared to the same industry competitor's website;
    • Mobile Website Design UI icons to be consistent, so that users feel no matter how many pages of the site, will be a whole, so it looks very comfortable;
    • Mobile Website design page pages should have a hierarchy. In the design of PC website, because the browsing area is large, the content that wants to show basically can be displayed in each area of a webpage. and mobile site design is different, users can browse the area is so big, want to display all the content in a page page, you must use a different page layer to complete. Of course, the page level display can not be too much, otherwise the user can not see clearly. Generally under the 3 floor is appropriate, so that both the change, and does not affect the user experience, to achieve a balanced effect;
    • When designing a mobile site, the browsing hierarchy is shallow, allowing users to find what they are looking for as quickly as possible. Can not be the user point three or four, have not found, may have left;
    • When designing a mobile website, pay attention to the details of the carving and change. Because the size of the mobile phone screen has been set, the bulk of the content to make changes in the potential has been very small, but in the details can be changed, such as the design of the middle button menu, the design of small icons, and so on, these changes will not affect the main style and user browsing, but also can play the role of the finishing touch, Can bring additional surprises to the user!

3. Mobile website design needs to pay attention to the place

In the design of mobile website, need to pay attention to too much detail, do not look at a small screen, in the design of the Web page need to consider more than the design of the PC site, but also more time-consuming. Here are just a few common mistakes that need to be noticed when designing a mobile site.

    • Mobile Site menu design, if the horizontal arrangement, the maximum number of buttons now 5, and then more fingers are difficult to point on;
    • If you need a few steps to complete the function, mobile phone site must be separated, not all designed in a Web page, otherwise the content is too much, the user is easy to annoy;
    • Because the mobile site is vertical browsing, so the logic of the Web page content is very strong, the user after browsing together only interested in continuing to browse, otherwise it will be turned off. Computer Site Design This aspect of the requirements are not high, after all, a Web page display content, users do not like to see the left, but also may like to the right, but in the design of mobile website must pay special attention, otherwise there will be high bounce rate situation;
    • In mobile website design and production, do not use flash, plug-ins and video do not use this, Apple mobile phone operating system does not support, if it is Apple mobile phone users, then the browsing effect will be very poor;
    • Mobile site design and production process, if you need to interact with the server part, to design the state of waiting. After all, the phone does not want a PC, will not always use the WiFi link, when using data connection, if the network condition is not good, when the mobile site in the data with the server to interact without any changes, the user also thought that the site died, it will be easy to leave.

How to design a mobile website

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.