(Translated by https://www.hiragana.jp/)
岡田 清鷹「表におけるアクセシビリティ」
HOME > arsvi.com 作成さくせいマニュアル >

岡田おかだ 清きよし鷹たか「表ひょうにおけるアクセシビリティ」

20091204
Tweet
last update: 20180728


◆狙ねらい
・アクセスブルな表ひょう（テーブル）作成さくせい。
◆参考さんこう文献ぶんけん
　20097/10/26 『Webアクセシビリティ――標準ひょうじゅん準拠じゅんきょでアクセシブルなサイトを構築こうちく／管理かんりするための考かんがえ方かたと実践じっせん』』　毎日まいにちコミュニケーションズ

今いままでの生存せいぞん学がくホームページにおける表ひょうは
http://www.arsvi.com/2000/0803ky06.htm
などのように「レイアウトテーブル」というものを使用しようしていた。

■レイアウトテーブル
◆１．通常つうじょうの場合ばあい
Cell 1 1 Cell 1 2
Cell 2 1 Cell 2 2
の場合ばあい、読よみあげる順番じゅんばんは
Cell 1 1→Cell 1 2→Cell 2 1→Cell 2 2
となる。

◆２．ちょっと複雑ふくざつなレイアウトテーブルの場合ばあい
ちょっと複雑ふくざつなレイアウトテーブルになってくると本文ほんぶんがわかりにくくなる。
レイアウトテーブルの例れい
ナビゲーションリンク　１
ナビゲーションリンク　２
ナビゲーションリンク　３
ナビゲーションリンク　４ 		バナー広告こうこく 右側みぎがわナビゲーション　１
右側みぎがわナビゲーション　２
右側みぎがわナビゲーション　３
メインコンテンツ、多おおくのテキスト
などの内容ないようがウィンドウの中心ちゅうしんを
占しめている
この表ひょうが読よみ上あげられる場合ばあい、最初さいしょにタイトルのパネルのすべての内容ないようが読よまれる。その後ご、次つぎの行くだりに進すすみ、左側ひだりがわの「ナビゲーションパネル」がすべて読よまれる。続つづいて「バナー」、「右側みぎがわのナビゲーション」と進すすみ、最後さいごに主おもな内容ないようが占しめるであろう「メインコンテンツ」が読よまれる。
このように結合けつごうされた表ひょうでは、メインとなるコンテンツを見みつけられるのが難むずかしくなるため、レイアウトにはテーブル（表ひょう）を用もちいないのが良よいだろう。

生存せいぞん学がくホームページではレイアウトとしてテーブルを使つかうことは少すくないとしても、ではデータを扱あつかうときはどうしたらよいだろう？

■データテーブル
◆１．単純たんじゅんなデータテーブルの場合ばあい
「単純たんじゅんなデータテーブル」とは次つぎの二に点てんの条件じょうけんを満みたすもの
・データセルの列れつ見出みだしが同おなじセルの列れつにあって、すべての列れつ見出みだしが同おなじ行ぎょうに並ならんでいる
・データセルの行くだり見出みだしが同おなじセルの行くだりにあって、すべての行くだり見出みだしが同おなじ列れつに並ならんでいる
　つまり、データを扱あつかった一般いっぱん的てきな表ひょうのこと

その際さいに気きをつけたいのが次つぎの二に点てん
Ａ．データテーブルでは、行くだりと列れつの見出みだしがわかるようにする
Ｂ．行ぎょうあるいは列れつの見出みだしが２階かい層そう異常いじょうあるデータテーブルでは、マークアップを用もちいてデータセルと見出みだしセルを関連付かんれんづける
　つまり、見出みだしがわかるようにすることが大事だいじらしい
　ではそれぞれやってみる

◇Ａの場合ばあい（[付記ふき：櫻井さくらい悟史さとし]音声おんせい認識にんしきソフトで読よめること確認かくにん済ずみ）
見出みだしの付つけ方かたは、行くだりの場合ばあいは、scope="row"を、列れつの場合ばあいはscope="col"。
また行くだりはtdで囲かこむことが一般いっぱん的てきだが、よりわかりやすくするためにthで囲かこむ。
こんな感かんじになる（全部ぜんぶ、打うち込こむのは手間てまだったので数値すうちは同おなじです）
月つき 年とし ペンサコラ ミルトン クレストビュー ナイスビル デフニャック　スプリング チプリー
１月がつ 1971-00 5.41 6.24 6.51 5.79 5.40 6.09
２月がつ 1971-00 5.41 6.24 6.51 5.79 5.40 6.09
３月がつ 1971-00 5.41 6.24 6.51 5.79 5.40 6.09
４月がつ 1971-00 5.41 6.24 6.51 5.79 5.40 6.09
５月がつ 1971-00 5.41 6.24 6.51 5.79 5.40 6.09
６月がつ 1971-00 5.41 6.24 6.51 5.79 5.40 6.09
７月がつ 1971-00 5.41 6.24 6.51 5.79 5.40 6.09
８月がつ 1971-00 5.41 6.24 6.51 5.79 5.40 6.09
フロリダの降雨こうう量りょうを示しめす表ひょう（のつもり）

◇Ｂの場合ばあい（付記ふき[櫻井さくらい悟史さとし]：こちらは下記かきの通とおりしても音声おんせい認識にんしきソフトで読よむのは困難こんなんなようである。このぐらい複雑ふくざつな表ひょうになるとエクセルでアップした方ほうが読よみやすいとの意見いけんもあった）
２ふたつの（論理ろんり的てきな）レベルの列れつ見出みだしが付つけられている場合ばあい（階層かいそう化かテーブル）
耕こう起おこり 不ふ耕こう起おこり
植うえ付つけ日び OP/OK 25P/25K OP/OK 25P/25K
4月がつ23−26日にち 152 152 153 154
5月2−3日にち 158 151 150 154
5月10−12日にち 152 152 153 154
5月23−24日にち 152 152 153 154

どの見出みだしセルがどのデータセルに対応たいおうしているかを示しめすのは、headers/idマークアップと呼よばれる（らしい）。
このテクニックは手作業てさぎょうで間違まちがいやすいが、基本きほん的てきな考かんがえ方かたは解わかりやすい。それぞれの見出みだしセルにidを与あたえて、各かくデータセルでは見出みだしにあるid文字もじ列れつを指定していする。その文字もじ列れつはデータセルのheaders属性ぞくせい値ちというもので指定していする。このページのタグを御覧ごらんいただけばわかるとおり、idで指定していされた文字もじ列れつをスペース区切くぎりで複数ふくすう指定していする。


＊作成さくせい：岡田おかだ 清きよし鷹たか
UP：20091204　REV:20091206, 20161129, 20180728
◇arsvi.com 作成さくせいマニュアル　
TOP　HOME (http://www.arsvi.com)◇