スマホサイト制作の基本

昨日に引き続き、今日はスマホサイト制作を初めて経験した。

その基本のキとも呼べる部分が Viewport なる概念だろう。

これもなかなかツワモノで、その概念をつかむのに多少時間がかかった。

こちらのサイトがわかりやすい。

スマホコーディング初心者のための、ビューポート(viewport)の概念の説明 | 小棹制作所

つまりは、表示されるWebサイトをのうち、どれだけの幅を標準として表示するかという値である。

例えば、幅が640pxの画像をviewport = 320の設定で表示した場合、画像の半分しか１画面上には写されない。

ちなみに、iPhoneの device-widthも320pxであるため、 width = device-widthにした場合でも同じ結果となる。