Web技術

ビューポート

ビューポートは、ブラウザーの中で、いま見えているWebページの表示領域のことです。スマートフォンでは、画面幅に合わせた表示を作るときに重要になります。

概要

ビューポートは、ページのうち実際に見えている窓のような領域である。MDNの用語集は、ウィンドウ内で現在見えている部分と説明している。

スマートフォンでは、ページが縮小されて表示されることがある。表示幅を機器に合わせる設定をHTMLに書くことが、レスポンシブデザインの基本になる。

メディアクエリは、ビューポートの幅に応じて表示の指定を切り替える。ビューポートの幅を意識して設計すると、表示の崩れを減らせる。