パフォーマンス向上のためのデザイン設計

2016年11月7日 著

積んだまま放置してしまっていた本の中から、とある事情により『パフォーマンス向上のためのデザイン設計』を読了。基本的にはよくまとまっていると思いつつも、紙の性か翻訳にかかる時差ゆえか、一部にすごく古臭い記述が目立つし（ブラウザー周りで特に）、picture要素なりsrcset属性といった「比較的」新し目の話はあっさりした印象があります。残念感が最高潮を迎えたのはp.49〜50あたりで、いわゆる画像置換の手法を紹介していたこと。

text-indentを使用して、ページの表示エリア外にh1のテキストを移動し、background-imageがh1のエリアに表示されるようにします。テキストをスクリーンリーダーで読み上げ可能な状態を維持したままで、ページの表示エリア外に移動させる方法は多数存在します。

......って言われても、その多くではCSS有効かつ画像非表示なシナリオにおいてアクセシビリティ上の問題を引き起こすはずであり、スクリーンリーダーで読み上げ可能な状態を維持すればOKなわけないのですが。アイコンフォントのくだりでは、Bulletproof Accessible Icon Fonts | Filament Group, Inc., Boston, MAを引き合いに出してしっかり注意喚起されていただけに、片手落ちというかなんというか。そもそも上で引用した下りの後に続く

このtext-indent: 100%を使用する方式は、iPadの第1世代上で要素に多くのアニメーションを適用する際、パフォーマンスを大幅に向上させることがあります。

は正直だいぶずっこけますねぇ......iPadの第1世代なら、僕の部屋にも1枚、文鎮化もとい初期化した状態で転がってますけど、いまどき余程の物好きでもなければ使ってないのではないですか？　何せiOSのアップデート対象から外れて久しいデバイスですから。今年の6月に発売された本の内容にしては、だいぶつらみがあります。

個人的に最も面白かったのは、8章の「組織の風土を変えていく」でしょうか。視覚化しにくいからこそ見過ごされがちな品質、という点でWebページの表示パフォーマンスはアクセシビリティと共通しており、その重要性をいかにして組織に根付かせるかという課題もまた共通しているので、参考になりました。