CSS の reverse 系の値とは、flex-direction
の row-reverse
や column-reverse
などのことです。これらの値は、アクセシビリティの観点からできる限り使用を避けるべきです。
flex-direction
の row-reverse
や column-reverse
を使うと、視覚上の表示と DOM 上の順序が一致しなくなります。
そのため、タブキーを使ってフォーカスを移動した際に、視覚上の表示とフォーカスの移動が一致しなくなります。フォーカス順序が視覚上の順序と異なると、ユーザーが困惑する原因となります。
また、スクリーンリーダー等の支援技術を使用するユーザーにとっても同様です。視覚上の表示と読み上げ順序が一致しない場合、晴眼者と異なる認識をしてしまい、会話に支障をきたすことがあります。(例えば、「一番左のボタンを押してください」という会話がなされている場合」など)。