レスポンシブウェブデザイン

副業

【在宅ワーク・副業したい初心者向け】レスポンシブウェブデザインとは?

2019年2月10日

レスポンシブウェブデザインという言葉をご存知でしょうか?

レスポンシブウェブデザインとは...

現在、ウェブサイトを閲覧するとき、PCだけではなくそれよりも画面サイズの小さいスマホやタブレットを使うモバイルユーザーが増えています。

そのような状況の中、どんなデバイスにも使いやすく見やすいウェブサイトにするために必要な技術として生まれた言葉です。

仕組み

1つのHTMLでCSSはデバイスごとに用意して表示を変えさせます。

サイトの内容は全て同じですが見せ方が異なります。

この時、CSSで表示幅や文字の大きさ、レイアウト、ボタンの位置などををコントロールすることになります。

レスポンシブウェブデザイン仕組み

メリット

サイトの保守(管理)が楽

PC用のサイトとモバイル用でHTMLは1つなので修正が発生したとしても作業は1つのファイルだけで済みます。

検索エンジンで上位に表示されるために有効

モバイルフレンドリーやモバイルファーストインデックス対策になる。

モバイルフレンドリー:スマホでも見やすく、使いやすく、早いことを測るアルゴリズムでこれが低いと順位が下がる。

モバイルファーストインデックス:PCよりもスマホなどのモバイルを主軸にSEO評価を測るアルゴリズムで、これからはモバイルサイトもしっかり作らないと順位が下がる。

デメリット

各々のデバイスに合わせてCSSを作成するためテストなどに工数がかかる。

当サイトもレスポンシブウェブデザインを採用し制作しています。

今回は、Googleも推奨しているレスポンシブウェブデザインとはどういうものかを理解していただければいいかと思います。

次回はそのレスポンシブウェブデザインの書き方などを紹介したいと思います。

  • この記事を書いた人
  • 最新記事

マー坊!

元会社員(SE)で現在WEB系フリーランスのマー坊です!✨ 会社員のころは、とにかく働くばかりで毎日がつまらなかった... フリーランスとなり割と心にも余裕ができたことで「働く」だけでは、人生がもったいない!と気づきました。 また、小さな日常にも楽しいことはあるんだなと思ったんです。 そこでこの記事では、「日常や趣味も楽しみながら働く」ことをコンセプトとし、主に以下のことについて書いています。 ✔︎会社員の悩み ✔︎プログラミング ✔︎趣味を楽しんだり... ✔︎日常気になった出来事など

-副業

© 2020 楽するわーく