- SEO・SEM
- 2020.03.01
リニューアルせずにレスポンシブデザインに対応
現在、ホームページを新規で作成、あるいはリニューアルを行う際に、多くの会社さまがスマートフォン対応を希望されるため、レスポンシブデザインでのwebサイト制作を行う機会が非常に多くなりました。
また、スマートフォン対応の案件として、新規ウェブサイト作成やリニューアルだけではなく、現状スマートフォン対応を意識してウェブサイトを制作していないが、リニューアルを行わずに、可能な限りレスポンシブ対応を行いたいというご相談もよくいただきます。
リニューアルを行わずにスマートフォン対応を希望される会社さまの多くが、「グーグルがスマートフォン対応を行っているwebサイトをスマートフォン検索時に優遇する」と言っているため、SEO効果の向上を期待してのご依頼になります。
もちろん、SEOやホームページの成果向上を考えた場合、せっかくスマートフォン対応を行うのであれば、リニューアルを行ったほうが効果的ではありますが、全面リニューアルを行うためには、多くの時間と予算が必要になるため、応急処置としてであれば、リニューアルを行わずとも十分に効果的な対策としてご利用いただくことが可能です。
そこで今回は、レスポンシブ対応を行いたいけれども、あまり予算をかけたくないとお考えの方向けに、弊社のリニューアルを行わないレスポンシブデザイン対応の考え方をご紹介します。
目次
レスポンシブデザインとは
レスポンシブデザインとは、webサイト作成の手法になります。
従来であれば、スマートフォン対応を行うためには、PCサイトの他に、スマートフォンサイトを制作しなくてはなりませんでしたが、レスポンシブデザインでwebサイトを制作することで、ブラウザの横幅を基準にページのレイアウトを自動に切り替えることができます。
そのため、1つのウェブサイトで、PCユーザにはPCサイトを、スマートフォンユーザにはスマートフォンサイトを表示させることが可能になります。
このレスポンシブデザインでは、SEOで成果が向上するや、ホームページの更新が1サイト分だけで良いなど、さまざまなメリットがあります。
レスポンシブデザインのメリット
レスポンシブデザインでホームページ作成を行うメリットをご紹介します。
ホームページの更新が効率的に
スマートフォンに対応したウェブサイトを制作するためには、従来であれば、PCサイトの他にスマートフォンサイトの制作が必要であったため、webサイトの更新がある場合は、PCサイトとスマートフォンサイトの両方を別々に更新する必要がありました。
しかし、レスポンシブデザインでウェブサイトを制作することで、PCとスマートフォンで別のレイアウトのホームページであったとしても、表示方法を変えているだけで、実際は1つのホームページになるため、例えば新着情報を追加した場合に1度の更新でPCサイトとスマートフォンサイトの更新が行えます。
そのため、更新作業が非常に効率的になり、webサイトの運営時間を大幅に短縮させることが可能になります。
重複コンテンツにならない
モバイルサイトとPCサイトを別で制作している場合、まったく同じ内容のウェブサイトを2つ制作することになるため、カノニカルタグなどを利用して、同じウェブサイトであることを検索エンジンに伝えなくては、重複コンテンツとして認識されてしまう可能性があります。
レスポンシブデザインでホームページを作成することで、1つのウェブサイトでPCで閲覧したときとスマートフォンで閲覧したときの表示を変えているだけになるため、重複コンテンツの心配がありません。
スマホ検索で優位
レスポンシブデザインやスマートフォンサイトの作成などのwebサイトのスマートフォン対応を行うことで、スマートフォンでグーグル検索を行った際の検索順位が優遇されるようになります。
なぜスマホ検索での上位表示が行えるかと言うと、レスポンシブデザインで作成されたホームページでは、スマホでアクセス時にそのホームページの操作性が非常に高いものになります。
もし、レスポンシブデザインを導入していないホームページにスマートフォンでアクセスすると、リンクがタップしづらいや文字が読みづらいなどの問題が発生します。
そのため、しっかりとレスポンシブデザインでホームページを作成しているホームページは、スマホユーザにとって非常に親切なウェブサイトであると、グーグルは認識し、スマホ検索での順位を向上させるようになっています。
ただし、現在検索上位のホームページの大半がレスポンシブデザインで作成されているホームページであるため、レスポンシブデザインでホームページを作成していない場合は、逆に順位を落としていると考えることが一般的になります。
新端末への対応が容易
レスポンシブデザインは、ブラウザの幅によってPCサイトを表示するか、スマートフォンサイトを表示するかを決定するホームページの制作手法になります。
PCサイトを表示するか、スマートフォンサイトを表示するかは、ブレイクポイントと言われる画面の切り替えの境目を設定することで切り替えを行えるようになります。
例えば、横幅が600px未満であればスマートフォンサイトを表示し、600px以上であればPCサイトを表示するなどの設定になります。
そのため、新しいスマートフォンなどの端末が発売された場合であっても、基本的には問題が発生するリスクもほぼなく、また万が一発生した場合であっても、大幅な修正をしなくとも対応することが可能です。
レスポンシブデザインのデメリット
レスポンシブデザイン導入のメリットをご紹介しましたが、ではどういったデメリットがあるのでしょうか。
端末ごとのデザイン変更ができない
レスポンシブデザインでは、PCサイトとスマホサイトで大幅なデザイン変更を行うことができません。
大まかにいうと、横並びになっている情報を立てに並び替えるなどの対策と、スマートフォン閲覧時には、PCで表示されている情報をスマートフォンの画面外に出して表示させない対策がメインになります。
そのため、PCサイトではこのレイアウトデザインで、スマホサイトではこのレイアウトデザインというように、大幅なレイアウト変更を行うことができないということを理解しておかなくてはならないのです。
モバイル中心のホームページ作成
レスポンシブデザインでは、スマートフォンを基本としたホームページ作成を行います。
従来のホームページ制作においては、PCサイトを基本として、ホームページのデザインやワイヤーフレームを作成していましたが、レスポンシブデザインにおいては、スマートフォンサイトを基本として制作してから、PCサイトの検討を実施します。
PCサイトが複雑な作りになっている場合に、スマートフォンでは表現ができないなどの問題があるため、スマートフォンを先に検討して、その後PCサイトを検討するのですが、ある程度レスポンシブデザインに慣れている方であれば、PCサイトから先に制作してもスマホサイトで実現できるかどうかの判断ができるため、スムーズな制作が可能になります。
そのため、これから初めてレスポンシブデザインを検討される方は、必ずスマートフォンサイトから検討していくようにし、その後PCサイトのことを考えていかなくてはならないのです。
ホームページが重くなることもある
レスポンシブウェブデザインでは、一般的には、PCサイトと同じテキストや画像を利用していきます。
そのため、画像を利用する際には注意を行わなくては、スマートフォンでのホームページの表示が非常に重いものになる可能性があります。
もし、ホームページに高解像度の綺麗な画像を利用していた場合、その画像がスマートフォンで表示させるためには、スムーズな表示が行えないなどの問題が発生します。
現在のグーグルは、ホームページの表示速度をスマホ検索時の順位決定の要因の一つにしているため、できる限りウェブサイトが表示される速度も意識してホームページを作成しなくてはなりません。
そのため、高解像度の画像を利用することが悪いと言うわけではありませんが、スマホでの表示も意識し、画像を利用する際には、必ず画像データを圧縮して利用しなくてはならないのです。
リニューアルせずレスポンシブデザイン対応のポイント
リニューアルを行わずに、レスポンシブデザインに対応するホームページを作成するためのポイントをご紹介します。
レスポンシブデザインが上位表示に繋がるわけではない
レスポンシブデザインを行うことで、実際にスマホ検索の順位は向上しますが、しかし、レスポンシブデザインでホームページを作成すること自体がSEOになりません。
グーグルがスマホ検索での順位を上げているのは、レスポンシブデザインで作成されたホームページがスマートフォンユーザにとって扱いやすいホームページになるからであり、レスポンシブデザインでホームページを制作することで、SEO効果が向上するということはないのです。
そのため、レスポンシブデザインに対応を行っても、確かにスマホ検索の順位は上がりますが、PC検索の順位が上がることはないため、あらかじめ基礎知識として、レスポンシブデザインに対応することで検索順位が上がることはないと認識しておく必要があります。
グーグルへの対応
スマートフォン対応を早急に行いたい会社さまの多くは、グーグルでのスマートフォン検索での順位を気にされていることかと思います。
そのため、レスポンシブデザイン対応の実施を行う前に、グーグルサーチコンソールにあるモバイルユーザビリティーの問題点を確認し、レスポンシブウェブデザインが対応できていないページのチェックを実施します。
まったくレスポンシブデザインに対応していないウェブサイトの場合は、そこにすべてのページのURLがリスト化され、少し対応を行っている場合は、対応が完了しているページは表示されません。
このチェックを行っておき、現状のウェブサイトの問題点を明確にして、レスポンシブデザイン対応を実施しなくてはならないページと項目を明確にすることで、ホームページの改善業務の効率化を図っていくようにしなくてはなりません。
レイアウトの調整
レスポンシブデザインを想定してwebサイトを制作していない場合、どうしてもレスポンシブデザインに対応することが難しい箇所も出てきてしまいます。
そういった場合は、別のHTMLファイルを用意する、あるいは既存のHTMLファイルを修正しないといけませんが、それらを行う際には、必ず修正後に確認作業を行ってレイアウト崩れが発生していないかや、また他のページに影響が出ていないかのチェックを行わなくてはなりません。
徹底した確認作業
レスポンシブデザインを導入した後、テストアップされているホームページをスマートフォンで確認を行います。
その際には、手持ちのスマートフォンだけで確認を行うのではなく、必ずアイフォンとアンドロイド系の携帯両方で確認を行うようにしなくてはなりません。
グーグルクロームをご利用の方は、グーグルクロームの開発者モードでチェック作業を行えますが、開発者モードでは正しく表示されていたとしても、実際のスマートフォンではしっかりと動作が行えないや、レイアウトが崩れているなどの問題があります。
そのため、ホームページを作成したら、必ず実機を使って細かな確認作業を実施していかなくてはなりません。
リニューアルせずともレスポンシブデザイン対応はできる
現在、すでにホームページをお持ちの方で、PCサイトの改善は行わなくてもよいが、スマートフォンサイトを作成したいと思いの方は、ぜひともPCサイトはそのままでレスポンシブデザイン対応を行われることがお薦めです。
レスポンシブデザイン対応では、あまりHTML側の作業は発生せず、CSSの改修だけでホームページをスマートフォンにも対応することができるため、リニューアルを実施する必要はないのです。
ただし、一部のホームページにおいては、HTMLをすべてとは言いませんが、ポイントポイントで、相当な数の修正を行う必要があり、特に画像テキストの箇所については注意が必要になります。
レスポンシブデザインに対応することで、スマートフォンユーザのホームページの回遊率が高まる他、グーグルのスマホ検索での上位表示にも繋がってくるため、必ず実施したほうが良いと言えます。
弊社は、大阪でホームページ作成を実施しており、リニューアルを行わずレスポンシブデザイン対応の案件も多くこなしているため、レスポンシブデザイン対応でお悩みの方はお気軽にご相談ください。
