要約

ページ区切りマーカーの追加によって、デジタル出版物のユーザーは（紙媒体の）静的ページに対応する位置を見つけられるようになります。

テクニック

• テキスト内のページ区切り位置を識別します。[[WCAG-1.3.1]]

例

<p>
   …
   <span
       role="doc-pagebreak"
       id="pg24"
       aria-label="24"/>
   …
</p>

<div role="doc-pagebreak" aria-label="page 24" id="pg24">24</div>

よくある質問

電子書籍の内容の順序が印刷版の順序と正確に一致しない場合はどうなりますか？

デジタルへの変換時に、前後の資料が入れ替わったり省略されたりすることがあります。このようなコンテンツの順序変更は予想外とはいえず、電子書籍が印刷物とまったく同じ形式にならない点や、印刷物のすべてのコンテンツが含まれないかもしれないという点をユーザーは受け入れるでしょう。

デジタル版の順序が印刷版のソースと異なる場合、ページ区切りマーカーを連続番号になるようにつけなおさないでください。ページ区切りマーカーの目的は、ユーザーが印刷版と同じ場所を見つけやすくすることです。

一部のコンテンツがデジタル版で異なる順序になっている場合、またはデジタル版に含まれていない場合は、出版物のアクセシビリティサマリーにその旨を記載するのがベストプラクティスです。

ページ番号はページの終了位置を示していますか、それともページの開始位置を示していますか？

ページ番号は常にページの開始位置を示します。

ページ区切りマーカーの配置は印刷位置に従う必要がありますか？

いいえ、印刷版においてページ番号がページの上部に印刷されているか下部に印刷されているかには関係なく、ページ区切りマーカーは常にページコンテンツの先頭に配置します。ユーザーが特定のページにジャンプする場合、該当ページのコンテンツ末尾ではなく先頭にジャンプしたいはずです。

ページ番号をコンテンツとして含めるべきでしょうか、それとも空の要素として含めるべきでしょうか？

それぞれの方法には長所と短所があります。

ページ番号をspanまたはdiv内のテキスト コンテンツとして含めると、目の見えるユーザーと支援技術を使用するユーザーの両方がページにアクセスしやすくなります。この方法は、以前のDAISY標準で採用されていました。ただし、潜在的な欠点があり、主流のユーザーエージェントが不要なコンテンツをオフにする機能を提供しないため、ユーザーはページ番号の見たり聞いたりを強いられてしまいます。

ページ番号を空要素として使うのは、従来の主流アプローチであり、以前はアンカータグがこの機能を果たしていました。ただし、aria-label属性を空要素に使用すると、読んでいるときにページ番号にアクセスできない場合があります。

ユーザーエージェントがページ番号の表示切り替えをサポートしていなくても、JavaScriptを使ってこの機能を提供できます。各ドキュメントに番号を表示/非表示にするスクリプトを組み込めます。

ページ番号にはaria-labelとtitle属性のどちらを使用すればよいでしょうか？

ページ番号がテキストコンテンツとして含まれていない場合はaria-labelの使用が推奨されますが、両方の属性を使用することもできます。 アクセシブルな名前の計算アルゴリズムにおいて、aria-labelは、titleよりも優先されます。

リストの途中でページ区切りが発生した場合、ページ番号はどこに配置すればよいですか？

リストがページをまたいで分割され、1 つの項目がページの下部で終了し、新しい項目が次のページの先頭で始まることはよくあります。このような場合、リストにリスト項目以外のものを含めることはできないため、2 つのリスト項目の間にページ番号をつけることはできません。

明らかな解決策は、ページを終了する項目の最後の要素としてページ番号を挿入することです。

<li>…. <span role="doc-pagebreak" aria-label="24"/></li>
<li>…</li>

または、ページを開始するリスト項目の最初の要素として配置することです。

<li>…</li>
<li><span role="doc-pagebreak" aria-label="24"/> … </li>

ただし、ページ区切りのためだけに新しいリスト項目は作成しないでください。ページ区切りは多くの場合、表示されないコンテンツであるため、空のリスト項目があるとすべてのユーザーを混乱させ、リストの意味を変えてしまう可能性があります。

単語がページをまたいでハイフンで区切られている場合、どこにページ区切りを入れればよいでしょうか？

ページ区切りを単語の後に置きます。印刷用のハイフンをそのまま使用したり、単語の途中に番号を挿入したりしないでください。

見出し内にページ区切りを入れることはできますか？

いいえ、見出し内にページ区切りを入れないでください。これを行うと、ページ番号がセクションのアクセス可能な名前の一部になります（つまり、見出しのテキストコンテンツの一部として扱われてしまいます）。

ページ区切り番号を見出しタグの前に置きます。ページ区切り用に空の要素を使用している場合（つまり、例１のように値がtitle属性にある場合）、ページ区切りを見出しの前に移動しても、レイアウトに余分なスペースは追加されません。

ページ番号にaタグを使用できますか？

a要素には、HTML5で定義されている２つの特定の用途があります。href属性が存在する場合はリンク用、 href属性が存在しない場合はプレースホルダー リンク用です（たとえば、別のコンテキストでアクティブになるか、ユーザーによる何らかの操作の後にアクティブになる可能性のあるリンク）。ページ区切りはリンクではなく、リンクとしてアクティブになることを意図していないため、ページ区切りマーカーとして使用することはお勧めしません。

解説

電子出版物が印刷文書と同じワークフローで作成される場合、ページ区切り位置を保持する必要があります。ページ区切り位置を保持し、ページリストを提供すると、支援技術やリーディングシステムはユーザーが現在いるページを提示でき、ユーザーはページ単位で前後に移動できるようになります。

ページ区切り位置は、 role属性の値をdoc-pagebreakに設定したspanタグとdivタグを使用してマークアップに追加できます。

<div role="doc-pagebreak" id="pg2">2</div>

ページ番号を視覚的に表示しないようにするには、 aria-label属性を使用して番号を識別します。

<span role="doc-pagebreak" id="pg5" aria-label="5"/>

ページ区切りのid属性を使用すると、ページリストからこの位置にリンクできます。

ページ区切りは、従来、アクセシビリティの目的（つまり、電子版を使用する必要があるユーザーが印刷版を使用するユーザーと同じ箇所に移動できるようにするため）で保持されてきましたが、一般的なユーザーにも補助使用されるようになってきています。デジタルのみの出版物（つまり、静的なページ番号が付けられたソースがない出版物）はしばしば、ユーザーが位置移動しやすくするために、ページ区切りマーカーが組み込まれます。

関連リンク

• HTML — nav要素
• DPUB-ARIA — doc-pagebreak プロパティ
• EPUB 3 — pagebreak プロパティ