どうもこんにちは、佐谷です。
ゴールデンウィークが終わってしまいましたね。
みなさんはどこかにお出かけになられましたでしょうか。
私は鎌倉の方に旅行に行ってきました！
江ノ電が情緒に溢れ素晴らしく、電車に興味がない私でも気がつけば撮り鉄のようにカメラのシャッターを切っていました。
さて、ゴールデンウィーク明けの一発目の更新は“Googleが勧めるスマートフォンサイトの最適化”についてです。
4月21日にGoogleによって宣言された「モバイルフレンドリー」によりスマホサイトの制作が急務となっているという事実は先日のブログの通りでございます。
4月21日以降に何が変わるのか〜モバイルフレンドリーとは何か〜
目次／このページでわかること
レスポンシブ対応のウェブサイトとは
今回のテーマはウェブサイトを制作する時に必須となった”スマートフォン対応”についてのお話です。
PCサイトをスマホに対応させるためには、主に２つの方法があります。
①別でスマホサイトを作る
http://◯◯◯.co.jp/
http://◯◯◯.co.jp/sp/
上記のように別のURLでスマホサイトを作ることです。
この場合、スマホで見た時はhttp://◯◯◯.co.jp/sp/にリンクするように設定（リダイレクト設定）しておく必要があります。
②レスポンシブ対応でサイトを作る
同一のURLでサイトを作り、ユーザーの使うデバイスによって見せ方を変えるという手法です。
リダイレクト設定をする必要がないので、ページが重複してしまうことも回避できます。
存在しているPCサイトをスマホ化する場合は①の手法では難しい場合が多いです。
なぜなら、すでにレイアウトが決まっているもので、スマホで再現することが困難な場合があるからです。
ですが、新規でサイトを制作する場合は、弊社では基本的に②のレスポンシブ対応を推奨しています。
メリットとしては以下のことがあります。
URL、HTMLが１つで済むのでSEO（検索エンジンの最適化）に有利
- PC 用のページとモバイル用のページを単一の（同一の） URL とすることができるため、（中略）Google のアルゴリズムにとってはコンテンツを適切にインデックスできるようになります。
- ユーザーエージェントの異なる Googlebot ごとにページをクロールする必要がないため Google がより効率的にコンテンツを発見することができます。
参照：Google ウェブマスター向け公式ブログ: Google がお勧めするスマートフォンに最適化されたウェブサイトの構築方法
１つのHTMLを編集すればいいので、更新が容易で早い
これは制作側の都合のように思われますが、何か更新したい情報があった場合や、追加するコンテンツがあった場合には更新作業が早くなるのでクライアント側にもメリットがあります。
また、SEOの対策も１つのサイトの対応で済むので、ミスも少ないです。
弊社のレスポンシブ対応サイト最新事例について
弊社では先日レスポンシブ対応のサイトを公開しました。
ページ数は100ページほどの大規模なサイトですが、これらをPCサイトとスマホサイトと分けて分けて制作することは難しいので、レスポンシブ対応を採用しました。
PCで見た場合
スマホで見た場合
前述の通り、このような大規模なサイトや更新の頻度が高いサイトにとっては、レスポンシブ対応は大きなメリットになります。
また、SNSなどで情報の拡散を行う場合にもユーザーの環境に左右されることはありません。
例）PCでいいね！ボタンを押す → それをスマホで見た人にPC用のページが表示されて離脱
まだ公開から2週間あまりしか経っていませんが、実際にスマホユーザーの動向ではほとんどの事項において改善の傾向にあります。
特にページの平均セッション時間（滞在時間）と直帰率が改善していることから、スマホユーザーの離脱が減り、ページを見る時間が増えていることがわかります。
まとめ
今後のウェブサイトの制作においてスマートフォンに最適化させることは必須だと思います。
そこで一番良い方法が“レスポンシブ対応”のウェブサイトを作ることです。
さらにWordPressなどのCMSで構築をすれば、よりカスタマイズ性が高く、Googleにも好かれやすいサイトを作ることができます。
レスポンシブ対応には、
・通常よりも初期構築に費用がかかる
・スマホでの表示速度が遅くなる可能性がある
というデメリットもありますが、それを上回るだけのメリットがある手法だと思います。
Googleが推奨しているだけあって、今後のウェブサイトの1つの在り方として確立されつつあります。
ウェブサイトを制作する際は、この機会にぜひご検討されてはいかがでしょうか？
弊社でも今後さまざまなレスポンシブ対応の制作事例を紹介できるかと思いますので、またこのブログで紹介させていただきます。それでは！
