Latest
Web Topics
/
Safari 27.3 betaの「適応型ダークモード」で、ダークモード未対応のサイトが受ける影響と対策
Safari 27.3 betaの「適応型ダークモード」は、ダークモード未対応のサイトを自動で暗くします。実際のサイトでの見え方、変換の仕組み、color-schemeの正しい宣言、起きうる問題をまとめます。
タブ、アコーディオン、モーダル、カード、スイッチなど、Webサイトでよく使うUI部品の実装例をまとめました。HTMLの標準の機能を活かし、JavaScriptを最小限にした作り方を紹介します。
代替テキスト、見出しのマークアップ、色の扱い、動きを減らす設定など、Webアクセシビリティに配慮したHTMLとCSSの書き方をまとめました。実装後の確認の方法も紹介します。
個別の変形プロパティ、色の関数、subgrid、calc(infinity)など、新しいCSSの機能の使い方をまとめました。古い書き方からの置き換えや、実務での使いどころを紹介します。
ブレイクポイントの決め方、コンテナクエリ、FlexboxとCSS Gridの使い分け、余白の設計など、レスポンシブなレイアウトの組み方と考え方をまとめました。