レスポンシブ・ウェブ・デザインとその設計を語る時にdisplay: noneが引き合いに出されることが多いなと感じる。その多用は設計ミスというような具合だ。そういうところは確かになくはないが、多用自体はCSSの貧弱さからくるHTMLの複雑さを意味するだけなのではないかと思う。
レスポンシブ・ウェブ・デザインはコンテンツを様々なデバイスで「収まる」ようにレイアウトを調整することではない。実装としてはそうなることは多いが、実際には多様なデバイスでのコンテンツの一貫性を確保するアプローチであると考えた方が適切なはずだ。その一貫性とはほぼコンテンツへのアクセス性と言って良い。様々な画面でそれを同じように確保するためには、レイアウトの調整だけではなく、構成部品の間引きや移動などが必要となる。
そういった一貫性の確保を同じHTMLを通して行う、とすると実装はほぼCSSに限られることになる。そして今のCSS実装には残念ながらそういったコンテンツの一貫性を保証できるような柔軟な仕組みは少ない。具体的にはFlexboxくらいで、他にはせいぜいtext-overflowプロパティーやvw単位くらいだ。つまり実装中であって利用が難しいか、限られたものにしか効力を発揮しないものだ。
そのためHTMLに様々な形でCSSで利用するためだけの要素を追加し、それらをCSSからdisplay: noneを駆使して出したり隠したりするような実装にせざるを得ない。その多用はウェブサイトの設計の問題というよりも、CSSの策定・実装状況があまり芳しくないことを示すに過ぎないということだろう。
フロントエンド界隈では、display: noneであるとか設定の書きづらさといった局所的な視点のみでウェブサイトの設計やツールの思想のような全体的な点を評価する傾向が強い。世界の移り変わりが早く、エバンジェリストによるメリットの拡散は誤解やデメリットに目をつぶったまま行われる。それに影響されたユーザーは実装方や利用方などの局所的な視点で評価してしまう。
あまりうまく回っていない。