KAWANO's PukiWiki Plus! - Lecture/InfoDesignB2004/12th/work のバックアップ(No.2)

• バックアップ一覧
• 差分 を表示
• 現在との差分 を表示
• 現在との差分 - Visual を表示
• ソース を表示
• Lecture/InfoDesignB2004/12th/work へ行く。
  • 1 (2005-01-07 (金) 02:28:39)
  • 2 (2007-02-24 (土) 07:05:44)
  • 3 (2007-02-24 (土) 07:10:26)

ユーザビリティとアクセシビリティを高める

ユーザビリティ

現在のページのユーザビリティを向上させるために、 ページを少し改良しましょう。

授業のページへのリンク

皆さんのページが、何のために作られたのかがわかるように、 また、他の受講生との関係もわかるように、 授業のページへのリンクを作りましょう。

記事へのコメント・プロフィール・リンク集の、 各ページへのリンクの部分に、次のリンクを加えてください。

<li><a href="http://arena.hyogo-dai.ac.jp/~kawano/?Lecture/InfoDesignB2004">授業のページ</a></li>

「ページのトップへ」のリンク

コメントのページや、リンク集のページは、 量が多いために、 縦に何画面分もスクロールする必要があります。

そこで「ページのトップ（一番上）にジャンプするリンクを各コメント・カテゴリの最後に作る」ことにしましょう。
（参考: 第5回「同じページへのリンクをつくる」）

1. ページの一番上（h1要素など）に、ジャンプ用のアンカーを作る

   pre> <a name="top">

   h1>....</h1> </a>

   /pre>

   1. 各コメントの最後に「トップへ」や「↑」のような、ページの一番上にジャンプするリンクをつくる

   • HTMLファイル

     pre> <div class="top_link"> <a href="#top">↑トップへ</a> </div>

     /pre>

     • CSSファイル

       pre> div.top_link { text-align: right; font-size: x-small; }

       /pre>

アクセシビリティ

前回ノート型パソコンに導入した、 「Web Accessibility Toolbar日本語版」を使って、 アクセシビリティを改善してください。

まず、次の操作を行ってください。

• ノート型パソコンで、Internet Explorerを起動する
• 自分の作ったページを表示する

日本語特有の問題

「Web Accessibility Toolbar」のチェック機能を使って、 日本語特有の問題がないか調べます。

• 機種依存文字
  1. 「ドキュメント」→「日本語特有の問題」→「機種依存文字を表示」をクリック
  2. 結果として問題があれば、その箇所を修正
• 半角カナ
  1. 「ドキュメント」→「日本語特有の問題」→「半角カナを表示」をクリック
  2. 結果として問題があれば、その箇所を修正

色使いの問題

「Web Accessibility Toolbar」のチェック機能を使って、 色使いの問題がないか調べます。

• 第一色覚特性
  1. 「シミュレーション」→「第一色覚特性（赤/緑）の見え方」をクリック
  2. 表示された結果から、ページの内容が読みにくいのであれば、色使いを修正したり画像を差し替える
• グレースケール
  1. 「シミュレーション」→「グレースケール表示に変換」をクリック
  2. 表示された結果から、ページの内容が読みにくいのであれば、色使いを修正したり画像を差し替える

次へ進んでください。