標準ランディング ページのピクセル単位のサイズは?

適切に設計されたランディング ページは、ポジティブな印象を残し、Web サイトで提供する製品やサービスを効果的に販売します。デバイスに不適切なウィンドウ サイズを使用すると、ランディング ページの印象が損なわれ、訪問者が [X] をクリックしてウィンドウを閉じてしまう可能性があります。ランディング ページは、ユーザーを惹きつけ、製品やサービスを明確に説明するコンセプトに基づいて設計する必要があります。ランディング ページはホームページではありません。訪問者はリンクまたは広告をクリックしてランディング ページにアクセスします。
デスクトップ ランディング ページのサイズ
デスクトップとラップトップのモニターにはさまざまなサイズと解像度があるため、ランディング ページのサイズを調整する際に最小公分母にアピールすることが容易になります。平均的な画面サイズは増え続けていますが、ほとんどのモニターは少なくとも 1024 x 768 の解像度を備えています。幅 960 ピクセルのデスクトップ ランディング ページは、ほぼすべてのコンピューター モニターで動作します。高さ 720 ピクセル以内のランディング ページ コンテンツは、ページの読み込み時に画面に安全に表示されます。デスクトップ ユーザーは画面を下にスクロールして追加のコンテンツを表示できるため、デスクトップ ランディング ページの幅は高さよりもはるかに重要です。ページを小さくして、画面のスペースを犠牲にすることはいつでもできます。
モバイル デバイス向けのデザイン
大きなデスクトップ ランディング ページは、モバイル デバイスでは機能しません。コンテンツが横にはみ出したり、判読できないサイズに縮小したりします。モバイル デバイスは「小さい」画面サイズのカテゴリに属し、約 320 ピクセルの安全な解像度幅を備えています。一部のモバイル デバイスでは画面が大きくなりますが、幅 320 ピクセルのランディング ページはほとんどのモバイル デバイスで適切に表示されます。デスクトップの場合と同様に、モバイルのランディング ページでも高さは二次的な問題です。ただし、一度に約 426 垂直ピクセルのコンテンツを画面に収めることができます。
タブレット デバイス用にカスタマイズ
タブレット サイト用にカスタマイズされたランディング ページを開発できます。ただし、幅 960 ピクセルのデスクトップ ランディング ページは、より大きなタブレット デバイスに収まります。 7 インチ範囲の小型タブレットは通常、幅 640 ピクセルの画面を備えています。幅 960 ピクセルの画面用に設計されたランディング ページは、小さい画面に収まるように約 3 分の 1 に縮小されます。品質と読みやすさを犠牲にすることなく小さなコンテンツを大きな画面に表示できるため、幅 640 ピクセル、高さ 480 ピクセルのタブレット ランディング ページを設計すると、すべてのデバイスで機能します。小さいタブレット ユーザーはデバイスを横向きモードで保持することを選択できますが、大きいタブレット ユーザーはデバイスを縦向きモードで保持するため、640 ピクセルの幅が両方の画面サイズに対応します。
レスポンシブ デザインに切り替える
デバイスごとに異なるランディング ページを作成する代わりに、メディア クエリとレスポンシブ デザインのコンセプトを使用して、訪問者の画面のサイズに応じてコンテンツを再配置するページを作成できます。レスポンシブ デザインのランディング ページは、コンテンツ内を移動し、さまざまな解像度範囲でコンテンツ サイズを変更するように構成できるため、どの画面でもコンテンツを快適に表示できます。