<html xmlns:un="http://usablenet.com/namespaces/508_rules" xmlns:saxon="http://icl.com/saxon">
   <link rel="stylesheet" href="josh.css">
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   
      <title>Detailed View for rule: 前景色と背景色のコントラストは十分ですか？</title>
      <!--
  508/W3C Accessibility Suite OEM V2 for Macromedia Dreamweaver
  (C) Copyright 2001-2005 UsableNet Inc. All rights reserved.
  -->
   </head>
   <body bgcolor="#ffffff">
      <div id="説明">
         <table cellpadding="0" cellspacing="0" border="0" class="main">
            <tr>
               <td valign="top" class="name" style="background-color:#dcdcdc;padding:3px;">前景色と背景色のコントラストは十分ですか？</td>
            </tr>
            <tr>
               <td colspan="2" class="divider"><img src="dwres:18084" height="1"></td>
            </tr>
            <tr>
               <td valign="top" colspan="2" class="requirements" style="text-align:right;">米国508条 1194.22(c); 
                  WAI/ 
                  WCAG1.0 チェックポイント 2.2
               </td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td valign="top" colspan="2" class="description"><b>概要</b><br>
                  
                  <p>Webページでいくつかの色が使用されています。前景色と背景色とのコントラストが十分ではない箇所があるかもしれません。</p>
                  
               </td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td valign="top" colspan="2" class="description"><b>チェック方法</b>
                  
                  <p>Webページで使用している色および色のついたアイテムが、ユーザーがそのWebページを利用する際に想定できるあらゆる状況において、はっきりと識別できることを確認してください。そして、前景および背景にあるアイテムのコントラストが、フォントのスタイル、サイズ、あるいは書体の違いのように、色以外の手段でも伝えられていることを確認してください。</p>
                  
                  <p>以下にWebページの簡単なチェック方法を挙げます。</p>
                  
                  <ul>
                     
                     <li>Webページをモノクロ画面で見て、コンテンツを利用してみる</li>
                     
                     <li>Webページをモノクロで印刷してみる</li>
                     
                     <li>Webページを印刷して、それを2～3回コピーして、そのコントラストを確認する。こうすることで、（リンクの下線のような）予備の目印をどこに追加すべきか、その目印が情報を伝えるのに小さすぎたり目立たなかったりしないかを確認することができる</li>
                     
                  </ul>
                  
               </td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td colspan="2" class="clearseparation">&nbsp;</td>
            </tr>
            <tr>
               <td valign="top" colspan="2" class="description"><b>解説</b><br>
                  
                  <p>デザイナーの選択した配色が原因で、Webページの情報あるいはイメージの認知および理解を妨げてしまうことがよくあります。例えば、以下のようなケースが考えられます。</p>
                  
                  <ul>
                     
                     <li>背景色・前景色の選択に問題がある。</li>
                     
                     <li>ユーザーの使用しているモニタが、デザイナーの使用しているモニタと同等のクオリティで色を表現できない。</li>
                     
                     <li>ユーザーがPDAあるいは携帯電話のモノクロ画面を使用している。</li>
                     
                     <li>ユーザーがモノクロのプリンタでWebページを印刷する必要がある。</li>
                     
                     <li>ユーザーの色覚に特性がある。</li>
                     
                  </ul>
                  
               </td>
            </tr>
         </table>
      </div>
   </body>
</html>