How to make on mobile page that uses XHTML Mobile Profile
Even if a mobile page (page for the cellular phone) is made from CHTML, any cellular phone is displayed without trouble. However, Style Sheet (CSS) cannot be used for CHTML. If a mobile page is made by using CSS, it is used XHTML Basic or XHTML Mobile Profile.
What is XHTML Mobile Profile 1.0?
XHTML Mobile Profile is the one made a specification in the WAP forum for the cellular phone adding the enhancing tag and attributes such as tag and the style tag such as <b >, < hr >, and < small > in addition to XHTML Basic of the W3C recommendation. Therefore, if a mobile page is made, this might be better.
Example of mobile page written with XHTML Mobile Profile 1.0
It is informed that the mobile page written with XHTML Mobile Profile 1.0 is XML document in the first line a browser. It is this description and there is no problem for usual XHTML and SSI, and it makes an error of the first line and it is not possible to display it for PHP.
This is because of becoming an error because it is at the beginning the same as the part when the XML declaration that starts by "<? " omits and writes PHP. There is no problem if the following line is added to .htaccess file to use this omission with PHP.
php_flag short_open_tag Off
The lang attribute cannot be used with XHTML Basic and XHTML Mobile Profile though the lang attribute can be used for XHTML 1.0 in the html tag. Only xml:lang can be used.
It is informed that text character's code is written with Shift_JIS in the meta tag in the head tag them. Naturally, the character-code is written by shift JIS. Meta name = "description" and meta name ="keywords" are SEO measures. TITLE tag is written putting an adequate title on the page.
Link rel = "stylesheet" type = "text/css",and href ="mobile.css ", are set external CSS file. It is noted that the i-mode of DoCoMo doesn't correspond to external CSS.
In the body tag, finding (H1-H6 tag) is put as the person and the search robot see easily. Sentences are composed by using the paragraph (P tag) putting the paragraph on sentences. It changes line by changing line (BR tag) to change line moderately though you may not change line excluding the paragraph. The link (A tag) is used to link.
Almost usual sentences can be made only from this. There is no problem even if P tag is not used and sentences are written without tag.
<?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang"ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta name="description" content="***********" /> <meta name="keywords" content="***,***,***" /> <link rel="stylesheet" type="text/css" href="mobile.css" /> <link rel="alternate" media="handheld" href="http://****.jp/***/***.htm" type="text/html" /> <title>*****</title> </head> <body> <h1>*****</h1> It is OK without tag. <p>Writes sentences by usually using P tag.</p> <br /> <a href="***">*****</a> </body> </html>
Other tag that can be used with XHTML Mobile Profile 1.0
The main tag that can be used with XHTML Mobile Profile 1.0 besides the above-mentioned is as follows.
- div position specification align = "left | center | right"
- Basic table caption, table, td, th, and tr
- pre solid writing(The source is displayed as it is.)
- ul list
- li list
- form form action ="URL" Method = "get | post"
- input text input field, radiobutton, and check box
- img image display GIF and the JPEG image can be used without trouble.
Tag and attribute that is not possible to use with XHTML Basic, and was added with XHTML Mobile Profile
- b, big, hr, i, and small tag
- style tag and style attribute
- fieldset and optgroup tag(These are not so used.)
- Start attribute of ol tag and value attribute of li tag
Method of telling mobile, special page to search robot
The link tag is written as follows in the head tag to tell the search robot a mobile, special page it. Url on the page is written in href. Thus, it is recognized that the search robot is a mobile page.
<link rel="alternate" media="handheld" href="http://****.jp/***/***.htm" type="text/html">
The grammar of XHTML Mobile Profile 1.0 is diagnosed.
When a mobile page is completed, let's check the grammar of XHTML Mobile Profile 1.0 on the HTML grammar diagnosis page. Let's usually assume that it only has not to be a serious error though it becomes a considerably severe diagnostic outcome.