Getting out of the maze of mobile Internet: The method strategy of website mobile

For now, the mobile Internet is playing a more and more important role, and almost everyone is talking about it, whether it's a developer or a regular user. The way traditional Internet users are accustomed to accessing content and using services is being dramatically changed by devices like smartphones and tablets. As a provider of online content and services, we must quickly enter this emerging market and learn new rules of the game.

Desire is good, the "mobile" way will often let people find the north. What exactly should be done? Develop an iphone or Android app? or for the Web site specifically set or n set for different mobile device design? The most important thing is to first of all the content and function of their products correctly positioned to the extent of the mobility needs of a reasonable assessment; On this basis, try the most suitable for their own mobile mode. At present, some of the more common ideas can be used for our reference selection:

It's really a choice and it's not as depressing as it sounds.

Keep your web site in alignment with your desktop browser and your mobile device-this is not a good way to do it, especially if you are not developing resources in any way. For the iphone or ipad, a relatively high-end device with multi-touch capabilities, most users are accustomed to, and even willing to, turn and double point amplification. Why do you want to move around to provide a shrinking version of the site for these users?

This is naturally a cheaper solution. However, tablets are not small PCs after all, and smartphones are not small tablets, and in many ways their own characteristics dictate unique ways of interacting. If you want to improve the content or function of the site to adapt to different devices, the development of mobile version alone is obviously a way.

The main idea of the response page design is that the page will judge the size of the browsing environment, and load the corresponding preset style scheme, so as to adjust the layout structure and the dimension of the content elements in response.

If the content structure of the page is good enough to be separated from the style, this is a long-term guarantee, and we do not need to design and develop for any existing or future devices with different screen resolutions. This way, whether from the interactive design or UI vision, in fact, still belong to the relatively traditional page design and development model, and will not increase the cost, it can be said to be a high price-performance choice.

On the concept of responsive web design, components, basic implementation ideas and development methods, you can refer to the previous two articles: "What is a responsive web design?" How to proceed? and implement responsive web design via CSS3 Media query.

By working with HTML5, CSS3, JavaScript, or related front-end development frameworks (Sencha, JQuery Mobile, and so on), we can create a unique page content rendering and feature usage pattern, both visually and interactively, that are more like applications, Rather than the pages we are accustomed to seeing in our desktop browsers.

Any device that has a modern browser installed can browse the use of Web applications, and from this point of view, it has a certain cross-platform nature. Depending on the resource, you can do only one Web application or use different UI element styles to create different skins and corresponding behavior triggers for iOS, Android, or Windows.

However, the nature of web apps is still a page, and it relies on the browser environment. So, while the appearance and behavior can be similar to native client applications, it is still a much more restrictive approach from the perspective of functionality and user experience.

In the aspect of content presentation and operation behavior, native Client application has great difference with Web page. This approach allows you to tap into the various technical features of your mobile device's hardware and systems, such as compasses, gyroscopes, cameras, storage media (including offline storage or cloud), NFC (What is NFC?). Near field Communication, short-range wireless communication, near-field communication, etc.

Native clients can also bring the most fluid operational experience to the user, as there is a set of standard native UI components and interactive ways for developers to use and follow.

Accordingly, the development cost of this way is also the highest in the above several schemes, regardless of technical ability or development time. Also, we need to develop independently for each system environment and device type. Native clients are basically not cross-platform.

Which way should

When developing a website product mobility strategy, we need to consider the following factors:

Whether Web applications or local native clients, they are primarily designed to provide a specific feature that helps users accomplish specific tasks. If the requirement is to move the enterprise site or the same type of site as a whole, then the client application is not the right choice. If the target site belongs to customer service, E-commerce, online tools and other types, then the client's form is worth considering.

We must understand the target user base of our website and product, and do a practical research to see if the main user group will use our service through mobile clients.

Different groups tend to have different types of equipment, and users of similar devices need to be further divided according to different device systems, for example, iOS users will use the App store more often than Android users.

If the target user base of the product is too large, the native client may not be the best choice unless we have enough resources to support a number of fronts, long-term development and maintenance work. In this case, the way web apps are used is worth trying. Although the user experience and so on to catch up with the original client, but from the platform adaptability and development cost perspective, the overall price is good.

Unless you decide to do nothing, responsive web design is our best practice. But while the problem surface is about styling and rendering, there may be a lot of refactoring to do with the page code structure. Of course, if your site has done a lot of good enough to make web standardization such as separation of structure and performance, it can be relatively easy.

Article Source: Beforweb

Source: http://www.leiphone.com/web-mobile-puzzle.html