小さな画面のモバイルデバイス向けにWebページを設計する際に注意すべきこと

• 携帯電話の画面解像度はバラエティに富んでおり、さまざまな解像度があります。
• モバイルインターネットの料金が高すぎる！
• UCブラウザは大きな市場シェアを誇ります！

UC ブラウザについて:

はい、言及しなければなりません。市場シェアが高いと誰が言ったのですか?
UC ブラウザに関しては、明らかに我が国の国情に非常に適しており、ユーザーがモバイル インターネット トラフィックを最大限に節約するのに役立ちます。 （UCブラウザのスローガンはデータ通信量の節約だそうです）。
モバイル アプリケーションとテキストの読みやすさに基づいて、UC ブラウザは大きなフォントと広い行間隔も特徴としています。
他のモバイル ブラウザと比較して、UC ブラウザは HTML タグと CSS 属性を処理するための特別でカスタマイズされた方法を備えています。
現状では、モバイル インターネット アクセスのコストが大幅に削減され、消費者がモバイル インターネットをより大胆に利用できるようになるまで、これらの特別措置は長期間継続されることになります。

実際の開発では、UC ブラウザは CSS に対して「特別な配慮」をしていることがわかりました。

• font-family 属性はサポートされていないため、UC ブラウザでは 1 つのフォントしか表示されません。
• font-size 属性はサポートされていないため、UC ブラウザでは同じサイズのフォントしか表示されません。
• 幅、高さ、パディング、マージン、行の高さの属性はサポートされていません。つまり、UC ブラウザでは、行を折り返して上下の文字間隔を実現するには、p や br などの HTML タグのみを使用できます。
• 固定ピクセル幅とページの 100% 表示はサポートされていません。つまり、UC ブラウザでは常に「全画面」で表示されます。
• フローティング レイアウトとカスケード レイアウトはサポートされておらず、フロート属性と位置属性は無効です。つまり、UC ブラウザーでは「左揃え」のみが表示されます。
• background-color はサポートされていますが、background-image はサポートされていないため、CSS 背景画像の表示はサポートされていません。UC ブラウザでは背景色のみが表示されます。

しかし、私は依然として、画面の小さいモバイルデバイス向けの Web サイトを構築する場合、WebKit エンジンのブラウザーを標準としてインターフェイスを開発できると考えています。
つまり、 UC ブラウザ標準に基づいて Web ページを設計するのではなく、UC ブラウザをサポートするように Web ページを設計します。
これを行うもう 1 つの利点は、ほとんどのモバイル ブラウザーで比較的一貫したスタイルを確保できることです。
float などの標準 CSS プロパティをサポートしていない UC などのブラウザーについては、あまり心配する必要はありません。
ただし、UC ブラウザでインターフェイス内の要素が適切な読み取り順序を維持できるようにするために、HTML コーダーは各 HTML タグの順序に注意することを強くお勧めします。
なぜなら、float 属性と position 属性をサポートするブラウザでのみ、ページ上のコンテナーを任意にフロートまたはスタックできるからです。それ以外の場合、ブラウザは HTML タグを出現順に表示します。

小型画面のモバイルデバイス向けの Web デザインに関するその他の関連補足資料:

• ヘッダ
  画面の小さいモバイルデバイスの特性を考慮して、Web ページを設計するときに、一部の Web サイト ヘッダー (ロゴ、グローバル ナビゲーションなどを含む) を削除することができます。
  たとえば、 flick の大きな画像ページでは、 Web サイトのヘッダーが削除されます。

ここで私は流行のデザイン原則を作成しました。 「小画面のモバイルデバイスのインターフェース設計では、特定のタスクのインターフェースは、ユーザーがアプリケーション自体ではなく現在のタスクに集中できるように優先する必要があります。 」この原則は実現可能であり、モバイルデバイスアプリケーションの設計にも適用されます〜
たとえば、画面の小さいモバイル デバイス用のメールボックスを設計している場合は、手紙を書くページや電子メールを読むページの Web サイト ヘッダーを削除できます。