Webサイトをスマホ対応させる4つの方法

Web

2021.06.10

スマホ対応させる方法とは

2021年3月より徐々にGoogleがMFI(モバイルファーストインデックス)に移行していることにより、SEO対策の観点からスマホ対応はもはや必須と言ってよい状況にあります。これはユーザーの検索行動がP Cからスマホに移行してきたのが背景にあり、SEOひいてはユーザビリティにおいても、Webサイトのスマホ対応は大きな軸となっています。
今回はこれから制作するWebサイトや過去に制作したWebサイトをスマホ対応させる方法をご紹介します。

現在、GoogleにおいてWebサイトのスマホ対応は大きな基準となっているため、コンテンツの一部のみスマホ対応に変えるという中途半端な対応は評価がされづらい傾向にあります。コーポーレートサイトやECサイトのスマホ対応の遅れは顧客獲得の減少に大きな影響を及ぼしかねません。

PCとスマホのデバイスとしての大きな違いは画面のサイズにあり、Webサイトはこれに対応するように制作したり、ユーザーエージェントを判別し切り替えたりすることでスマホ対応が成り立ちます。主にWebサイトのスマホ対応には4種類の方法が存在します。

1.スマホ用のWebサイトを一から制作する

PCのWebサイトとは別にスマホ専用のWebサイトを新たに制作する方法です。更新作業をする場合はPCとスマホの両方を更新する必要があるので二度手間となります。更新スピードが早いサイトやコンテンツ量が多いサイトには向かない方法です。

2.自動変換ツールを使う

「Mobify」などの自動変換ツールを使い、スマホ対応させる方法です。
HTMLやCSSの知識が無くてもWebサイトを変換させることが可能で、更新作業も自動で反映されるので作業効率も上がります。

一方で料金の無料のものはデザインの自由度などに制限がかかり、有償のものは運用費も合わせると通常のWebサイト制作費よりも高額になるものもあります。

また、Webサイトのコンバージョンに最適化してスマホ対応するわけではないので、CVRが伸び悩むこともあります。

なお、自動変換ツールの中には「重複したコンテンツが異なるドメインで運用される」タイプのものもあり、canonicalなどでURLの正規化を行わないとSEO的に問題が生じる場合もあるので注意しましょう。

3.レスポンシブデザインのWebサイトを制作する

画面サイズに合わせてWebサイトのデザインやレイアウトを見栄え良く表示するレスポンシブデザインを利用する方法です。

レスポンシブデザインではデバイスが異なっていたとしてもHTMLはワンソースで制作されており、ユーザーの見ている画面の幅に対応してCSSを切り替えることで、レイアウトやデザインの表示を変えます。
HTMLをデバイスごとに制作する必要がなく、更新作業もHTMLワンソースなため制作や管理にかかる手間を抑えられるのがメリットです。

デメリットとしては一つのU R Lで複数のデバイスに対応するように構成されているのでデータ量が重くなる場合もあり、サイトの表示速度を考慮しデータを軽くする工夫が必要になります。

4.スマホに対応したCMSを利用する

CMSの機能を使ってスマホに対応させる方法です。
スマホ最適化させるプラグインやフォーマットを選ぶことで、コーディング作業を行わずともスマホ対応したWebサイトを制作できます。

まとめ

Webサイトをスマホ対応させる方法は上記で紹介した4種類以外にも、アダプティブデザインのWebサイトを制作するなど手法は様々です。

中でもレスポンシブデザインはGoogleから推奨されていることもあり、採用しているWebサイトは多く見受けられます。一つのU R Lでマルチデバイスに対応したWebサイトは、拡散や共有がしやすいという点でS E O対策においては有利と言えるかもしれません。
しかし、推奨はされていても優遇されているわけではないので、モバイルフレンドリーに対応しつつ制作や管理にかけるコストとリソースを考慮し、どのようにスマホ対応させるのが良いかを検討しましょう。

弊社でもスマホ対応したWebサイト制作について承りますのでお気軽にご相談ください

お気軽にお問い合わせください。

CONTACT