とうとう、スマートフォンの利用率がパソコンの利用率を超えたって知ってた？
これが何を表すのかというと、モバイルファーストへの対応が必須になったってことだよね。
いやね、前から「モバイルファースト」が大切だ！と言われてたのは分かってたのよ。
でも、「なんだかんだ言ってパソコン層の方が多いでしょ？」なんて思ってたら、そんなことはなかった。
Googleはさんざんスマートフォンに適応したサイトを作れと言ってきたが、とうとうそれがデータとして裏付けされることになったのだ！（というか自分が知らなっただけ）
目次
データから見るスマートフォンの利用率
パソコン・スマートフォンなどの情報機器 情報機器の利用率（2016年2月調査結果）クリックで拡大化されます
日本リサーチセンターが行ったパソコン・スマートフォンなどの情報機器の利用率の調査によると、スマートフォンの利用率が57%、パソコンの利用率が49%と、スマートフォンの利用率がパソコンの利用率を上回る結果になった。
サイトの中にはまだまだパソコンにしか対応してないサイトもあるね。
もしくは、スマートフォンには対応してるけど、表示がずれていたり、見にくいデザインのものがたくさんある
つまりいつまで小さい市場に向けたサイトを作り続けるの？ってことになるんだ
モバイルファーストのおさらい
モバイルファーストは英語で書くとmobile first となる。
つまり、携帯（今の時代はスマホかな）を最優先にサイトを作りなさいということだね。
今、多くのウェブサイトはパソコンではなくスマホで見られている。
では、なぜスマホとパソコンを違うモノとしてサイトを作らないといけないんだろか？
答えは簡単なんだ。
スマホの画面は必然的にパソコンよりも小さいものとなるし、スマホはパソコンと比べて縦に長いよね
つまり、パソコンだと記事を左から右へ読むけど、スマホは縦から下に読むんだ
こうなると大切になるのは、一行に対する文字数であったり、文字サイズであったりと縦に記事を読む際に疲れない工夫なんだ。
このブログで対策してること
モバイルファーストというとデザインに目が行きがちだけど、モバイルに対応したコンテンツ作成も重要なんだよ。
個人的にはこれをコンテンツファーストと呼んでるんだ。
簡単に自分がこのブログの記事内においてコンテンツファーストを意識してる点の一部を挙げてみるよ。
サイトを作る時の参考にしてね。
①文字サイズは16pxで設定
⇒一般的にこれは大きめ文字サイズになるんだ。ニュースサイトとかでは12pxとか14pxが多いね。
このブログはあらかじめ1記事最低3000文字かつ、ページ移動をさせないって決めてたから、読んでで疲れにくい文字サイズにしてるよ。
②「。」で改行することを意識し、1段落3～4行でまとめる
⇒パソコンで読むと6行くらいの段落でも違和感なく読めるんだけど、スマホだと1列に表示される文字数が少ないんだ。そうなるとパソコンよりも多く、文字が縦に並ぶことになっちゃうんだよね。
長い文章って読みたくないよね？
だからスマホで読んだときに疲れないように、三段落で一まとまりにするか、文字に色をつけるようにしてるよ。
③h2一つに対して画像を一枚使う
⇒これも①で書いた読んでて疲れない工夫の一つだね。
文字ばっかりだと読んでて疲れるし、堅苦しい印象を受けるよね。
だからちょくちょく画像を差し込んでるよ。そして画像の多くは男性は使わず、女性を多く使うようにしるんだ。
これはサイト利用者のペルソナを、20代から30代の新米男性Webマーケッターと想定しているからなんだ。
ただ、心理学の記事に関しては女性をターゲットにしている記事が多いので、一部の記事を除いて女性ウケのする画像を設定してるよ。
パソコンだと普通に読めても、スマホで読んだとたん
「うわ、文字多いな！」
となることは多いんだ。
つまり、サイトデザインをスマホとパソコンの両方に対応させたうえで、中身のコンテンツもスマホに対応させた作りにしないといけないんだよね。
サイト運営している人だと、正直言って「スマホでの表示確認はめんどくさいからやってない」って人も多いんじゃないかな？
かくいう自分がそうだったんだよね。
実際、そこまでスマホとパソコンでそんな差ないだろ～と思ってたんだけど、改めてスマホから自分のサイトを見ると「見づら！！」となったよ。
これに早い段階で気づけて良かったよ。
現状、30記事も更新してないから、1日1記事編集したとしても一か月で終わるからね。
これが数百記事更新している”オウンドメディア”だった場合、気が遠くなるね。
レスポンシブデザインとは
ブログやサイトを作った経験がある人なら「レスポンシブデザイン」ってワードを聞いたことあると思う。
これは何なのかというと、パソコンでの閲覧を目的に作られたサイトを、自動でスマートフォンに最適化させるデザインというものなんだ。
ここで大事なのが自動って点だね。
これを導入することで、パソコンでのサイトの見え方を変えるだけで自動でスマホ上のデザインも変更されます。
つまり、パソコン用とスマホ用の二つのデザインを作る必要がないんだ！
はっきり言って現在、スマホの読者に対しパソコンと全く同じ画面を表示させるサイトはあり得ないです。
SEO的にも超マイナス効果ですし、読者からしても読みにくいったらありゃしません。
モバイルファーストじゃないサイトは、長い間更新されてないサイトか、担当者が全くWebの知識がないかのどちらかでしょう。
それほどモバイルファーストというのは実施していて当然です。
あなたのサイトは大丈夫？
パソコンだといくら疑似スマホ画面を出すと言っても画面全体の余白が多く見えてしまいます。
そうなると正常な判断が下せない場合があるので、可能なら自分のスマホを使用し表示確認をすることをお勧めします
まとめ
