3キャリア共通XHTML


細かい違いはありますが、XHTMLでソースを記述する事により、ほぼ全てのモバイルキャリアで同じ表現が可能となります。

例えば<div>属性のbgcolor=""やalign=""を使用すると、i-modeでは反映されない機種がまだ多く利用されています。

また、ページデザインやページ区切りの為、文字の後ろに色を付けたい場合に、TABLEタグを使用している方も多いのでは?

このTABLEタグほど、携帯ブラウザに依存したタグはないでしょう。

※TABLEの場合、属性align="left"を記述しなくても携帯では左寄せになるが、PCでは中央揃えになる。
※W3Cは「TABLEはコンテンツの整理のためだけに使用し、ページ全体のレイアウトを決めるためには使用しない事を推奨している。ページのレイアウト設定には<div>タグでデザインした方が良い。」としている。

このようにTABLEタグを使用してデザインを施す場合は特に注意が必要です。

TABLEタグで、モバイル3キャリアを意識して文字の後ろに色付けをする場合、<table><tr><td bgcolor="色">テキスト</td></tr></table>としなくてはなりません。

ところが、枠線を付けるため<table>にborder=""を入れたり、<tr>にbgcolor=""を入れてしまうと、対応していないブラウザが出てしまいます。

そこで、XHTMLで<div>や<span>を使用すればコンパクトに間違いなく、こういった色付けが出来ます。

▼例▼
<table><tr><td bgcolor="#80d6ff">テキスト</td></tr></table>
↓↓同じこと↓↓
<span style="background-color:#80d6ff;">テキスト</span>
↓表示↓
テキスト

このspan要素は部位を表しますので、テキスト部のみ色付けをします。

さらに、span要素をdivまたはpのように範囲を表す要素に替えると…
<div style="background-color:#80d6ff;">テキスト</div>
↓表示↓
テキスト


このように、後ろの色が画面横幅いっぱいに広がります。

※「文字背景に色付け」の詳しい解説は>>背景色付けタグ

参考になるか解りませんが、わたしが運営しているXHTMLサイト一括登録ランキングがあります。
ここは一見TABLEタグを多用し、色付けしている様にみえますが、TABLEタグは一切使用していません。
色付けは全て、div/spanを使用しています。

色鮮やかなサイトを制作するのであれば、XHTMLは非常に使い勝手がよく、尚且つ、モバイル3キャリア共通のサイトが制作出来ます。
いちいち振り分けプログラムを利用し、モバイルキャリア別にページを振り分ける手間もありません。

[TOP]

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