web制作をする上でレスポンシブ対応って耳にした事があると思います。
では、レスポンシブ対応って何なのか？
また、レスポンシブ対応にする為には何をしないといけないのかを下記の順にまとめていきます。
- レスポンシブ対応とは？
- レスポンシブ対応にする為には？
- 簡単なレスポンシブ対応とは？
レスポンシブ対応とは
では、レスポンシブ対応とは何かと言うと、パソコンやタブレットやスマートフォンなど画面サイズに合わせて適したwebデザインに変更する仕組みになります。
例えば、webサイトをパソコンから見ている際はパソコンに適したwebデザインに変更し、スマートフォンから見ている際はスマートフォンに適したwebデザインになります。
このサイトもレスポンシブ対応にしており、書いている文章にかわりはありませんが、パソコンとスマートフォンでは見え方に違いが出てます。
webサイトのレスポンシブ化⁉︎
それではwebサイトをレスポンシブ対応にする為には、どうしたらいいか見ていきましょう。
基本としては大きく2つになります。
- パソコン用とスマートフォン用のwebサイトを作る
- css（スタイルシート）でデザインする
の2つになり、早速やり方を説明します。
パソコン用とスマートフォン用のサイトを作る
一昔前までは主流だった方法になります。
記載内容は同じですが、URLを2つ準備しサイトをパソコン用とスマートフォン用に分ける方法です。
例）パソコン用 http://＊＊＊.com/pc
スマホ用 http://＊＊＊.com/mobile
cssでデザインする
よく多いのが、同じURLでcssでデザインを変更するやり方になります。Wikipediaで検索すると、
Cascading Style Sheetsは、HTML や XML の要素をどのように修飾するかを指示する仕様の一つで、World Wide Web Consortium がとりまとめ勧告する。文書の構造と体裁を分離させるという理念を実現するために提唱されたスタイルシートの具体的な仕様の一つ。
と、難しく書かれてますが、シンプルに言うと、パソコン用とスマートフォン用で文字のサイズを変えたりなど、見てくれている画面サイズによって変化させる事が出来ます。
簡単にレスポンシブ対応するには
ここまで読んでいただきましたが、どの内容も今の時代で考えたら、面倒な作業になります。
おすすめとしては、web制作にて『WordPress』を使い、レスポンシブに対応したテーマを利用することです。
テーマ次第では設定が不要で利用が出来たり、または簡単な設定で利用が出来ます。
まとめ
今の時代であれば、レスポンシブ対応したwebを制作するのであれば、WordPressを利用するのが1番になります。
設定も不要で、慣れてくれば自分好みのデザインへ微調整なども出来るようになってきます。
コメント