実際の携帯電話向けコンテンツの作成法を纏めてみました。
もちろん、この方法に従わなければならないと言う訳でも無いのですが、初めてで右も左も分からない方には指針にはなるでしょう。
より端末の現状に即した方法については、携帯電話向けサイトでのデザインをご覧ください。
当り前ですが、公開したいものが無ければわざわざウェブを作る必要はありません。
PC向けサイトを既に持っていて、その"おまけ"として携帯電話版を作るのか、あるいは携帯電話版をPC兼用として公開するのかによって、サイトの構成も随分違ってくるでしょう。
対応端末をどうするのかも考えなければなりません。
ただ、携帯電話は以下のような制約があります。
一番旧いiモード端末まで考えるなら総容量は画像込みで 5キロ以内( 2キロ以内が望ましい)にします。
画像を含む場合、初期のiモード端末では画像が見られなくてもテキスト情報だけ読めれば充分と割り切るのであれば、テキスト 5キロバイト以内( 2キロバイト以内推奨)・画像込み10キロバイト以内まで許されます。
いずれにしても、コンテンツに依っては、ページを適宜分割する必要があるかも知れません。
現在の端末は殆どがJPEG画像に対応しておりますが、旧式のiモード端末では表示出来ません。
また、ソフトバンク旧型機とV801シリーズではGIF画像が表示出来ません。
こう言った事を考えて適切な画像を用意しましょう。
また、容量制限も決して忘れないで下さい。
携帯電話でのスクロール操作は非常に面倒です。文章は一文字でも短くなるようにしましょう。
例えば、
<p>文章は一文字でも短くなるようにしましょう。</p>も、携帯電話向けなら
<p>文章は一字でも短くしましょう。</p>くらい端折った方がいいでしょう。
携帯電話向けにはXHTML モバイル・プロファイルで記述するのが望ましいですが、どうしても旧型機での見映えを重視したいならXHTML 1.0 トランジッショナルで書いても構いません。
初めての方は最低限、これだけ覚えておけばいいでしょう。詳しくはHTML&CSS入門内の『基本となる要素』をご覧下さい。
最後に、文字コードの指定とHTML文書構造を明記して、XHTML モバイル・プロファイルかXHTML 1.0 トランジッショナルの<!DOCTYPE>宣言を付ければ完成です。
必要に応じてハイパーリンク,画像の埋込みも随時行えば、一通りのことは出来るでしょう。
また、サイトのお品書きなどには段落を並べる代りにリスト要素群を用いるとさらにすっきりしたものになります。
勿論、スタイル定義ファイル無しでプレーンな表示になっても、情報が伝わればそれで充分と言うのも一つの選択です。
スタイル定義ファイルを採用する場合、ご自分でスタイル定義ファイルを書かなくてもいいのですが、あいにくモバイル向けのCSSスタイル定義ファイルは余り出廻っていないので、PC向けのスタイル定義ファイルを携帯電話向けに改変するという方法もあります。
また、PCでも閲覧出来るようにPC用のスタイル定義ファイルを合わせて作っておくのもいいでしょう。
実際のCSSスタイル定義ファイルの書き方は、CSS作成の実習で簡単に解説しておきましたので、ご一読ください。
XHTML 1.0 トランジッショナルで書く場合は、一通りのマークアップが完了した後で物理要素・属性による見映えの調整をすれば良いでしょう。
この場合、CSSが使える環境ではCSSの定義が優先されます。CSSの方が遙かに多彩な表現が可能なので、CSSスタイル定義ファイルも作っておきましょう。