CSSの進化がすごすぎる！新しいレスポンシブデザインの実装方法を解説

現在のレスポンシブデザインは、ビューポートにもとづいてレイアウトを最適化しています。しかし、新しいレスポンシブデザインでは、アニメーションが不要なユーザーには動きを少なくしたり（無くしたり）、親コンテナの幅にもとづいてコンポーネントを最適化したり、スコープ付きスタイルやフォームファクターなど、ユーザーの好みや環境に合わせて最適なコンテンツを提供できるようになります。 これらの新しいレスポンシブデザインのコンセプト・実装方法を紹介します。CSSがこれまで以上に進化します。 The new responsive: Web design in a component-driven world by Una Kravets 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 レスポンシブデザインの現状 ユーザーでレスポンシブ コンテナでレス

[coliss]

これらの新しいレスポンシブデザインのコンセプト・実装方法。

[nishi_n]

“10年前の2010年頃にスマホやレスポンシブデザイン、そしてCSS3が登場しました。” 10年経つのが早い

[mochinaga]

一般的になったら教えて下さい

[ttkazuma]

もうclassの接頭辞に"ai-"とか付けたら勝手に良い感じにしてくれないかな

[ejointjp]

本来のハイパーテキストマークアップランゲージの役割と、きょうびのコンポーネントベースのReact的なアプリ的なものの目的が乖離し過ぎてきた感が否めない

[k3akinori]

ダークテーマは数年以内に下火になると思うよ。暗くて個性もなく視認性の悪いデザインが長生きするわけがない。そもそもレスポンシブデザインとは無関係じゃん。

[ultimatebreak]

なおブラウザ

[y-kawaz]

flexも碌に理解して無いのにどんどん進む。

[PerolineLuv]

デザインカンプに対するピクセルパーフェクト実装を求める現場では使えない。スマホとPCの2種類のカンプしか無い場合も多いし、下手すりゃいまだにPCファーストだったりする。泣ける。

[shion214]

Ffi guy

[btora]

後で読む

[spark7]

二画面対応ってのはすげえな。レスポンシブはやってて面白いから好きな作業

[mayumayu_nimolove]

tailwindでいいかな

[nora-inuo]

“CSSの大きな変革はだいたい10年周期で発生しています。10年前の2010年頃にスマホやレスポンシブデザイン、そしてCSS3が登場しました。”

[gomaberry]

すごい～

[aroechan]

#普及したら読む / 環境依存性の高いものはこうならざるを得ないよ

[oh_yeah_kimio]

レスポンシブかはわからんけどダークテーマ実装はもっと一般的になってほひい

[lbtmplz]

嫌すぎる

[aktkro]

実用性を感じなかった。そもそもメディアクエリにどういう問題点があるも考えていて、それをどう解消する実装方法なのかがわからない。

[cartman0]

グリッドの次はコンテナデザインになるのかしら

[murlock]

コンテナクエリはずっと待ち望んでた機能

[youichirou]

「ハイパーテキストドキュメント」って何だったっけ…ってなる。

[Shinwiki]

ある程度思いつきを整理してから発表してくれねえかな

[blueboy]

　レスポンシブデザインって、たいていがクソなんだよ。両方を別々にすればいいのに、一つで間に合わせようとするから、ひずみが来る。政府のデジタル庁のデザインが、失敗の見本だ。表示が狂う。　https://bit.ly/3tNq7fv

[yarumato]

“CSSの大きな変革はだいたい10年周期で発生しています。10年前の2010年頃にスマホやレスポンシブデザイン、そしてCSS3が登場しました。”

[Akkiesoft]

すっげ

[gossipgadget]

お