基本構造

モバイル用のXHTML1.0 Transitional基本構造です。

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">

<head>
<title>タイトル</title>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />

<style type="text/css">
<![CDATA[
a:link{color:色コード;}
a:visited{color:色コード;}
a:focus{color:色コード;}
]]>
</style>
</head>

<body style="background-color:色コード;color:色コード;background-image:url(画像URL);font-size:値;">


</body>
</html>
▼DOCTYPE▼

▼HEAD▼

▼BODY▼



【説明】


・まず何よりも先に
<?xml version="1.0" encoding="Shift_JIS"?>
を記述。


・次にXHTML1.0 Transitionalのドキュメントタイプ
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
を記述。
この2行があって初めてブラウザがXHTMLと認識する。


・HTML宣言
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
を記述。ここではXML日本語を指定している。


・HEAD宣言
<head>
を記述。


・MIMEタイプ
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />
を設定。ここではCONTENTxhtml、CHARSETshift_jisで設定。
尚、i-modeの場合、必ずCONTENTを「application/xhtml+xml」にしないとXHTMLとして認識しない。
au/SoftBank/PCは「application/xhtml+xml」でも「text/html」でもXHTMLとして認識する。



・bodyのCSS
<style type="text/css">
<![CDATA[
a:link{color:色コード;}
a:visited{color:色コード;}
a:focus{color:色コード;}
]]>
</style>

を記述。
HTMLの場合スタイルシートは<!-- -->で囲むがXHTMLの場合は<![CDATA[ ]]>となる。
尚、これはリンク色を<style>で設定している。

a:link
未訪問リンク色

a:visited
訪問済リンク色

a:focus
リンク選択時色

※docomoで記述出来るCSSは上記の3種類のみ

※リンク色の詳しい解説は>>リンク色について


・HEAD終了宣言
</head>
を記述。


body属性付記
<body style="background-color:色コード;color:色コード;background-image:url(画像URL);font-size:値;">

ここではページの各設定を行う。設定をしなくてもデフォルトの設定が反映されるため、特段付記はしなくても構わないが、背景色や画像、文字色等を設定したい場合はBODY属性に付記する。

background-color:背景色

color:文字色

background-image:url(背景画像URL)

font-size:文字サイズ値(xx-small/medium/xx-large等)

※bodyに記述出来るstyle属性は上記の4種類のみ。
※docomoではこのようにページ設定を行う。CSSにページ設定をしても反映されない。


※style属性の詳しい解説は>>style属性一覧


これがモバイル用XHTMLの基本的な構造です。

[TOP]

(C)アクセスアップSEO方法