目次 1.viewportを指定する 2. apple-touch-iconを指定する 3. paddingやborderを幅に含める 4.メニューを3つ横並びにする 5.リンクに矢印を付ける 6.最後に 1.viewportを指定する スマホサイトを制作する際、一番最初に指定するものがviewportです。 そもそもviewportというものは、スマホの仮想的なウィンドウサイズのことで、デフォルトでは980pxが指定されています。このままでは文字などが小さくなり非常に見づらいです。見やすくするためにHEAD内に以下を指定します。 <meta name="viewport" content="width=device-width, initial-scale=1.0"> これで見やすい文字サイズになりました。詳しい解説はiPhone生活や、viewportとはの解説を見るといいと思います。
![【備忘録】スマホサイトのコーディング例](https://cdn-ak-scissors.b.st-hatena.com/image/square/f213e4c17366aba4a3fc57537f54847a231b6e66/height=288;version=1;width=512/https%3A%2F%2Fcreatorclip.info%2Fwp-content%2Fuploads%2F2013%2F08%2FN112_sumahodeyorokobu500.jpg)