パフォーマンスと効率を考慮した CSS の設定方法 10 項目
パフォーマンスを低下させる CSS の設定を排除して最適化することで、ページの描画速度を改善し、データサイズを小さくすることができます。 ここではパフォーマンスを低下させる CSS の設定例と、それを改善するための設定例を一覧します。 スタイルの値 数値の指定は小数点で 色の設定はできるだけ短く 継承を活用する セレクタ 基本ルール id セレクタは使わない id, class セレクタとタイプセレクタを組み合わせない 全称セレクタは使わない 制限されないセレクタは使わない 子孫セレクタを多用しない セレクタの階層を深くしない 連結したセレクタは使わない 命名規約 クラス名の単語はハイフン 省略形の名前 参考資料 スタイルの値 数値の指定は小数点で データサイズを小さくするため、0.8 などの 0 ~ 1 の値は .8 で指定します。0 はなくても小数点で解釈されます。 ただし、YUI C
スクリーンリーダーに対応するための CSS 設定
スクリーンリーダーとは盲目の方などが PC を操作するために用いるソフトウェア(プログラム)の総称です。 現在フォーカスしているテキストを音声で読み上げ、ユーザに伝えます。 スクリーンリーダーに対応するために求められる取り組みの 1 つとして、画像などに alt 属性を与えることが挙げられます。 スクリーンリーダーは、画像がどのような内容を示すかを理解して、それを音声にすることができません。 したがって、画像の代わりになるテキストが必要になる、ということです。 CSS 設定が必要な具体例 画像以外にも注意しなければならないケースがあります。前後にテキストがなければ上手く意味が伝わらないコンテンツです。 あるいは、アイコンなどの画像・フォントだけを表示しているコンテンツです。 例えば「次のページ」や「前のページ」を表現するために矢印のような画像や記号を使っているとき、 スクリーンリーダーは何
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
