Responsive Grid Systemの仕様が変更となり、僕のレスポンシブデザインの作り方もちょっと変わりそうなので共有
上記エントリー自体はGrid Systemに絡む話ですが、
内容そのものはレスポンシブデザインの組み方全般へのアプローチとなってますね。
ざっくり言ってしまうと、
PC/tablet横/tablet縦/phone横/phone縦
という5パターンで考えていたサイト構築を
PC,tablet横/tablet縦,phone
の2パターンで作ろうぜ！という考え方です。
これは素晴らしい！
目から鱗とはまさにこの事。
3パターンくらいに抑えようとは考えていましたがどこで区切るべきか悩んでいたのですよねー
タブレットの縦横を区切り目にするのは確かにサイズ的にグッドチョイス。
早速新規案件でこのアイデアを実装してみたのですがここで1つ問題が発生。
テスト機に使用していたGALAXYtabのブラウザサイズ縦の横幅設定がiPadより大きな800pxダッタノデス
レスポンシブといえばメディアクエリーなわけですが、こいつはpx指定で振り分ける仕様なので上記エントリーに沿った指定では縦横どちらも縦レイアウトになってしまう…！
今回は振り分け指定をmin-width:801pxに指定することで回避しましたが、
今後タブレットの解像度はドンドン上がるのは明白。
となると、そのたびにソースの改修が必要になるメディアクエリー振り分けは…うーん
