モバイル Web ページのページ幅を設定するためのデザインのベスト プラクティスは何ですか?
-
20-09-2019 - |
質問
異なる携帯電話の異なるブラウザでは、画面解像度も異なります。
最新の携帯電話やブラウザで動作するように、幅を標準サイズに設定するためのベスト プラクティスがコミュニティにありますか?
解決
のベストプラクティス私見クライアントデバイスの幅および解像度についてあまりにも多くの仮定なしに沿って取得することです。
ほとんどがこれらのデバイスは、ウェブページを縮小/流し/表示に向けブラウザを持っています。もし可能ならば、ブラウザが仕事をさせます。
他のヒント
モバイル ブラウザー全体でピクセル完璧な精度を保証する簡単な方法はありません (実際、それを行う簡単な方法はありません) どれでも ブラウザ)。ただし、そのような作業を支援する方法がいくつかあります。たとえば、iPhone のモバイル Safari は、幅などの属性を指定できる「ビューポート」メタ タグをサポートしています。使用例をいくつか示します。
<meta name="viewport" content="width = 750px" />
<meta name="viewport" content="initial-scale=2.5, user-scalable=no" />
Appleはいくつかの情報を持っています ここ, 、Web 上でさらに多くの情報を見つけることができます。
こんにちは、
すべての携帯電話で動作する最適な画面サイズを選択することについての質問であることは承知していますが、そのアプローチはすぐにユーザーの間で薄れてしまいます。
私が関係している大規模な Web サイトは、UserAgent 文字列を取得し、それを共通の分母に正規化します。英国では、特定の Sony Ericsson 電話タイプに対して 300 を超える異なる UA 文字列が使用されているため、それらはすべて同じ文字列に変換され、テーブルを検索して画面の領域を決定します。
コーダーは、接続タイプ、ルーティング タイプなどに基づいて地理位置情報アプリケーションによって推定される現在の接続速度にもアクセスできます。 リクエスト時。 接続が遅い相手にリッチで高解像度のメディアを送信することは望ましくありません。
これは次に使用されます
- リッチコンテンツを提供できるかどうかを決定してから、
- コンテンツに最適なフォーマットを選択します。
HTH
乾杯、
あなたはいつもの代わりに、彼らはをピクセルの "EMS" を使用することができます
これは、まだ多くのモバイルブラウザは、基本的にあなたが開発者がそれを解釈したかった方法に応じたものと解釈するので厄介な課題です。