携帯電話向けウェブページ作成のヒント

モバイル ページの幅は 240 ピクセル以内に制御するのが最適です。これにより、画面を移動せずに一連の操作を実行できるようになります。弊社のプロジェクトでは、240×420サイズの背景画像を使用しました。これには実は欠点があります。各ページの高さを 420 以内に抑えなければならず、制限を超えると見栄えが悪くなります。

普通の携帯電話もスマートフォンも js をサポートしていないようです。 <a href="javascript:history.back()"> や "alert()" などの関数はサポートされていません。また、携帯電話では「<input type="button">」のスタイルがあまりサポートされていません。幅を指定すると、同じコードでもブラウザと携帯電話では幅に一定の差が生じます。したがって、私の提案は、可能であればボタンの使用を避けることです。代わりにテキスト ハイパーリンクを使用するか、小さなアイコンの使用を検討してください。

リスト ページには、ul li や p+space ではなく、table を使用するのが最適です。これはタイプセット用であり、列内の要素が長すぎる場合は、「table tr td{word-break:break-all;}」を使用できます。他の 2 つのソリューションでは、文字列を切り捨てることしかできません。もちろん、私の観点からすると、ページの高さは固定されているので、文字列を切り捨てることは良い選択かもしれません。

大きな画像には、依然として一定の必要性があります。たとえば、ナビゲーションマップは、人々に眩しい感覚を与えることができますが、画像が大きすぎることはできず、10K 以内に制御する必要があります。当社のナビゲーションマップは、以下のようにLenovoの携帯電話に似たページを使用しています。

モバイル Web ページの詳細は、通常の Web ページよりはるかに少ない可能性があります。少なくとも、IE6、7、8 などのブラウザーを必要とせず、モバイル ページに渡すだけで済みます。ただし、見栄えを良くするには、まだ少し考慮が必要です。