楽落人の備忘録

楽して生きていきたい。知識とか覚えておきたくない。

レスポンシブ化について

webアプリの開発に多少かかわって生きてきましたが古いシステムばかりだったので最近の事情には疎い。。。

 

『レスポンシブ化』について会話に出てきて調べたことがあったのでメモ。

 

■そもそも『レスポンシブ化』とは?

インターネットの普及とスマートフォンと普及によりさまざまな端末から閲覧されるようになったwebサイト。

多様化する端末からのアクセスに対応するため、『レスポンシブ化』が必要になった。

閲覧してて少し気にはなっていたけど、スマートフォン用のページでもPCで問題なく表示できるサイトは多数ある。

それってどうやってんだろう?たぶんこれ別のページを用意しているわけじゃないよなぁ。。。と思ってたら上記を1つのページで実現することが『レスポンシブ化』だと判明。

※ちょうどいい感じの引用サイトが大体企業サイトだったので参考資料は「レスポンシブ とは」とかでグーグル先生にお尋ねになるのが早いかと。

 

■『レスポンシブ化』の実装

じゃあ自分のサイトってこんな対応したっけか?ってところで実装を確認。

キーワードは

・max-width

・min-width

つまるところ上記で表示の画面幅が xxx px 以上の場合はこっちのスタイル(CSS

xxx px 以下の場合はこっちのスタイルって適用するスタイルを変更していたみたい。

 

軽く調べただけなので、突っ込みどころは多々あるかもしれませんが大体は間違っていないはず笑

 

CSSとか意識する機会が全然なかった(デザインには興味がなかったw)のでなるほどなるほど。とおもいましたまる。

(そもそもCSSの書き方でクラス指定の時にどっとつけて書くとかも初めて知ったし。)

少しスタイルシートについて深堀するのも面白そう。

 

・・・自分の記事見てて疑問編とか後で調べようとか、解決していないのおおな。。。整理して解決せねば。。。。Zzzz。