スマホでは拡大表示が当然？

質問

最近iPhone5Sを購入した者です。
今までずっとガラケーを使っていただけに、初めてのスマホに慣れません。

スマホの表示についてなのですが、二本指でピンチすると画面が拡大・縮小されますよね。
パソコンで見ることを想定して作られたサイトなど、文字がとても小さくて読みづらい（読みづらいだけならまだしも、リンクの文字が小さくて押しづらい）のですが、こういう場合、拡大表示をするのがスマホでは当然なのですか？

なぜこんなことを聞くかというと、私自身Webサイトを運営しており、パソコンとガラケーでしか動作確認をしてこなかったので、スマホで閲覧したときの自分のサイトの見え方に驚いているからなのです。
最近ではレスポンシブデザインを採用するほうがよいかもと考え始めています。

スマホでも見やすいように文字数は大きいほうがよいのでしょうか？　あるいは、どうせ拡大できるのだから小さくても構わないのでしょうか？

回答No.2

okgoripon

>こういう場合、拡大表示をするのがスマホでは当然なのですか？

スマホ向けに作られていないページなら、わりと普通ですね。
そのへんは仕方が無いところだと思います。

拡大の操作は、それはそれで面倒くさいので、私だったら拡大操作が必要無いページのほうが良いと思います。

回答No.1

asciiz

PC用サイト・ガラケー用サイトのほか、「スマホ用サイト」を用意するところも多くなってきましたね。

やはり、PC用サイトをそのまま表示するとやけに文字が小さかったり、縦に重なったリンクはスマホでは選択しづらかったりしますから。

ただ私も、自作のcgiでやたら文字が小さくなるため調べたところ、どうやらスマホの想定するWebページデフォルト幅が980pixとかで、さらにそれを画面横幅に入るよう、調整してしまうためのようです。
(→スマホ幅なんて320とか480pixぐらいなんだから、いきなり半分以下の縮小に。)

それでさらに調べたところ、HTMLヘッダに以下のMETAタグを書いておくと、始めから割と良い大きさで表示されるようになりました。

<meta name="viewport" content="width=device-width">

「Webのページ幅を、デバイス幅とする」という指定なので、無理に縮小されなくなります。
これで使いづらいようなら、やはりスマホ用サイトを作った方が良いでしょう。

ついでに、次のものもほぼ必須です、

<meta name="format-detection" content="telephone=no">

「電話番号検出を無効にする」という指定です。
電話番号と言っても、空白入りでも5個ぐらい数字が続くと、勝手に電話リンクにされてしまって、正直迷惑な感じです。
そこで、それを抑制します。

PC向けにはほとんど悪影響ありませんから、とりあえず上記2つを入れておくと良いかと…。
(PCブラウザでは、ウインドウ幅で自動改行するようになりますが。)

その他にもmeta viewport にはオプションがあり、もっと良い指定ができるかもしれません。

＞【iPhone】<meta name=”viewport”>について
＞http://minimo.jp/?p=308