モバイルファーストとレスポンシブデザイン
世間はお盆休み真っ只中のマ＠キカックがお伝えします。
※通勤電車は空いてていいんだけどさ・・・。
今回は真面目に「モバイルファースト」について考えてみたいと思います。
「モバイルファーストとは」で調べるとさまざまな解説がありますが
「モバイルファースト」が提唱されたのは2009年11月のこと。
Luke Wroblewski氏が自身サイトで記事を公開、2年後に書籍が発売されました。
日本でiPhoneが初めて発売されたのが、2008年7月。（Wikipedia-iPhone出典）
それから現在まで、iPad、iPadmini、Nexus7、Nexus10、Xperia、Kindle、FireSurfaceなど
数えきればキリがないほどの、スマホ・タブレットが発売され
多種多様のモバイルでのアクセスがなされています。
スマホ・タブレット登場以前は、ケータイとPCは住み分けられ
コンテンツはそれぞれの端末のみの対応で充分でした。
しかし、現在のようにモバイル端末を持つ人口が増え、単に移動中に使うだけでなく
自宅等でも使うようになり、PCを持っていないという人も増えてきています。
そのような現状では、「モバイルファースト」が提唱された当時の状況とは
少し異なってきているのではないかと思います。
提唱された当時は、モバイル端末のスクリーンが小さく、通信速度が遅い、という面があり
それを考慮したサイトデザイン、サイトコンテンツであるべきといったものであったと思います。
実際に、現在でも「モバイルファーストとは、Webサイトを作る際にまずモバイルサイトから～」といったものも見受けられます。
それは間違いではありません。
しかし、モバイル端末のスクリーンサイズが必ずしも、小さなものではないこと
通信速度が遅いものばかりではないことも頭に入れておく必要があるのではないかと思います。
では、どうすべきか。
実際、スマホやタブレットの人口はこれからますます増えていくでしょう。
その意味では、モバイルファーストは今後まだまだ注目すべきものだと思います。
モバイル端末の性能が上がったとはいえ中には、画面が小さく、通信が遅いものも多くあります。
そういったものであっても、より速く、ユーザーが求めている情報を提供する必要があります。
ユーザー目線に立ち、何を求めているのかを理解し提供する「コンテンツファースト」を進めていく必要があります。
「コンテンツファースト」を考えることで、「モバイルファースト」となり
「コンテンツファースト」とは、誰に何を見せたいのか、どう伝えたいのか、どのようなコミュニケーションをしたいのか、を考えることにあると思います。
と、ここまで真面目に書いておいて。
なぜこんなこと考えたかといいますと・・・・
らくちんHP製作では、テンプレートデザインを用意しており
そのレスポンシブデザイン化を進めています。
で、だ。
当初「モバイルファースト」の考え方から
モバイルありきで構築しておりましたが、メディアクエリ非対応のブラウザでも
使えるようにするというRespond.jsとか、IE8以下のブラウザにもHTML5のタグを認識させることができて、IE8以下でもHTML5で記述することができるhtml5shiv.jsとか、css3-mediaqueries.jsとか使ってやってましたが
やっぱり崩れる箇所が出てくる・・・・。(:_;)
くそー。IE7、8死ねb（以下略)
などとやっていて、ふと気づいたのでした。
モバイルファーストやめたらいいんでは？
語弊のある言い方かもしれませんが。
当初やってたのは、まずモバイルの一番小さいものを想定して構築。その後、タブレット用、PC用をメディアクエリで指定していましたが、これをまず、デフォルトのCSSをPC用に普通に作る。でその後メディアクエリでスマホ、タブレット用に設計するにしたらいいんでは・・・。
これだとIE9以下は必ずPCのみなので大丈夫。
あとはメディアクエリをちゃんと理解してくれるスマホ、タブレットで表示するので崩れないのでは!?
と、ほぼできてから気づいて現在やり直し中。
んもぅ。
ただ、やはり思うのはどのモバイルまで対応させるか
どのブラウザを対象範囲に含めるのか。
メディアクエリの分岐点をどこに設けるかが要となるのかなーと思います。
心ではIEなんて滅b・・・と思っていてもお客様の環境ではまだまだIE7も8も健在。
切り捨てることができないので頭の切り替えが必要なのでした。
