スマホ・レスポンシブ対応は万能でもない

　スマホでどう見られるかは非常に重要ということがだんだんと分かってきた。
　そこは初心者。


　これは「レスポンシブデザインにしといたらいい」ということが、よく言われる。

　レスポンシブとは「パソコンから見たのと同じようにスマホでも見れる」と言われる。
　パソコンで見るページがそのままスマホ用に表示されるので、デザインが変わらない。

　そんな風に俺もレスポンシブというのを捉えていた。


　ただ、レスポンシブっていうのは誤解も多いのかも知れないと思った。

　別にそのままPC版のものが見える方法というのでもない。
　スマホに対応してサイズを縮小してもデザインが崩れないという意味。こちらは何もしないでいいというわけではない。


　ワードプレス以外はたいていブログサービス側で指定するのだが、SSLへの切り替えのようにただそうやって「スマホとPCで共通のデザインを表示する」と選択すれば終わりではない。


　言ってみればHTMLソースにスマホ対応するしないの設定がされていて、振り分けるという感じ。
　「レスポンシブ対応のテンプレ」というのは、最初からこれが考慮されて調整されているという程度の意味だ。

　まず、そのページのHTMLソースのヘッダに
<meta name=”viewport” content=”width=device-width,initial-scale=1.0″>
とviewportが指定されていること。

　ここをいじればいい。

　あと、CSSに
@media screen and (max-width: 480px)　{img {display:none ;} }

　なんてやる。

　こんな風に、スマホの場合は画像を非表示にする。
　つまり「スマホの場合は表示をどうするか」なんて条件でページを作る。

　
　テンプレが「スマホ対応」とか「レスポンシブデザイン」とか書いてあってもviewportは自分でやらないといけない。

　俺はグーグル様から警告がこなければ分からなかった。


　初心者の俺はやっとここまで理解しただけだった。

　素直にレスポンシブにはした。
　それから表示をろくに確認もせず、放置してきた。
　これでスマホ対応できたろう、なんて。



　しかし、このところの既存メディアの報道なんかがいい例だけど、最近の風潮って、真逆のことが言われるというか、落とし穴、嘘があるような気がする。

　朝日新聞の言うことの反対が真実、とかw。
　本当にレスポンシブはスマホ表示に最適化かされているのか。



　そこでスマホでレスポンスポンシブにしたのをちょっと確認してみると、スマホ用のバナー広告が目立つようには出ていない。

　文字も大きくなってしまっていたりした。

　これは、view point　というのを設定して解決するんだけど

＜meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0"＞

　こんな風なコードをヘッダ部に書いておく
　スケールを小さくすれば全体が見えるようになる。

＜meta name="viewport" content="width=device-width,initial-scale=0.8,minimum-scale=0.8,maximum-scale=1.5,user-scalable=1"＞

　なんてやると、最初は小さめに全体のページが把握できて、拡大は最大で1.5倍ぐらいまでできる。そんなのに変えた。


　viewportはレスポンシブにしている人のためのものだが、それでも広告がゴチャついているように見える。


　俺はレスポンシブのデメリットの方が気になった。
　バナー広告自体もレスポンシブで、スマホ向けに最適化されているはずなのに。


　もしかして、レスポンシブってダメなんじゃないかと思った。

　考えてみればページの最後にはPC版に切り替えるボタンがあるブログサービスもある。
　スマホの人たちは、不便ならPC版に切り替えようと思えばできる。

　わざわざこちらでレスポンシブにしてあげなくてもいいんじゃないか。
　そう思った。



　もっと言えば、例えば「はてブロ」みたいな場合がある。

　「はてブロ」は有料にしないとスマホ版はまるでいじれないようになっている。
　記事の下に広告を出すような設定とか、なにもできない。メニューも無料版ではまるでイジれない。

　仕方がないから「はてブロ」はレスポンシブにしている。

　シンプルな記事と絞ったブログパーツにしてレスポンシブにしている。
　スマホ用の広告もなんとかサイズを考えれば思った通りに出てくれる。

　しかしこれを逆に言えば、スマホ版をせっかく有料にして縛りをかけていても「はてブロ」にはレスポンシブという逃げ道があるということになる。
　「はてブロ」はそれを許している。

　ということは、せいぜい「やりたきゃやってもいいヨ」というのがレスポンシブで、少し劣ったものがレスポンシブということなんじゃないかと思った。


　レスポンシブというのは別に格段の優位性というのはないかも知れない。
　「はてブロ」の姿勢はそんなことを示唆していると思った。



　ここのBloggerは最初からレスポンシブ対応だ。
　正確には「レスポンシブなサイトを作れるようになっている」と言ったらいいのか。

　スマホでも表示させたいパーツがある時は　その<div>なんかで囲ってあるパーツにmobile="yes"　なんて書く。

　mobile="only"　なんてこともできる。


　サイトをスマホ対応させるよう注意すべきというのは当然だ。
　今はスマホからサイトを見てくれる人が多い。

　スマホ読者が便利なようにサイトが設計されているということが重要なのであって、PC版とはニーズは違う。
　レスポンシブにしたからそれでいいというわけではない。

👉・スマホならトップページからまず記事一覧を見て記事を選びたい。

👉・スマホは余計な便利ガジェット、ブログパーツは不要だ。

👉・スマホユーザーは記事を読むのが早い。

👉・スマホユーザーのため、読者になるボタンはあった方がいいかも知れない。
　（※　ここはどうするかまだ検討中だ）