Some conclusions on developing mobile websites

The mobile version of the website should at least have some basic functions:

1. Page applicability issues:

Mobile terminals have different resolutions and screen sizes. If you still limit the width of the web page to 1003px or other pixel values ​​like the computer design, and use 12px or 14px for the font size, then the effects of different terminals will be very different. So here, it is best to make the width of the web page adaptive to the screen. Fortunately, W3C considered this for us when designing HTML. It can be done in just one sentence, that is, add

For fonts, we can just use em or ex as the unit.

2. Version production issues:

Mobile pages often have different versions for different mobile phones, generally including simplified version, standard version, 3G version, touch screen version, smart phone version, etc. In addition to the differences in page design, the page language will also be different. The simplified version is written in wap 1.0 wml script, which is very versatile and many domestic mobile phones support this language, but this language is very simplified. The standard version generally uses WAP 2.0 technology, and the corresponding scripting language is XHTML MP (XHTML Mobile Profile). This language is a subset of XHTML, and supports most CSS. It is basically the same as the computer version, but JS cannot be used generally. This is because these mobile phones do not support JS. As for the smartphone version, since all current smartphones support js, the production of this version is much simpler. However, since most smartphones (basically excluding Symbian phones, including Android, ios, wp7, etc.) support Html5, the smartphone version can be produced using html5.

3. Version control issues:

This part may be difficult to solve. How to intelligently determine the best version of the mobile phone and jump to it can be considered from the following aspects. On the one hand, you can find a way to get the operating system of the mobile phone, for example, if it is Android or iOS, you can jump to the HTML5 version. For the Windows system, there is no doubt that the computer version can get the mobile phone system by getting the phone model. The current method is through the browser's UA (user agent) to get some information about the phone. A simpler way is to directly determine the manufacturer of the phone through the UA. To obtain more information, you need a database, because different mobile phone models will have different UA information. There are many mobile phones in the world, and it is still difficult to make such a database by yourself. However, someone has already made such a database for us, or more conveniently, made a function library to identify the best version for the mobile phone. Here I recommend using Wurfl. On the other hand, you can use the script on the page to determine whether the browser supports js and html5. The code is as follows

If you just want to develop a version, just to determine whether it is a mobile client, here is a code quote from discuz! x2

4. Size issue of mobile version:

Generally speaking, for the simplified and regular versions of mobile web pages, we try to make them as concise as possible, and it is best to save as much code as possible. After all, mobile data traffic is still very precious to users. For example, when naming elements, if there are few pages, the shorter the name, the better, and the CSS is best written in one line. In CSS, some elements inherit the style of their parent class. There is no need to define them repeatedly, and make good use of the default values.

5. Browser Cache:

If the update is not fast, it is best to enable browser cache.