This article is from Socialbeta content contributor wisp, the original translation from browsing on mobile Phones, more mobile product design information, please check the Socialbeta Mobile Internet column.
Mobile browsing is used in different ways around the world. In Korea and Japan, mobile browsers are widely used in mobile services, in Europe, WAP services have been growing, while in the United States, people more through the PDA browser to browse the Web pages rather than mobile phones.
While mobile browsing is not currently popular everywhere, in the next 10 years it will be the main way for most people to surf the internet, and mobile browsers will become the tools that people use every day. All of these require the user experience of mobile browsing to be improved, mainly reflected in: connection speed, service quantity, usability increase and flow cost reduction. This article mainly describes several aspects of mobile browsing usability.
Mobile Browsing Availability
Mobile browsing availability includes several levels (Figure 1), but users will not find out which hierarchy is causing usability problems. For end users, mobile browsing is a holistic experience, and all levels must be seamlessly coordinated to improve usability.
Picture text:
Device Availability: • Key • show • Browser entrance · UI Style
Browser availability: • Interactive • Page rendering • Caching, etc.
Site Availability: • Structure • content • layout
Figure 1: Three separate levels for overall availability
In the mobile device design process, the importance of browser application determines the hardware design and the overall UI style. If it's a touch screen with a stylus, it's much easier to interact with the browser. The full QWERTY keyboard also allows users to enter URLs and fill out forms. If browsing is not the primary application, then mobile devices must be lightweight to meet the needs of one hand. On some non touchscreen devices, there must be several key keys on the browser home page, as well as network connectivity status and the most important fallback functionality.
Small-screen mobile phone browser design is more difficult. While most mobile devices are used in different countries, it is particularly important to understand the differences between different mobile browsing cultures and to understand the mobile browsing experience of targeted users. A good mobile browser must be able to host all types of content, not only for content that is optimized for mobile devices, but also for Web pages designed for PC screens.
When designing a service for a mobile phone, the designer must know what is being used in a mobile state and what a friendly web site structure and UI design principles are [see Annotation 1,2].
Both the content person and the browser developer need to understand the properties of the mobile environment and the user requirements in the mobile state, and must test the effect of their products in a mobile environment, and identify which features can be tested in the lab and what must be tested in a mobile environment. We have been doing user research on the user's attention distribution and browser interaction behavior on the phone.
to browse the full Web page in a mobile state
Service optimization for mobile phone users requires developers to determine the mobile status of users in the handheld device requirements. Many services are often related to location, such as travel information or maps, time related, such as train timetables, or very personal needs, and must be the favorite bar. This requires that services be flexible and vary based on different factors.
Mobile phone users use the PC Web site is often because many users only remember the website URL on the PC, do not know the mobile version of the site's address, in many cases, users on the mobile phone landing computer version of the site, and then get Mobile version of the site link. If the page does not provide a link to the mobile version of the site, it will certainly lose some users.
In addition, we believe that users in most countries still need to log on to the full web page, and the 3G network plus the excellent mobile screen makes it still a good user experience to browse the full Web page on the phone. So we want to improve on the content of the mobile phone optimization, and the content staff will also note that the mobile browser users are increasing, but also to the Web site to provide mobile Web site portal.
1 Narrow layout
displaying large web pages on small screens still requires some information visual processing. At present, some browsers use narrow layout as the default viewing mode, opera called it small screen rendering, netfront it called Smartfit, we call it a narrow layout, because the entire content of the display is narrow and long, and all the content is simplified to fit the screen width.
We've done a lot of user research on this layout [see note 5], the main advantage of a narrow layout is that text is easy to read, and if the width of the text exceeds the width of the screen, it can be difficult for the user to read, although scrolling is a good way to handle the problem.
However, according to our survey, there are still many problems with the narrow layout. The worst part is that in order to fit the screen width, some large images are truncated, resulting in lost image details. The second problem is the table. If a row of tables does not match the screen, it is automatically tuned to the next line.
Another point is the sort of content. As shown above, the display of all content becomes very long, so it is difficult for users to find some content, often need to look for keywords when scrolling on the screen, which means that the scrolling speed can not be too fast, the result of reading all the content will be a very long process. If you speed up scrolling, you may lose some important information.
A typical web page, the leftmost often has many links, the main content appears in the middle of the page. In a narrow layout, users must roll over these links to see the body content. But when browsing a Web site, these links are mostly irrelevant and users become angry. There is also a related problem is that the top of any page of a site is often similar, users will not know which page they are, so if these links contain users have clicked, then the user is likely to click on these links. We've met a lot of users who give up reading because of this problem and they say the browser is broken.
2 Original layout
Because of the many usability problems with narrow layouts, so many browsers also provide the original layout page mode, which is similar to the PC, let the user choose different view mode based on the content, the original layout, large picture details and table The effect will be better, and if the user knows the structure of the website on the PC, It's easy to find what you need.
Of course, the original layout is not a problem. The worst part is reading wide text content, which can be very laborious. Each time the user has to pull the scroll bar forward. In addition, because the page is very large, so there are more places to scroll.
3 Ideal Layout
Obviously, page browsing on small screen phones still requires a lot of improvement and innovation. If you want to make your site readable on a small screen, follow these 3 guidelines:
1: Avoid large objects that can be seen at a glance;
2: Avoid using small text in the picture;
3: The page should be lighter.
Comments:
[1] Kaikkonen, A., Roto, v.: Navigating in A Mobile XHTML creator. In Proceedings of CHI2003 (2003)
[2] Roto, V., Kaikkonen, A.: Acceptable Download times in the Mobile Internet. In Stephanidis, C. (ed.): Universal Access in HCI. Volume 4 of the Proceedings of HCI Analysys 2003.
[3] Roto, V., Oulasvirta, A., Haikarainen, T.,kuorelahti, J., Lehmuskallio, H., Nyyssönen, T.: Examining Mobile Phone use in The Wild with Quasi-experimentation. HIIT Technical Reports
Http://www.hiit.fi/publications/pub_files/hiit2004-1.pdf (2004).
[4] Roto, V., Oulasvirta, A.: Need for non-visual Feedback and Long Response times in Mobile HCI. To appear in prodeedings of WWW. Conference (2005).
[5] Roto, V., Kaikkonen, A.: Perception of narrow Web Pages on A Mobile Phone. Proceedings of Human MX in Telecommunications (2003).
Original link: http://www2.research.att.com/~rjana/WF12_Paper1.pdf
This article link: http://www.socialbeta.cn/articles/browsing-on-mobile-phones.html
Translator: Wisp