視覚障害者向けのCSS?


17

そのため、HTMLを学習しているときにCSSに出会いました。CSSを使用すると、Webページをクールにしたり、より美しくしたりできるため、興味深いものです。しかし、色、デザイン、スタイルなどに関するものなので、CSSコードの結果を知ることはできません。視覚障害のある人として、目が見える人はいつも私よりも優れたWebページをデザインできるのに、CSSを学ぶべきなのはなぜですか?

  1. ここにCSSを書く盲目のプログラマーはいますか?どうやってやったの?
  2. CSSをすべて無視して、目が見えるプログラマーに任せるべきですか?または、CSSには、ページを見て、デザインが良いかどうかを確認するように頼まなくてもできることがありますか?

3
CSS の聴覚的な側面に興味があるかもしれません。

1
デザインにあまりこだわりがない場合は、CSSテンプレート(定義済みの配色と詳細)の使用を検討できます。たぶんあなたのためにそれらを設定することができる目の見えるデザイナーと協力することを検討してください。次に、それに基づいて自分で選択することができます。
rpeg 14年

視覚障害のあるユーザー向けにWebページを作成するかどうかによって異なります。両方の場合は、チームを組む必要があります。
ロニースカンシング14年

回答:


12

CSSは一般的なスタイリング言語であり、聴覚マークアップのプロパティも含まれています。これはいずれも主流のブラウザでは実装されていませんが、スクリーンリーダーには役立つかもしれません(ただし、聴覚のマークアップが「一般に」一般的でないことを考えると、実装するかどうかはわかりません)。

私は、見る人として、CSSを少しフィードバックループで作成し、CSSを少し変更してから、ページがどのように変化するかを観察します。このフィードバックが不可能または非常に困難である場合、設計原則にフォールバックし、それらがすべてうまくいくことを願っています。

  • ページをグリッドと考えると、割合の管理が容易になります。一般的な区分は、ナビゲーションと見出しに一番上の行を使用し、関連コンテンツに右の列を使用することです。左の列はメインコンテンツに使用され、右の列の約2〜3倍の幅です。これは、大まかにStack Exchangeサイトがレンダリングされる方法です。CSSでは、これはで実現することができるdisplay: tableの表示スタイルと関連するtable-rowtable-cell、以降フレックスボックスモデルと。正確な比率は驚くほど重要ではありません。

  • ページは、水平方向の中央に配置すると見やすくなります。

  • 多くの色を使用する必要はありません。背景色(通常は明るく不飽和なもの)とテキスト色(通常は暗く飽和したもの)があります。明るさのコントラストを下げて、脚注、署名欄、その他の詳細などのテキストを強調しないようにすることができます。HSVカラーモデルを使用する方が、RGBよりもはるかに簡単です。プレーングレーが退屈すぎる場合に使用できる多くのカラーパレットが存在します。色を使用する必要がありますが、控えめです。

  • フォントサイズを使用して重要度を示すこともできます。2ptのステップで9ptを下回ることはありません。通常のテキストの場合、14ptのフォントサイズを超えることはできません。一緒に、テキストのフォントサイズとコントラストは、音声のボリュームに似ています。

  • CSSの提供だけでなく、同様の測定値の絶対単位pxまたはcmだけでなく、相対単位のようなemキーワードのようなthinmedium。多くの場合、相対測定値とこれらのキーワードを使用する方が簡単です。

  • テキストはを超えることはできません40em

  • ブラウザにはデフォルトのスタイルシートが付属しています。きれいではありませんが、すべてをオーバーライドする必要はありません。シンプルなWebフォントを選択し、テキスト要素の最大幅を設定することが2つの最も重要なことです。セマンティックHTMLの記述は、デフォルトのスタイルが機能するために重要です。

これにより、シンプルなブログなどをスタイルすることが可能になります。しかしながら:

  • コードのデバッグはさらに難しく、自分が何をしているのかわからない場合はなおさらです。私は最初の試行で物事を正しく取得できません。しかし、どのように物事が「正しい」ように見えるかをどのように知るでしょうか?

  • いくつかの要素は、ポップアップメニューなどで要素を正確に配置する必要があります。

  • 画像とアイコンはデザインに深みを与えますが、選択するのは難しいでしょう。

  • CSSボックスモデルは恐ろしく、多くの場合、頭の中でシミュレートするのは困難です。

私はあなたが少しのCSSを書くことができると思いますが、それは信じられないほどイライラするでしょう。どの支援技術が存在するのかわかりませんが、触覚フィードバックにより一般的なレイアウトを設計できると思います。おそらく、視力のある人とのペアプログラミングは、細かい部分の良い解決策かもしれません。


3
ペアプログラミングの提案に同意します。視力は、デバッグやアーキテクチャと同じように、借りるもう1つのスキルです。
ジョンパーディ14年

5

EşrefArmağanペイントできる場合、視覚障害者はWebページを作成できるはずです。しかし、それがどれほど難しいかを考えると、おそらく他のプログラミング領域を考慮する必要があります。私はいくつかの盲目のプログラマーを知っていましたが、彼らは非常に効果的でした。彼らは常にプログラム全体を念頭に置く必要があるからです。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.