「レスポンシブWEBデザインについて」という記事について
゜・*:.。.(((☆´’艸’)【謹】【賀】【新】【年】(‘艸’｀☆))).。.:*・゜
既に遅いですが、明けましておめでとう御座います。
卒業してからダラダラずるずるして、休憩しすぎではないのかと不安ですw
結構内定も選んで蹴り飛ばしてしまったので、今月真剣に良いところが見つかることを願うばかりです(★´∀｀)b
久々に鍵垢でも見てみたら、こんな記事が。
レスポンシブWEBデザインについて | Creator Clip
PC・タブレット・スマホの解像度とか何となくの記憶で作ってました。
まぁご丁寧に全部の推奨解像度書かれてます。
通常のandroid解像度は620で大丈夫なはずです。
でもiPhone持ってないので分からないけど、これでも大丈夫なはず…
というか、apple社製品の使い勝手、めんどうくさいから、消えればいいと思ってます♡
ディレクションのコードしか打たない奴とか、通常の事務の癖にブランドだけでapple使ってるの丸出しでダサすぎ。
デザインならしぶしぶしょうがないと思いながら一生使う気はないですがww
話がそれましたが、さささささっと見た感じ丁寧に書かれていて、正式名所をすぐ忘れる私もこの手法を使いながら、全部同じような感じで使っていました。
レスポンシブWEBデザインを作成するには以下の3パターンがあります。フルードグリッド（Fluid Grid）フルードイメージ（Fluid Image）メディアクエリー（Media Query）
フルードグリッド（Fluid Grid）
フルードグリッドとは、Webページの要素を罫線や升目に沿って配置する「グリッドデザイン（Grid Design）」と、ブラウザーの横幅が変わってもレイアウトを維持したまま要素のサイズを調整する 「フルードデザイン（Fluid Design）」を合わせたものです。
今までのレイアウトは幅を固定したレイアウトでした。レスポンシブWebデザインでは、最初にグリッドデザインで部品や表示領域をpxで配置していき、レイアウトが整った後に、値を％に変換してフルードデザインに変更します 。
フルードイメージ（Fluid Image）
フルードイメージとは、ウィンドウや画面サイズに追随して画像のサイズを拡大・縮小する手法です。
メディアクエリー（Media Query）
メディアクエリーとは、画像の解像度・ウィンドウサイズ、スマホ・タブレットなどの画面向きなどの指定条件にあわせて読み込むCSSを変更する技術です。レスポンシブWEBデザインではメディアクエリーを使ってスクリーンサイズに応じたCSSに切り替えます。
主にメディアクエリーを使って、画像はフルードグリッド使用してました。
Mobile対応ならガチガチにメディアクエリー使用が良いと思うのですが、画像をたくさん作らないといけないから、でかい企業での制作くらいでいいんじゃないかなーって。（ゆとり発言
リセットについては、Normalize.cssも入れておくといいかもです。
[CSS]CSSリセットとは異なる、Normalize.cssの特徴や使い方などの解説 -About normalize.css | コリス
IE8は未対応なので、切り捨てられるなら別にかまわないと思いますが…
対処法：レスポンシブWebデザインをIE8に対応させる方法 | スマートフォン＆モバイルEC事例ノウハウ集｜モバイルファーストラボ
