WEBサイト上のホームページをスマホ対応させる5つの方法を解説！

4．レスポンシブデザインでスマホ対応ホームページを作る

費用：★★☆
手軽さ：★★☆
デザイン性：★★☆

タッチスクリーンの導入などパソコンとは操作方法から異なるスマートフォンですが、基本的にパソコン用ホームページのデータをそのまま使い、訪問者が利用している端末の画面サイズにのみ対応して表示幅や文字のサイズを変更することでスマートフォンに対応する方法もあります。このような技術のことをレスポンシブデザインと言います。

HTMLはPC用、スマホ用共通のものを利用し、訪問者が見る端末にあわせてスタイルシートを用意しておくことで「中身はそのまま、見た目はその端末にあっている」サイトをつくることが可能です。
HTML内に「メディア・クエリ」とよばれるものを付け加えるだけなので、HTMLを利用した基本的なWEBサイト構築が可能であれば、難しい作業ではないと思います。

5. レスポンシブ対応のツールで作る［PR］

参考：さくっと作成、らく〜に運営｜One Page(ワンページ)

費用：★★☆
手軽さ：★★★
デザイン性：★★☆

最近はスマートフォンでの表示を見越して、作ったページがそのままレスポンシブ対応になるツールが増えています。

大きな手間をかけずに、PC、スマホ、タブレットなどどんな端末でも見やすいレスポンシブデザインのホームページを作りたい方におすすめです。

既にある程度のデザインが決まった中から選ぶ形式になるため、こだわりがぎゅっとつまったデザインを自らの手で作ることは難しいものの、比較的手軽にどの端末から見ても遜色のないホームページが作れます。

ホームページをスマートフォンに対応させよう

スマートフォン用のホームページ制作にも様々な手段があり、それぞれのメリット・デメリットがあります。

スマホ利用者の増加、特に10代、20代の中にはPCを所持していない人も増えつつあることで、否応なしに迫られるホームページのスマホ対応を、どのような手段で構築するかは、それぞれの特性やご自身のニーズにあわせて決めるのがベストです。

アクセス解析などでユーザーの閲覧環境を参考にし、PC観覧9割を超える場合はPC用ホームページのみ、スマートフォンユーザーが9割を超えるようでスマホ対応ホームページのみ。といった対応も考えられますが、おおよその場合はそこまで偏らないので、早めにスマホ対応のホームページを作ってしまいましょう。

ホームページのスマホ最適化を進める

ホームページをスマホ化していないのは大問題！早急に対応するべき理由がわかる記事5選

今回は、まだスマホ対応に踏み切れない方に向けて、過去にFerretで配信した記事の中からスマホ対応の重要さがわかるものをご紹介します。

スマホサイトのデザインの参考にしよう！デザインをまとめたサービス11選

スマホ最適化を実施する前に見ておきたいスマホサイトデザイン集をご紹介します。これからスマホサイトを制作する予定の方、またはリニューアルを考えられている方はぜひ参考にしてみてください。