本文へ移動

§18-07Accessibility

文字サイズ調整 (A− A+)

ボタンで本文の文字サイズを拡大・縮小する。

ブラウザ設定を変えられない利用者でも、読みやすい大きさに調整できる。高齢者や視力の弱い人が多い読み物中心のサイトに向く。

実装のポイント

ルートの font-size を変え、本文を rem で組んでおくと全体が比例して拡大する。選んだ倍率は localStorage に保存し、初回描画前に適用してちらつきを防ぐ。

このデモはフォント / 文字サイズ調整と共通です。

特徴
  • アクセシビリティ
  • 状態管理
デモで使っているもの
  • lucide-react