Generally speaking, there are two ways to move a Web site, specifically to develop a standalone mobile version, using media type and media query to control the performance of the Web site in mobile browsers, and this article and the next article will introduce the first scenario, and the following article will end the 2nd scenario.
Mobile internet is known as the "fifth technological revolution", and with the growing popularity of smartphones such as iphones and Android and the advent of tablets such as the ipad, the potential and trends of mobile internet are becoming increasingly apparent, and the development of Web sites for mobile devices is gaining increasing attention Many companies in the country are also starting to focus on web development for all mobile devices.
Generally speaking, there are two ways to move a Web site:
- Specialized in developing a standalone mobile version
- Use media type and media query to control the performance of your Web site in a mobile browser
This article and the next article will introduce the first scenario, and the following article will end the 2nd scenario.
This article we first understand the mobile Site markup language.
The evolution of mobile website Markup Language
Let's take a look at a chart of the evolution of mobile web-related markup languages @AdrianF2E share, at a glance:
This image shows the development of markup language, including mobile website Markup Language.
Mobile Web development is more complicated than ordinary web development, and choosing a markup language for mobile sites is also quite tangled.
Initially, the WAP forum (later merged with NTT, comprising Oma,open Mobile Alliance) created an xml-based language called WML, which is the markup language for WAP sites. It's not an ideal scenario because it splits the site into two parts: the normal page uses (X) HTML, and the mobile site uses WML. Web developers want to do a mobile site also have to learn a new language rather than conversion technology, "one-stop" Creed is also broken, users can not access their favorite sites and have to find the site's WAP version-if they exist. In addition, Japan's NTT created their own language cHTML (compact HTML), but it was not compatible with XHTML and WML.
Since this is a far cry from the ideal scenario, the consortium created XHTML Basic 1.0. As its name is, this is a subset of XHTML 1.1. As XHTML 1.1 improves XHTML to small modules, a subset can contain only the basic modules, elements, and attributes that are required or can be controlled on low-end mobile devices.
Based on XHTML
XHTML Basic provides a basic module for the markup language for mobile web sites. Like its underlying XML, it is also designed to be extended. This combines the practice of WAP and NTT after the merger (i.e. OMA), which created the successor of cHTML and WML XHTML Mobile profile--It adds some of the features in the previous version to XHTML Basic. The coexistence of XHTML Basic and XHTML MP looks a bit confusing, but soon thereafter the consortium released the XHTML 1.1 version, absorbing some of the features added to the XHTML MP. So now it seems that these two versions are almost the same, as to the use of a lot of time just to see a person's preference. Here we choose XHTML Basic, because it is recommended by the consortium ... :)
Start using XHTML Basic
Since XHTML Basic is a subset of XHTML, if you already know the development of XHTML, then the page that starts to make XHTML Basic is extremely easy.
<?xml version= "1.0" encoding= "Utf-8"?> <! DOCTYPE HTML PUBLIC "-//w3c//dtd XHTML Basic 1.1//en" "Http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd" > <title>hello mobile</title> <body> </body> |
Yes, just add an XML header declaration, and then use the XHTML basic DTD.
Modules supported by XHTML Basic
Module |
element/attribute |
Structure |
HTML, head, title, body |
Text |
ABBR, acronym, address, BLOCKQUOTE, BR, cite, code, DFN, Div, EM, H1, H2, H3, H4, H5, H6, KBD, p, Pre, q, Samp, span, Stro Ng, Var |
Link |
A |
List |
DL, DT, DD, OL, UL, Li |
Form |
button, fieldset, form, input, label, legend, select, optgroup, option, textarea |
Form |
Aption, table, TD, TH, TR |
Image |
Img |
Object |
Object, param |
Performance |
B, big, HR, I, small, sub, SUP, TT |
Meta information |
Meta |
Link |
Link |
Base |
Base |
Event |
Onblur, onfocus, onload, OnUnload, OnReset, onsubmit, onchange |
Script |
Script, NoScript |
Style |
Support Style elements |
Style properties |
Support Style Property |
Goal |
Support Target Attribute |
Unsupported content :
- External CSS File not supported
- Nested table is not supported;
- Do not support THEAD, tbody, Tfood, etc.;
- The Name property is not supported;
- frames are not supported;
- Elements such as Del, INS, Basefont, center, dir, Font, Isindex, menu, Sstricke, u are not supported.
Precautions:
- Support for events relies on specific browser support, and some browsers do not necessarily support these events;
- WebKit Support for more events
- Opera Mini because it is based on its own proxy server, some events are not supported, see: JavaScript Support in Opera mini 4
XHTML MP
As mentioned earlier, the XHTML MP is an extension of XHTML Basic, so the XHTML MP has better applicability . The main advantage of XHTML MP for Basic is to support external style files-although this can result in one more HTTP request.
Here is a comparison table of XHTML MP and XHTML Basic.
PS: In fact, WAP 2.0 is the XHTML MP, which means that WAP 2.0 has little to do with WAP 1.0.
Compatibility and Status quo
- According to the statistics of the consortium, the majority of mobile phones now support WAP 2.0, and the use of WAP 1.0 devices has been very small;
- According to observation, the majority of the mobile version of the website, is the adoption of XHTML MP specification;
- Most Web sites use inline style sheets, not external style files;
- A lot of mobile version of the page using table layout ;
- Opera Mini can be used on all Java-enabled handsets, while Opera Mini supports all of the (X) HTML features.
So, if you want to develop a mobile Web site, you can use XHTML Basic 1.1/mp with ease.
HTML5
Mobile WebKit is currently the best supported for standards, and it supports all XHTML features, as well as support for HTML5. If your project is only for the iphone and/or Android, you can use HTML 5来 encoding entirely.
In fact, as another strong trend, HTML 5 is expected to become the next generation of web standards, Google, Apple, Opera and Microsoft and other internet giants have been trying to promote and promote HTML 5. Opera believes that HTML 5 is the key to a unified mobile internet.
Summary and Prospect
As mentioned earlier, XHTML Basic supports most of the underlying features defined in XHTML, so for most front-end developers it is not difficult to develop a Web site based on XHTML Basic 1.1 or XHTML MP. But because mobile device manufacturers and devices are so much more, there may be a difference in the specifics of each device.
The greatest value of the existence of the consortium is to provide us with a mature and unified solution, although the XHTML MP is the de facto mobile standard, but obviously XHTML basic work, if the two sides are still easy to confuse, we hope that in the near future, HTML 5 can become the de facto standard in mobile Internet, which will undoubtedly greatly reduce our development needs.
But because the reality is difficult to unify all equipment, this causes the realization way the inevitable existence difference. As you can foresee, XHTML BASIC/MP and HTML 5 will become two parallel specifications, we have to use XHTML basic/mp for low-end devices to develop the basic page, while using HTML 5 for the iphone and Android and other systems to achieve rich interface.
Organized from: Mobile markup–xhtml Basic 1.1
Reference:
- XHTML MP (XHTML Mobile profile) Introduction
- http://www.w3.org/TR/xhtml-basic/