表組を配置する

表組は「カスタムテーブルブロック」を使用して作成します。

表組を使用する際の注意点

空欄を作らない／空欄を意図する記号を用いない

行（tr要素）の中身は空にしないでください。​
空にする場合は、見出しセル（th要素）かセル（td要素）を一つ配置し、セルに「なし 」や「該当なし」を入力してください。

見出しの範囲を指定する​

見出しセル（th要素）全てに、範囲（scope 属性）を指定してください。​
見出しの範囲を指定することでセルと見出しが関連付けられ、スクリーンリーダーの読み上げでユーザーの補助となります。​
範囲は、行か列で指定します。見出しセルの場所に応じて、指定してください。

​一行目（表組の一番上）が見出しセルの場合は、列を指定します。​
列（垂直方向）の見出し：col​

​一列目（表組の一番左）が見出しセルの場合は、行を指定します。​
行（水平方向）の見出し：row​

表組の入力例

表組の基本

一行目、一列目を見出しセルにして、スコープを設定します。見出しセルの位置が行か列かで、指定するスコープの方向が異なりますので、注意して下さい。
表にタイトルを付ける場合は、「キャプション」欄に入力してください。

SP版表示時のスクロール

「SP版表示時に横スクロールの有無」欄は、初期設定では、「スクロールあり」が選択されています。水平軸のセルが少ない場合や、SP版でも表を画面内に収めたい場合は、「スクロールなし」を選択してください。

「スクロールあり」のパターン例

「スクロールなし」のパターン例

一列目が見出しセルの表組の代替パターン

一列目が見出しセルの表組

一列目が見出しになっているため、音声読み上げソフトでは、二列目の情報と関連付けて読み上げられますが、表組でなければ表現できないことはないため、代替の方法で表現するようにしてください。

一列目が見出しセルの表組の代替パターン1

一列目が見出しセルの表組は、「定義リスト」の使用を推奨します。先述の表組を「定義リスト」で表現すると次のようになります。

学生宿舎（男子）

構造

1978年竣工、鉄筋コンクリート5階建、階段のみ（エレベーターなし）

収容人数

360人（日本人学部学生330人・外国人留学生30人）

一部屋の広さ

10平方メートル

寄宿料（月額）

6,000円

共益費（月額）

1,000円

光熱水料等（月額）

平均5,500円（料金は使用量に応じて個人ごとに変わります）

退去後居室清掃費 （1回目の光熱水量等徴収日に徴収）

6,000円

一列目が見出しセルの表組の代替パターン2

先述の表組を見出し構造で表現すると次のようになります。

学生宿舎（男子）

構造

1978年竣工、鉄筋コンクリート5階建、階段のみ（エレベーターなし）

収容人数

360人（日本人学部学生330人・外国人留学生30人）

一部屋の広さ

10平方メートル

共益費（月額）

1,000円

光熱水料等（月額）

平均5,500円（料金は使用量に応じて個人ごとに変わります）

退去後居室清掃費（1回目の光熱水量等徴収日に徴収）

6,000円

アクセシビリティに配慮した表組の例

表組内のセルを結合すると、音声読み上げソフトが正しく情報を読み上げないため、セルの結合はしないようにしてください。
また、空欄は内容の判別ができないため、空のセルを作らないようにしてください。