レスポンシブデザインとは?Webサイト(ホームページ)作成に必要なこと | 起業家向け[Webサイト作成支援]専門家| Yukari

起業家向け[Webサイト作成支援]専門家| Yukari

IT初心者やIT苦手な起業家のお困り事を解決
業界歴24年3,000人以上のサポートをしてきた実績で
自分でWebサイトを作りたい、自己管理したい方の
問い合わせが増えるサイト創りを全力でサポートします❣️

 

✨SNS嫌いのITサポーター✨

 

☆IT苦手な起業家向けWebサイト作成支援

☆業界歴24年3,000人以上の個別サポート

☆対面&オンラインレッスンで即解決/大阪豊中

☆スピリチュアル系カウンセリングで挫折なし!

プロフィールはこちら

 



 

 

Webサイトを作成しようとしている、またはサイトを作成しているあなたなら

目にしたことはあるかと思います

レスポンシブデザインってどんなデザイン?と思うこともあるかもですね

 

レスポンシブウェブデザイン (英: responsive web design、 RWD) はウェブデザインの手法のひとつで、

デスクトップ版のウェブページを閲覧者の画面サイズまたはウェブブラウザに応じて表示できるようにする。

加えて、1つのウェブサイトで多様なデバイスを同様にサポートすることも、

そのタスクに含まれる点を理解しておくことが重要である。

また、最近の取り組みでは、閲覧のコンテキストの一部として閲覧者の「近さ」

をRWDの延長部分と見なしている。ニールセン・ノーマン・グループは、

「コンテンツ、デザインそしてパフォーマンスは、すべてのデバイスでユーザビリティと

満足を確保するために必要である」と述べた

※Wikipediaより引用

 

なんのこっちゃ・・・滝汗滝汗滝汗 ですね

専門用語大好きなWikipediaではちょっとアレなので

 

 

めっちゃ簡単に説明すると

パソコンの画面サイズでも

タブレットでも、スマートフォンでも

どの機種で見てもWebサイト(ホームページ)が

見やすく綺麗に表示されるデザイン

 
 

色々なデバイス(機種の事でパソコン、タブレット、スマートフォン)で

Webサイト(ホームーページ)を見る場合に、表示する大きさを同じに

してしまうと大きすぎたり小さすぎたりしてしまいます

 

例えば、一番小さい画面のスマートフォン用にページを作ったとします

それをパソコンの大きい画面でみるとスマートフォンの画面サイズなので

とっても小さく表示されてしまいます

 

逆にパソコンで表示される丁度良い画面の大きさに設定したとします

それをスマートフォンで表示すると大きすぎて一画面に表示しきれませんね

 

少し前までは、パソコン用とスマートフォン用と両方の

画面の設定で別々にページを作る必要がありました

 

とっても面倒でしたが

 

今は自動で切り替わるようにデザインできるようになったので

両方を更新する必要がなくなりました!

 

ありがたや〜〜〜〜笑い泣き

 

ちなみに、各デバイスのサイズはこちらです

こうして数字で見てもそれぞれ大きさにかなり違いがあることがわかりますね!

  • モバイル(スマホ): 360~375 x 640~812
  • タブレット: 768 x 1024
  • ノートパソコン: 1366 x 768

※標準的なサイズですが、今後も機種が増えてきて変動がかなり

あると思われます。

 
 
 
 
 
 
IT関連のお困りごとはいつでも相談してください
大阪豊中 デジタルプラザ・パソコンスクール
キュリオステーション豊中店
06−6856−8666
公式LINEからも相談受付ます

公式ライン登録で、お得にお悩み解決できますスター

お気軽にご相談ください。

*定休日にはお応えできませんのでご了承下さいませ。