前回の記事「マルチデバイス時代に合わせた Google検索や広告出稿に最適なランディングページとは?」ではGoogleの広告運用の変更やGoogleが推奨するサイト構築方法について解説いたしました。
今回はGoogleが一番推奨するレスポンシブwebデザインを使ってどのようにランディングページを構築していけばよいかを解説していきます。
レスポンシブwebサイトでランディングページを構築する場合、ただ単にPCサイト用のコンテンツをスマートデバイスに縮小するだけでは意味がありません。
これまでのPCサイトでの構築の考え方を変える必要があります。ランディングページに限らずレスポンシブwebサイトを構築する上で非常に重要なのがワイヤーフレーム(サイトの骨組み)の構築になります。
それぞれのデバイスでどのような表示をさせるのかを構築する前に決めてしまえば、あとはコンテンツの配置に従い当て込んで行けばよいので非常にスムーズに構築ができます。
ポイントは各デバイスで共通したコンテンツを使うという事になります。
前述したように、Googleは1ソース1URLでのサイト構築/運用を推奨しています。テキストももちろんですが画像(バナー素材)でもPCを中心に考えて作るとPCではうまく表示できるもののスマホでは画面が小さいが為にまったく読めない文字になる可能性もあります。
よってレスポンシブwebサイト構築を考える上で『スマートデバイスから考える』という事が大きなポイントになります。
サイト上にあるランディングページを見ていると、『PCサイトをスマホで最適化されている風にする』という方法をよく見かけますが、これは論外です。既にエンドユーザーのスマホサイトに対する目が肥えてきている中でしっかりと最適化されていないECサイトは確実にCVRが下がります。
どのデバイスでもきっちりと情報が閲覧でき、ユーザーが目的としている情報をにたどり着けるように最適化しなければなりません。
前述したようにレスポンシブwebサイトでは共通のコンテンツを表示させることが原則としてあります。
しかしCVRを上げる為にどうしてもデバイスに合わせたデザインをしたい!という声も実際多く頂きます。弊社aishipRではそのようなお客様のご要望にもお答えできるよう、デバイス毎に表示させるコンテンツをクリック1つで切り替えることができます。
上記のようにスマートフォン専用のヘッダーやスマートフォン専用のメイン画像を用意し、管理画面にて簡単にデバイス毎の表示が切り替え可能になっています。
レスポンシブwebサイトというととても小難しく考えてしまいますが、その必要はありません。まずはレスポンシブwebサイトとは何なのかをしっかりと理解し、実際にサイトオーナー側がスマートデバイスやPCなど様々なデバイスで買い物をする際のUX(ユーザーエクスペリエンス)を各デバイスに反映させていけばよいのです。
これはランディングページを考える上でも同じです。
これまでもEC事業者様の多くはPCサイトではランディングページ等取り組んでこられたと思います。そのリソースを今後はスマートデバイスを中心にシフトしPCサイトでも閲覧できるコンテンツに考え直しレスポンシブwebサイトで構築していく必要があります。
岡村