From 0a27543e9781a9d69463691b42cff0eeb7f75051 Mon Sep 17 00:00:00 2001 From: Misako Nomura Date: Mon, 26 Aug 2024 02:58:20 +0000 Subject: [PATCH 01/28] Translate accessibilityHazard.html via GitLocalize --- .../schema.org/accessibilityHazard.html | 166 ++++++++++++++++++ 1 file changed, 166 insertions(+) create mode 100644 publishing/ja/metadata/schema.org/accessibilityHazard.html diff --git a/publishing/ja/metadata/schema.org/accessibilityHazard.html b/publishing/ja/metadata/schema.org/accessibilityHazard.html new file mode 100644 index 00000000..bfb320b9 --- /dev/null +++ b/publishing/ja/metadata/schema.org/accessibilityHazard.html @@ -0,0 +1,166 @@ + + + + + accessibilityHazard（アクセシビリティ上の危険性） + + + + + + + +
+
+

定義

+ +

記述されたリソースの特性が、一部のユーザーにとって生理的に危険である。WCAG 2.2 ガイドライン 2.3に関連。

+
+ +
+

例

+ +
+
+
例 1 — EPUB 3
+
+ 
<meta property="schema:accessibilityHazard">flashing</meta>
+<meta property="schema:accessibilityHazard">motionSimulation</meta>
+
+ +
+
+
例 2 — EPUB 2
+
+ 
<meta name="schema:accessibilityHazard" content="flashing"/>
+<meta name="schema:accessibilityHazard" content="motionSimulation"/>
+
+ +
+
+
例3 — オーディオブック
+
+ 
"accessibilityHazard": ["flashing", "motionSimulation"]
+
+ +
+
+
例4 — RDFaを使用したHTML
+
+ 
<p><strong>Warning</strong>: <span
+property="accessibilityHazard">flashing</span> 
+in this video may cause seizures in some 
+individuals.</p>
+
+ +
+
+
例5 — マイクロデータを含むHTML
+
+ 
<p><strong>Warning</strong>: <span
+itemprop="accessibilityHazard">flashing</span> 
+in this video may cause seizures in some 
+individuals.</p>
+
+
+ +
+

値

+ +

以下の値は、潜在的な危険性（または危険性の欠如）を特定し、そのような敏感なユーザーが事前に何を予期すべきかを知るために使用されます。

+ +
+

注記

+

Unless the metadata format used supports lists (e.g., JSON-LD), use a separate property declaration for each feature. Do not merge the values into a single property using spaces, commas, or other delimiters.

+
+ +
+

flasing （閃光）

+ +

The flashing values is used to indicate that there is content in the publication that flashes more than three times a second or that the flashing is below the general flash and red flash thresholds.

+ +

これらの閃光の危険性は、光に敏感なユーザーに頭痛や発作を引き起こす可能性があります。この値を設定するだけでなく、出版物にはそのようなコンテンツが配置されている場所に警告を含める必要があります。

+ +

ビデオは閃光の危険（ストロボ効果など）の原因としてよく認識されていますが、閃光のリスクをもたらす可能性のあるコンテンツの種類は多数あります（アニメーション グラフィック、スクリプト化されたゲームや画像など）。

+
+ +
+

noFlashingHazard（閃光の危険性なし）

+ +

noFlashingHazard値はflashingの反対で、発行者が出版物の閃光の危険性をチェックし、存在しないことを確認したことを示すために使用されます。

+ +

The value is not an indication that a lack of flashing is a hazard.

+
+ +
+

none （アクセシビリティ上の危険性なし）

+ +

none値は、コンテンツがユーザーにとって既知の危険をもたらさないことを発行者が確信している場合に使用されます。

+ +

この値は通常、動的コンテンツやマルチメディア コンテンツがない（つまり、出版物がテキストや静的画像のみで構成されている）場合にのみ使用されます。

+
+ +
+

motionSimulation

+ +

motionSimulation値は、動きをシミュレートするコンテンツがあることを示すために使用されます。

+ +

モーション シミュレーションは、一部のユーザーに頭痛や吐き気を引き起こす可能性があります。この値を設定するだけでなく、このようなコンテンツが配置されている場所には警告を記載する必要があります。

+ +

モーション シミュレーションは、一人称視点のビデオやゲーム、3D エクスペリエンスやアニメーションなど、さまざまなメディアで使われています。

+
+ +
+

noMotionSimulationHazard

+ +

noMotionSimulationHazard値はmotionSimulationの反対で、発行者が出版物のモーション シミュレーション ハザードを確認し、危険性が存在しないことを確認するために使用されます。

+ +

The value is not an indication that a lack of motion simulation is a hazard.

+
+ +
+

sound

+ +

sound値は、一部のユーザーに発作を引き起こす可能性のある聴覚コンテンツが出版物に含まれていることを示すために使用されます。このような発作の原因は、鳴り響く音やブザー音、突然の大きな音、特定の言葉や音楽など多岐にわたります。

+ +

十分な注意を払うために、出版物に聴覚コンテンツが含まれている場合はこのプロパティを設定する必要があり、ユーザーはコンテンツを再生するかどうかを常に決定する必要があります（つまり、聴覚コンテンツは自動再生されるべきではありません）。

+
+ +
+

noSoundHazard （音の危険性なし）

+ +

noSoundHazard値はsoundの反対で、発行者が出版物の音声による危険性をチェックし音声上の危険性が存在しないことを確認しするために使用されます。

+ +

この値は、音声がないことが危険であることを示すものではありません。

+
+ +
+

unknown（不明）

+ +

unknown値は、発行者がまだ出​​版物の危険性をチェックしていないか、一部のコンテンツが危険をもたらすかどうか不明であることを示すために使用されます。

+ +

この値は、アクセシビリティ レビューが完了する前に出版物をリリースする必要がある場合にのみ、一時的なプレースホルダーとして使用してください。

+
+
+ +
+

関連リンク

+ + +
+
+ + From 00e5ffa6d721001468b256c0f3479dc71ca5f087 Mon Sep 17 00:00:00 2001 From: karen-atdo Date: Mon, 26 Aug 2024 02:58:21 +0000 Subject: [PATCH 02/28] Translate accessibilityHazard.html via GitLocalize --- .../ja/metadata/schema.org/accessibilityHazard.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/publishing/ja/metadata/schema.org/accessibilityHazard.html b/publishing/ja/metadata/schema.org/accessibilityHazard.html index bfb320b9..10e58727 100644 --- a/publishing/ja/metadata/schema.org/accessibilityHazard.html +++ b/publishing/ja/metadata/schema.org/accessibilityHazard.html @@ -77,13 +77,13 @@

値

注記

-

Unless the metadata format used supports lists (e.g., JSON-LD), use a separate property declaration for each feature. Do not merge the values into a single property using spaces, commas, or other delimiters.

+

使用するメタデータ形式（JSON-LD など）がリストをサポートしていない場合、機能ごとに個別のプロパティ宣言を使用します。スペース、カンマ、その他の区切り文字を使用して値を 1 つのプロパティに結合しないでください。

flasing （閃光）

-

The flashing values is used to indicate that there is content in the publication that flashes more than three times a second or that the flashing is below the general flash and red flash thresholds.

+

flashing値は、出版物に 1 秒間に 3 回以上閃光するコンテンツがあること、または閃光が一般閃光閾値及び赤色閃光閾値を下回っていることを示すために使用されます。

これらの閃光の危険性は、光に敏感なユーザーに頭痛や発作を引き起こす可能性があります。この値を設定するだけでなく、出版物にはそのようなコンテンツが配置されている場所に警告を含める必要があります。

@@ -95,7 +95,7 @@

noFlashingHazard（閃光の危険性なし）

noFlashingHazard値はflashingの反対で、発行者が出版物の閃光の危険性をチェックし、存在しないことを確認したことを示すために使用されます。

-

The value is not an indication that a lack of flashing is a hazard.

+

この値は、閃光の欠如が危険であることを示すものではありません。

@@ -121,7 +121,7 @@

noMotionSimulationHazard

noMotionSimulationHazard値はmotionSimulationの反対で、発行者が出版物のモーション シミュレーション ハザードを確認し、危険性が存在しないことを確認するために使用されます。

-

The value is not an indication that a lack of motion simulation is a hazard.

+

この値は、モーションシミュレーションの欠如が危険であることを示すものではありません。

From b4e586609f21b2194f536b98e3850bfa402dcac2 Mon Sep 17 00:00:00 2001 From: GMaruichi Date: Mon, 26 Aug 2024 02:58:23 +0000 Subject: [PATCH 03/28] Translate dragging-movements.html via GitLocalize --- publishing/ja/wcag/dragging-movements.html | 85 ++++++++++++++++++++++ 1 file changed, 85 insertions(+) create mode 100644 publishing/ja/wcag/dragging-movements.html diff --git a/publishing/ja/wcag/dragging-movements.html b/publishing/ja/wcag/dragging-movements.html new file mode 100644 index 00000000..2bde69c8 --- /dev/null +++ b/publishing/ja/wcag/dragging-movements.html @@ -0,0 +1,85 @@ + + + + + ドラッグ動作 + + + + + + +
+
+

概要

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
バージョン：WCAG 2.2以上
セクション番号：2.5.7
レベル：AA
適用対象： +
    +
  • インタラクティブなコンテンツ
    • +
+
要件： +

操作にドラッグ動作を用いる全ての機能は、ドラッグが不可欠でない限り、ドラッグなしのシングルポインタで完遂できる。

+
ガイダンス： + +
達成方法：WCAG 2.2の達成基準に対応する達成方法はまだ利用できません。
+
+
+

目的

+ +

この達成基準の目的は、すべてのユーザーがドラッグ アンド ドロップ操作を行うために必要な器用さを備えているわけではないため、ユーザーがドラッグ アンド ドロップ操作を実行する必要がないようにすることです。

+
+ +
+

要件の満たし方

+ +

インタラクティブなコンテンツでドラッグ アンド ドロップ操作を使用する場合、コンテンツ製作者はポインター デバイスを使用して、この操作を実行するための代替方法を提供する必要があります。たとえば、ユーザーがオブジェクトをクリックしてアクティブにし、ボタンをクリックしてオブジェクトを移動できるようにします。

+
+
+

追加情報

+ +

ナレッジベースでは、現在、アクセシブルな入力モダリティの作成について含まれておりません。詳細については、WCAG ガイダンス ドキュメントを参照してください。

+
+
+ + From 5208a85ee80c5c7eaa58ffb03d7efbbcfd0d5f72 Mon Sep 17 00:00:00 2001 From: GMaruichi Date: Mon, 26 Aug 2024 02:58:25 +0000 Subject: [PATCH 04/28] Translate error-identification.html via GitLocalize --- publishing/ja/wcag/error-identification.html | 101 +++++++++++++++++++ 1 file changed, 101 insertions(+) create mode 100644 publishing/ja/wcag/error-identification.html diff --git a/publishing/ja/wcag/error-identification.html b/publishing/ja/wcag/error-identification.html new file mode 100644 index 00000000..4c35edcf --- /dev/null +++ b/publishing/ja/wcag/error-identification.html @@ -0,0 +1,101 @@ + + + + + エラーの特定 + + + + + + +
+
+

概要

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
バージョン：WCAG 2.0以上
セクション番号：3.3.1
レベル：A
適用対象： +
    +
  • フォーム入力
    • +
+
要件： +

入力エラーが自動的に検出された場合は、エラーとなっている箇所が特定され、そのエラーが利用者にテキストで説明される。

+
ガイダンス： + +
達成方法： + +
+
+
+

目的

+ +

この達成基準の目的は、すべてのユーザーが入力エラーを見つけて理解できるようにすることです。

+
+
+

要件の満たし方

+ +

コンテンツ製作者は、無効な情報を含むフォーム フィールドが明確に識別され、簡単に見つけられるようにする必要があります。これは多くの場合、無効なフィールドのスタイル設定、ラベル付け、識別に加えて、フォームの先頭に問題の一覧を提供し、各問題にユーザーをリンクすることで実現されます。

+ +

コンテンツ製作者は入力の問題を説明する必要もあります。問題の解決方法のに関する提案の提供は、達成基準 3.3.3で取り上げられています。

+
+
+

追加情報

+ +

ナレッジベースの次のページには、コンテンツを出版する際にこの達成基準を満たす方法が記載されています。

+ + +
+
+ + From 71acdd2be89a38054af84502d525b349abe404a5 Mon Sep 17 00:00:00 2001 From: GMaruichi Date: Mon, 26 Aug 2024 02:58:26 +0000 Subject: [PATCH 05/28] Translate error-prevention-all.html via GitLocalize --- publishing/ja/wcag/error-prevention-all.html | 105 +++++++++++++++++++ 1 file changed, 105 insertions(+) create mode 100644 publishing/ja/wcag/error-prevention-all.html diff --git a/publishing/ja/wcag/error-prevention-all.html b/publishing/ja/wcag/error-prevention-all.html new file mode 100644 index 00000000..0dfa7da5 --- /dev/null +++ b/publishing/ja/wcag/error-prevention-all.html @@ -0,0 +1,105 @@ + + + + + エラー回避（全て） + + + + + + +
+
+

概要

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
バージョン：WCAG 2.0以上
セクション番号：3.3.6
レベル：AAA
適用対象： +
    +
  • フォーム
    • +
+
要件： +

利用者に情報の送信を要求するウェブページでは、次に挙げる事項のうち、少なくとも一つを満たしている

+ +
+
取消
+
+

送信を取り消すことができる。

+
+ +
チェック
+
+

利用者が入力したデータの入力エラーがチェックされ、利用者には修正する機会が提供される。

+
+ +
確認
+
+

送信を完了する前に、利用者が情報の見直し、確認及び修正をするメカニズムが利用できる。

+
+
+
ガイダンス： + +
達成方法：WCAG には現在、この達成基準の達成方法は含まれていません。
+
+
+

目的

+ +

この達成基準の目的は、データを保存するサーバーに送信する前に、ユーザーがデータのエラーを修正したり、データを見直したりする機会を確保することです。あるいは、送信を取り消す機能をユーザーに提供する必要があります。

+
+
+

要件の満たし方

+ +

この達成基準は、外部サーバーに送信され保存されるすべてのフォーム データに適用される点を除いて、実質的には達成基準 3.3.4と同じです。

+
+
+

追加情報

+ +

ナレッジベースの次のページには、コンテンツを出版する際にこの達成基準を満たす方法が記載されています。

+ + +
+
+ + From 28468c9e053050b33ff32974104793f4e2ffb472 Mon Sep 17 00:00:00 2001 From: GMaruichi Date: Mon, 26 Aug 2024 02:58:28 +0000 Subject: [PATCH 06/28] Translate error-prevention-legal-financial-data.html via GitLocalize --- ...error-prevention-legal-financial-data.html | 119 ++++++++++++++++++ 1 file changed, 119 insertions(+) create mode 100644 publishing/ja/wcag/error-prevention-legal-financial-data.html diff --git a/publishing/ja/wcag/error-prevention-legal-financial-data.html b/publishing/ja/wcag/error-prevention-legal-financial-data.html new file mode 100644 index 00000000..4fa4423a --- /dev/null +++ b/publishing/ja/wcag/error-prevention-legal-financial-data.html @@ -0,0 +1,119 @@ + + + + + エラー回避（法的、金融及びデータ） + + + + + + +
+
+

概要

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
バージョン：WCAG 2.0以上
セクション番号：3.3.4
レベル：AA
適用対象： +
    +
  • フォーム
    • +
+
要件： +

利用者にとって法律行為もしくは金融取引が生じる、利用者が制御可能なデータストレージシステム上のデータを変更若しくは削除する、又は利用者が試験の解答を送信するウェブページでは、次に示す事項のうち、少なくとも一つを満たしている。

+ +
+
取消
+
+

送信を取り消すことができる。

+
+ +
チェック
+
+

利用者が入力したデータの入力エラーがチェックされ、利用者には修正する機会が提供される。

+
+ +
確認
+
+

送信を完了する前に、利用者が情報の見直し、確認及び修正をするメカニズムが利用できる。

+
+
+
ガイダンス： + +
達成方法： + +
+
+
+

目的

+ +

この達成基準の目的は、データを保存するサーバーに送信する前に、ユーザーがデータのエラーを修正したり、データを見直したりする機会を確保することです。あるいは、送信を取り消す機能をユーザーに提供する必要があります。

+
+
+

要件の満たし方

+ +

デジタル出版物では通常、法的データや財務データは収集されないため、この達成基準はほとんどの場合、テストにのみ適用されます。

+ +

デジタル教科書には、リモート サーバー（例：学校のコース ポータルなど）に提出されるテストが含まれている場合があります。このような場合、コンテンツ製作者は入力を検証し、送信前にユーザーがエラーを修正できるようにするか、ユーザーに入力を確認するための変更を提供する必要があります。理想的には、両方のオプションが提供されることです。

+ +

提出を取り消すことが、この基準を満たす唯一の方法である場合は、出版物以外の代替手段を見つけることが推奨されます。たとえば、ユーザーは、テストを完了するために与えられた期間が終了するまで、コース ポータルから提出を取り消すことができるかもしれません。

+ +

達成基準は、データがリモート サーバーに転送され、保存される場合にのみ適用されることに注意してください。デジタル出版物内でのみ実行されるクイズやその他の埋め込みテストは、これらの要件の対象ではありません。

+
+
+

追加情報

+ +

ナレッジベースの次のページには、コンテンツを出版する際にこの達成基準を満たす方法が記載されています。

+ + +
+
+ + From 7e4e634ca84a862c91dfeb3244a7fb9ad69c21f0 Mon Sep 17 00:00:00 2001 From: GMaruichi Date: Mon, 26 Aug 2024 02:58:30 +0000 Subject: [PATCH 07/28] Translate error-suggestion.html via GitLocalize --- publishing/ja/wcag/error-suggestion.html | 99 ++++++++++++++++++++++++ 1 file changed, 99 insertions(+) create mode 100644 publishing/ja/wcag/error-suggestion.html diff --git a/publishing/ja/wcag/error-suggestion.html b/publishing/ja/wcag/error-suggestion.html new file mode 100644 index 00000000..e3056192 --- /dev/null +++ b/publishing/ja/wcag/error-suggestion.html @@ -0,0 +1,99 @@ + + + + + エラー修正の提案 + + + + + + +
+
+

概要

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
バージョン：WCAG 2.0以上
セクション番号：3.3.3
レベル：AA
適用対象： +
    +
  • フォーム入力
    • +
+
要件： +

入力エラーが自動的に検出され、修正方法を提案できる場合、その提案が利用者に提示される。ただし、セキュリティ又はコンテンツの目的を損なう場合は除く。

+
ガイダンス： + +
達成方法： + +
+
+
+

目的

+ +

この達成基準の目的は、ユーザーが入力エラーを修正する方法を理解できるようにすることです。

+
+
+

要件の満たし方

+ +

コンテンツ製作者は、可能な限り、入力エラーを修正する方法についてのガイダンスを提供する必要があります。たとえば、入力フィールドに許容される値の範囲が限られている場合は、その範囲をリストアップまたは説明することができます。または、ユーザーがフィールドに長すぎる回答を入力した場合は、入力されたテキストの量だけでなく、サイズ制限も記載することができます。

+
+
+

追加情報

+ +

ナレッジベースの次のページには、コンテンツを出版する際にこの達成基準を満たす方法が記載されています。

+ + +
+
+ + From c56de335b30947f512286d5e29c9e3284505839e Mon Sep 17 00:00:00 2001 From: GMaruichi Date: Mon, 26 Aug 2024 02:58:31 +0000 Subject: [PATCH 08/28] Translate extended-audio-description-prerecorded.html via GitLocalize --- ...xtended-audio-description-prerecorded.html | 91 +++++++++++++++++++ 1 file changed, 91 insertions(+) create mode 100644 publishing/ja/wcag/extended-audio-description-prerecorded.html diff --git a/publishing/ja/wcag/extended-audio-description-prerecorded.html b/publishing/ja/wcag/extended-audio-description-prerecorded.html new file mode 100644 index 00000000..33991c6f --- /dev/null +++ b/publishing/ja/wcag/extended-audio-description-prerecorded.html @@ -0,0 +1,91 @@ + + + + + 拡張音声解説（収録済み） + + + + + + +
+
+

概要

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
バージョン：WCAG 2.0以上
セクション番号：1.2.7
レベル：AAA
適用対象：音声付き映像
要件： +

前景音の合間の時間が、音声解説で映像の意味を伝達するのに不十分な場合、同期したメディアに含まれている全ての収録済みの映像コンテンツに対して、拡張音声解説が提供されている。

+
ガイダンス： + +
達成方法： + +
+
+
+

目的

+ +

この達成基準の目的は、全盲または視覚障害のあるユーザーが、拡張音声解説トラックを通じて、映像の非視覚コンテンツ（例：個人の動作、場面の変化など）にアクセスできるようにすることです。

+
+
+

要件の満たし方

+ +

この達成基準を満たす方法は、拡張音声解説の使用を必要とする点を除いて、 1.2.5と同様です。拡張音声解説トラックは、必要に応じて再生を一時停止し、音声トラックの自然な切れ目の間に詳細な説明を可能にするという点で、標準の音声解説トラックとは異なります。

+ +

この達成基準は、再生を一時停止せずに読者に必要なすべての情報を提供できる場合（つまり、標準的な音声解説トラックを通じて）には適用されません。

+ +
+

注記

+

電子書籍フォーマットでは通常、拡張音声解説の使用をサポートしていないため、ほとんどの場合、この要件を満たすことは現実的ではありません。

+
+
+
+

追加情報

+ +

出版フォーマットでの実装が不十分であるため、ナレッジベースには現在、拡張音声解説に関する情報は含まれていません。詳細についてはWCAG ガイダンス ドキュメントを参照してください。

+
+
+ + From 51ca0cb50861f1d952526c69a9d5d0e26d4ff404 Mon Sep 17 00:00:00 2001 From: karen-atdo Date: Mon, 26 Aug 2024 02:58:33 +0000 Subject: [PATCH 09/28] Translate images-icons.html via GitLocalize --- publishing/ja/html/images-icons.html | 147 +++++++++++++++++++++++++++ 1 file changed, 147 insertions(+) create mode 100644 publishing/ja/html/images-icons.html diff --git a/publishing/ja/html/images-icons.html b/publishing/ja/html/images-icons.html new file mode 100644 index 00000000..b7336569 --- /dev/null +++ b/publishing/ja/html/images-icons.html @@ -0,0 +1,147 @@ + + + + + アイコン + + + + + + + +
+
+

要約

+

アイコンの目的を識別できるように、アイコンに明確かつ一貫したラベルを付けるようにします。

+
+
+

テクニック

+
    +
  • +

    アイコンが一貫して識別されるようにします。[[WCAG-3.2.4]]

    +
    • +
  • +

    アイコンと背景の間に十分なコントラストがあるようにします。[[WCAG-1.4.11]]

    +
    • +
  • +

    フォントアイコンを識別し、ラベルを付けます。[[WCAG-3.2.4]]

    +
    • +
  • +

    アイコンがコントロール用である場合は、サイズが少なくとも44 x 44ピクセルであることを確認します。[[WCAG-2.5.5]]

    +
    • +
+
+
+

例

+
+
+

例 1 — 一般的なサイドバーの識別

+
+ 
<aside
+    id="warn-001"
+    class="warning">
+   <img src="bomb.png" alt="Warning"/>
+   <p>The following experiment may cause
+      bodily harm if … </p>
+</aside>
+
+…
+
+<aside
+    id="warn-002"
+    class="warning">
+   <img src="bomb.png" alt="Warning"/>
+   <p>Risk of explosion increases as the
+    coefficient … </p>
+</aside>
+
+ +
+
+

例2 — 十分なコントラスト

+
+

次の例は、十分な背景コントラストを持つアイコンを示しています。

+

+

+Image Description + +

次の例は、背景のコントラストが不十分な同じアイコンを示しています。

+

+

+Image Description + +
+ +
+
+

例 3 — フォントアイコン

+

次の例では、私的使用領域のコードポイントを使用して、架空の「Icons」フォント ファミリーから電子メール アイコンをレンダリングします。

+
+

CSS

+ 
.icon { font-family: 'Icons' !important; }
+.email { background-color: #ffffff; }
+.email:before { content: "\f8ee"; }
+

HTML

+ 
<p>
+   <span
+    class="icon email"
+    role="img"
+    aria-label="Email the publisher"></span>
+</p>
+
+ +
+
+

例4 — 十分なサイズ

+
+ +

次の例は、WCAG 2.1 で要求される 44 x 44 ピクセルの AAA 最小ターゲット サイズを示しています。

+

+Image Description + +

次の例は、WCAG 2.2 で要求される 24 x 24 ピクセルの AA 最小ターゲット サイズを示しています。

+

+画像の説明 +
+
+
+

解説

+ +

電子出版物では、アイコンは Webほど一般的ではありませんが、珍しいものではありません。アイコンは、教科書やその他のノンフィクション作品にあるさまざまな種類のサイドバーなど、出版物内の重要な項目を識別するためによく使用されます。また、テキストの代わりに、画像の拡張説明があることを示すためにもよく使用されます。そしてもちろん、インタラクティブ コンテンツのコントロールとしてもよく使用されます。

+ +

アイコンをアクセシブルにするには、一般的に画像と同じ要件に従いますが、アイコンに固有の追加要件もいくつかあります。これらの中でも重要なのは、ネーミングの一貫性です。ラベルを提供するだけでは十分ではありません。ユーザーは、アイコンの意味と目的が出版物全体で一貫していることを期待するようになるからです。たとえば、拡張説明へのリンクに使用されるアイコンには、ある場所では「図 1 の拡張説明」というラベルを付け、次の場所では「図 2 の詳細を読む」というラベルを付けるべきではありません。図の番号は変わるため、ラベルは同一にはなりませんが、言い回しは一貫している必要があります。

+ +

アイコンが明確に区別できることも重要です。アイコンとその背景のコントラスト比が 3:1 であることで、ユーザーはアイコンが使用されている場所とそれが表すものの両方を認識できるようになります。同様に、画像がクリックなどの入力アクションのターゲットを表す場合、アイコンの長さと高さは少なくとも 24 ピクセルが必要です。特に WCAG の要件ではありませんが、アイコンは、できるだけ幅広いユーザーが拡大しなくても判読できるようにサイズを設定する必要があります。アイコンに複雑な画像を使用しないことも推奨されます。目の見えるユーザーでも意味を理解するのに苦労する可能性があるためです。

+ +

フォントアイコンは、画像アイコンとは少し異なります。フォントアイコンは、製作者が Unicode の私的使用領域（つまり、どの文字にも割り当てられていない特別なコードポイントで、製作者がそれらのコードポイントのアイコンを定義するフォントを提供できます）を使用することに依存しています。このアプローチの問題は、私的使用領域のコードポイントがユーザーエージェントと支援技術に認識されないため、アイコンの意味を通知する方法がないことです。この問題を回避するために、製作者は ARIA ロール "img" を添付し、アイコンが挿入される場所にラベルを付けることができます（上記の例 3を参照）。

+
+
+

関連リンク

+ +
+
+ + From 014840d2fd8b478c7804f040484a9a35ef128a10 Mon Sep 17 00:00:00 2001 From: karen-atdo Date: Mon, 26 Aug 2024 02:58:35 +0000 Subject: [PATCH 10/28] Translate images-selection.html via GitLocalize --- publishing/ja/html/images-selection.html | 177 +++++++++++++++++++++++ 1 file changed, 177 insertions(+) create mode 100644 publishing/ja/html/images-selection.html diff --git a/publishing/ja/html/images-selection.html b/publishing/ja/html/images-selection.html new file mode 100644 index 00000000..27e88835 --- /dev/null +++ b/publishing/ja/html/images-selection.html @@ -0,0 +1,177 @@ + + + + + 画像の選択（Image Selection） + + + + + + + +
+
+

要約

+ +

picture要素とimg要素の画像選択機能を使用して、さまざまなデバイスに最適化された画像を提供します。

+
+ +
+

テクニック

+
    +
  • +

    代替画像を提供するには、 picture要素の子であるsource要素を使用します。

    +
    • +
  • +

    代替画像を提供するには、 img要素のsrcset属性を使用します。

    +
    • +
+
+ +
+

例

+ +
+
+
例 1 — フォールバック画像を追加する
+
+ 
<picture>
+   <source
+        srcset="covers/9781449328030.avif"
+        type="image/avif"/>
+   <img
+        src="covers/9781449328030.jpg"
+        alt="Accessible EPUB 3 - First Edition"/> 
+</picture>
+
+ +
+
+
例 2 — 白黒ディスプレイに最適化された画像を追加する
+
+ 
<picture>
+   <source
+        srcset="covers/9781449328030_bw.jpg"
+        media="(monochrome)"/>
+   <img
+        src="covers/9781449328030_color.jpg"
+        alt="Accessible EPUB 3 - First Edition"/>
+</picture>
+
+ +
+
+
例3 — 異なるディスプレイ解像度に対応した画像を提供する
+
+ 
<img
+     srcset="covers/9781449328030_small.jpg 1x,
+             covers/9781449328030_large.jpg 2x"
+     src="covers/9781449328030_small.jpg"
+     alt="Accessible EPUB 3 - First Edition"/>
+
+
+ +
+

よくある質問

+
+
どの要素を使うかは重要ですか？
+
+

いいえ。picture 要素は表示要素ではありません。この要素は、子要素であるimgタグに他の画像を関連付ける機能を提供するだけです。選択した画像の実際のレンダリングはimg要素によって行われるため、使用するタグによってレンダリングが変わることはありません。

+

picture要素の利点の１つは、出版者がより複雑な選択基準を定義できることです。picture要素が良く使われるのは、その複数の子要素source要素によって選択基準の読み取りが容易になるためです。

+
+
+
+ +
+

解説

+ +

代替画像を提供することは、より一般的なユーザビリティの問題ですが、ユーザーのディスプレイに最適化された画像を提供することで、アクセシビリティにとって多くの副次的なメリットがあります。

+ +

たとえば、カラー ディスプレイ用に最適化された表紙画像は、モノクロ ディスプレイのデバイスでレンダリングすると判読できない場合があります。同様に、画面解像度に合わせて適切なサイズで最適化された画像を提供することで、視力の弱いユーザーを支援することができます。最適化された画像は、すべてのデバイスの表示能力に合わせて単一の画像を使用せざるを得ないことで発生するピクセル化の問題を回避するのに役立ちます。

+ +

次のセクションでは、 picture要素とimg要素の主な機能について簡単に説明します。これらの要素の詳細については、 「関連リンク」セクションのリソースを参照してください。

+ +
+

+picture要素

+ +

picture要素はimg要素のラッパー（包摂要素）であり、追加の画像をそのタグに関連付けることができます。したがって、 picture要素には常に子img要素が必要です。

+ +

新しいpicture要素が認識されない場合でも、子のimg要素により、画像を表示できます。また、 img要素は、代替テキストや、必要に応じて拡張説明も提供できます。

+ +

表示される画像に関係なく、同じ代替テキストと説明が使用されるため、セット内の画像の違いは表示特性のみである必要があります（つまり、画像内の情報が異なってはなりません）。

+ +

ユーザーエージェントが表示できる代替画像は、子要素sourceで指定されます (例1と2を参照)。

+ +

各source要素で指定された画像の特性は、次の属性を使用して定義されます。

+ +
+
srcset
+
+

この属性が指定するのは、使用する画像への 1 つ以上の URL のリストです。

+

各画像 URL の後に幅記述子が続く場合もあります。

+ 
srcset="covers/small.jpg 480w, covers/large.jpg 960w"
+

またはピクセル密度の宣言が続きます。

+ 
srcset="covers/low_res.jpg 1x, covers/hi_res.jpg 2x"
+

幅記述子は、画像の幅をユーザー エージェントに伝え、ビューポートに最適に収まるかどうかを判断できるようにします。幅記述子を指定する場合は、 sizes属性も設定する必要があります。

+

ピクセル密度はディスプレイの解像度を指します。標準解像度の画面は 1 倍、Retina ディスプレイは 2 倍（ピクセル密度が 2 倍）、より新しい画面解像度は 3 倍や 4 倍の解像度にも達しています。

+

src属性は、picture要素のsource子要素では無効であることに注意してください。画像オプションが 1 つしかない場合でも、 srcsetで指定する必要があります。複数の画像を指定する場合は、 sizes属性を設定する必要があります。

+
+ +
type
+
+

The media type of the image.

+ 
type="image/jpeg"
+

If the source element refers to multiple images of different media types, the attribute should not be set.

+
+ +
media
+
+

画像を使用する条件を指定するメディアクエリー。

+ 
media="(monochrome)"
+
+ +
sizes
+
+

sizes属性は、画像の表示幅を指定します。各幅（最後の幅を除く）には、画像を使用する条件を指定するメディアクエリーを含めることができます。他の条件が適用されない場合は、最後に指定されたサイズがデフォルトになります。

+

たとえば、次の宣言では、最大画面幅が 480 ピクセルの場合、画像は画面幅全体を占めます。それより大きい場合は、画像は画面幅の半分だけを占めます。

+ 
sizes="(max-device-width: 480px) 100vw,
+        50vw"
+

ユーザーエージェントは、デバイスに適用される幅を決定し、その情報を使用してsrcset属性から使用する最も適切な画像を計算します。

+
+
+
+ +
+

+img要素

+ +

img要素はpicture要素と似ていますが、より基本的なオプション セットを提供します。つまり、 srcsetとsizes属性のみが許可されます。これらの属性はまったく同じように機能するため、詳細についてはpicture要素のセクションの定義を参照してください。

+

img要素は、 picture要素内で使用されるかどうかに関係なく、常にデフォルトの画像を含むsrc属性を指定する必要があります。この画像は、ユーザー エージェントがデバイスに適した画像を見つけられない場合、他のオプションが指定されていない場合、またはユーザー エージェントが画像の選択をサポートしていない場合に表示されます。

+
+
+ +
+

関連リンク

+ +
+
+ + From d422e8c89df3d933c10f5a6bb52b3edefbf1d352 Mon Sep 17 00:00:00 2001 From: mayuhamada Date: Mon, 26 Aug 2024 02:58:36 +0000 Subject: [PATCH 11/28] Translate images-selection.html via GitLocalize --- publishing/ja/html/images-selection.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/publishing/ja/html/images-selection.html b/publishing/ja/html/images-selection.html index 27e88835..e0348178 100644 --- a/publishing/ja/html/images-selection.html +++ b/publishing/ja/html/images-selection.html @@ -128,9 +128,9 @@

type
-

The media type of the image.

+

画像のメディアタイプ。

type="image/jpeg"
-

If the source element refers to multiple images of different media types, the attribute should not be set.

+

source要素が異なるメディアタイプの複数の画像を参照する場合は、属性を設定しないでください。

media
From 6a496a5749c408e3b357c67f795a832ec7f1c26a Mon Sep 17 00:00:00 2001 From: karen-atdo Date: Mon, 26 Aug 2024 02:58:37 +0000 Subject: [PATCH 12/28] Translate images-text-based.html via GitLocalize --- publishing/ja/html/images-text-based.html | 194 ++++++++++++++++++++++ 1 file changed, 194 insertions(+) create mode 100644 publishing/ja/html/images-text-based.html diff --git a/publishing/ja/html/images-text-based.html b/publishing/ja/html/images-text-based.html new file mode 100644 index 00000000..fbc059ca --- /dev/null +++ b/publishing/ja/html/images-text-based.html @@ -0,0 +1,194 @@ + + + + + テキストベースの画像（Text-based Images） + + + + + + +
+
+

要約

+ +

テキストベースの画像を識別して説明することで、その中に含まれるテキストを支援技術が無視したり読み上げようとしたりしないようにします。

+
+ +
+

テクニック

+ +
    +
  • テキストベースの画像を識別するには、 role属性の値imgを使用します。[[WCAG-1.3.1]]
    • +
  • 代替テキストや拡張説明を提供します。[[WCAG-1.1.1]]
    • +
  • テキストと背景の間に十分なコントラストがあるようにします。[[WCAG-1.4.3]]
    • +
+
+ +
+

例

+ +
+
+
例 1 — 代替テキスト付きの ASCII 描画
+

aria-label属性は代替テキストの説明を提供します。この属性は、 img要素でのみ許可されるalt属性と同じ目的を果たします。

+
+ 
<pre
+    role="img"
+    aria-label="Winnie the Pooh with Hunny pot">
+    _
+ __( )_
+(      (o____
+ |          |
+ |      (__/
+   \     /   ___
+   /     \  \___/
+ /    ^    /     \
+|   |  |__|_HUNNY |
+|    \______)____/
+ \         /
+   \     /_
+    |  ( __)
+    (____)
+</pre>
+
+ +
+
+
例 2 — 代替テキスト付きの絵文字
+
+ 
<span role="img" aria-label="shrug">¯\_(ツ)_/¯<span>
+
+ +
+
+
例 3 — 編集テキスト
+
+ 
<p>In the case of
+   <span
+         class="redacted"
+         role="img"
+         aria-label="redacted text">_____<span>
+   it is clear that the crime of
+   <span
+         class="redacted"
+         role="img"
+         aria-label="redacted text">_____<span>
+   …
+<p>
+
+ +
+
+
例 4 — 説明付きのASCII描画
+

aria-describedby属性は、ASCII 画像の説明を提供するために使用されます。

+
+ 
<pre
+    role="img"
+    aria-label="Skeleton in graveyard"
+    aria-describedby="skeleton-desc">
+           _..--""---.
+          /           ".
+          `            l
+          |'._  ,._ l/"\
+          |  _J<__/.v._/
+           \( ,~._,,,,-)
+            `-\' \`,,j|
+               \_,____J
+          .--.__)--(__.--.
+         /  `-----..--'. j
+         '.- '`--` `--' \\
+        //  '`---'`  `-' \\
+       //   '`----'`.-.-' \\
+     _//     `--- -'   \' | \________
+    |  |         ) (      `.__.---- -'\
+     \7          \`-(               74\\\
+     ||       _  /`-(               l|//7__
+     |l    ('  `-)-/_.--.          f''` -.-"|
+     |\     l\_  `-'    .'         |     |  |
+     llJ   _ _)J--._.-('           |     |  l
+     |||( ( '_)_  .l   ". _    ..__I     |  L
+     ^\\\||`'   "   '"-. " )''`'---'     L.-'`-.._
+          \ |           ) /.              ``'`-.._``-.
+          l l          / / |                      |''|
+           " \        / /   "-..__                |  |
+           | |       / /          1       ,- t-...J_.'
+           | |      / /           |       |  |
+           J  \  /"  (            l       |  |
+           | ().'`-()/            |       |  |
+          _.-"_.____/             l       l.-l
+      _.-"_.+"|                  /        \.  \
+/"\.-"_.-"  | |                 /          \   \
+\_   "      | |                1            | `'|
+  |ll       | |                |            i   |
+  \\\       |-\               \j ..          L,,'. `/
+ __\\\     ( .-\           .--'    ``--../..'      '-..
+   `'''`----`\\\\ .....--'''
+              \\\\                           -nabis  ''
+
+</pre>
+<p id="skeleton-desc" hidden="">
+   A skeleton is posing next to a grave marker …
+</p>
+
+
+ +
+

よくある質問

+ +
+
空欄を埋めるフィールドはテキストベースの画像ですか?
+
+

はい、回答を記入する場所を示すために下線を使用するのは、テキストベースの画像の一種です。これらのフィールドが識別されていない場合、通常、回答が必要であることや回答の長さがユーザーにはわかりません。

+

フィールドの代替テキストを使用して、予想される入力内容を説明できます。

+

たとえば、自由形式の入力フィールドは次のように表現できます。

+ 
<p>The US capital
+   <span role="img" aria-label="answer field">__________<span>
+   is located on the Potomac River.</p>
+

特定の文字数を期待するフィールドは次のように表現できます。

+
<p>The quick brown 
+   <span role="img" aria-label="answer field - 3 letters">_ _ _<span>
+   jumped over the lazy dog.</p>
+

理想的には、出版社はテキスト入力にネイティブ HTML フォーム フィールドを使用すべきですが、デジタル版で印刷版を正確に複製する必要がある場合に、これが常に可能であるとは限りません。

+
+
+
+ +
+

解説

+ +

「ASCII アート」という名前は、一般的にテキストベースの画像を表すために使用されますが、そのようなアートワークが ASCII セットの印刷可能な文字のみで構成されているわけではありません。最新のコンピューターで Unicode がサポートされているということは、Unicode プレーンのすべての印刷可能な文字が使用可能になっていることを意味します。

+ +

テキストベースの画像の要件は、ラスター画像やベクター画像とほぼ同じですが、実装が若干異なります。重要な違いの 1 つは、テキストベースの画像は、デフォルトでは周囲のテキストと区別できないことです（つまり、JPEG や SVG のように、別の形式ではなく、固有のタグもありません）。

+ +

一連の文字がテキストベースの画像を表すことを識別するには、画像の周囲のタグに、値が「 img 」である ARIA role属性を追加します（例 1を参照）。テキストベースの画像は、レイアウトを維持するためにpreタグで囲まれることがよくありますが、たとえば、1 行の画像はspanタグで囲まれることがあります。

+ +

テキストベースの画像をロールで識別しない場合、支援技術は画像に含まれるテキストを読み上げようとします。句読点で構成される画像の場合、ユーザーには何も読み上げられない可能性があります（一時停止のみが聞こえる場合があります）。英数字を含む画像の場合、文字が読み上げられるときにユーザーには意味不明な内容が聞こえる場合があります。

+ +

画像が特定されると、要件は他の画像の場合と同様になります。代替テキストは通常必須ですが、 img elementsでのみ許可されるため、 alt属性で指定することはできません。テキストベースの画像の場合、 aria-labelまたはaria-labelledby属性を使用して代替テキストを指定できます（例 1を参照）。

+ +

複雑な画像の場合、 aria-describedbyまたはaria-details属性を使用して説明を提供できます（例 4を参照）。画像の説明の詳細については、画像の説明ページを参照してください。

+ +

テキストベースの画像のコントラストの問題を考慮することも重要です。WCAG では画像に十分なコントラストがあることは厳密には要求されていませんが（画像に実際の文字が含まれている場合を除く）、テキスト文字を使用すると、画像の作成に使用されたテキストと画像が表示される背景とのコントラストを、製作者が制御できます。十分なコントラストを使用することで、読者が画像を認識できるようになります。

+
+ +
+

関連リンク

+ + +
+
+ + From f0c3bfc13d98d401a4ba6fe7710e3af27c8898c4 Mon Sep 17 00:00:00 2001 From: karen-atdo Date: Mon, 26 Aug 2024 02:58:39 +0000 Subject: [PATCH 13/28] Translate images-text.html via GitLocalize --- publishing/ja/html/images-text.html | 86 +++++++++++++++++++++++++++++ 1 file changed, 86 insertions(+) create mode 100644 publishing/ja/html/images-text.html diff --git a/publishing/ja/html/images-text.html b/publishing/ja/html/images-text.html new file mode 100644 index 00000000..375e223b --- /dev/null +++ b/publishing/ja/html/images-text.html @@ -0,0 +1,86 @@ + + + + + 文字画像（Images of Text） + + + + + + + +
+
+

要約

+

可能な限り文字画像の使用は避けますが、使用が避けられない場合は、そのテキストを認識可能で支援技術で利用できるようにしてください。

+
+ +
+

テクニック

+
    +
  • +

    alt属性で画像テキストを提供します。[[WCAG-1.1.1]]

    +
    • +
  • +

    最低限のコントラストを確保します。[[WCAG-1.4.3]]

    +
    • +
+
+ +
+

例

+ +
+
+
例 — 画像の見出し
+

alt属性は画像内のテキストを提供します。

+
+ 
<h2><img src="images/xl-hd.jpg" alt="Canto XL"/></h2>
+
+ +
+
+
例 — 画像入力ボタン
+

input要素のalt属性は、画像ボタンのテキストのラベルを提供します。

+
+ 
<input
+    type="image"
+    name="submit"
+    src="enter.jpg"
+    alt="Enter to Win!"/>
+
+
+ +
+

解説

+ +

出版物では、プレゼンテーションを確実にするためにテキストの画像が使用されることがあります。たとえば、著者が埋め込むことができない特殊なフォントが見出しに必要になったり、テキストが画像でしか再現できない方法で様式化されていたりする場合があります。

+ +

ベストプラクティスとしては、可能な限り CSS を使用してテキストのスタイルを設定することです。これにより、ユーザーは自分のニーズに合わせてフォントのプロパティを変更できます。また、ユーザーがハイコントラストの読書モードなどのテーマを適用したときに、画像テキストによって効果が損なわれることもなくなります。

+ +

テキスト画像を使用する必要がある場合は、 alt属性で画像の全テキストを提供します。

+ +

テキスト画像を使用しても、テキストが WCAG のコントラスト要件を満たさなくてよくなるわけではないことに注意してください。達成基準 1.4.3を満たすには、前景色と背景色が 4.5 : 1 の最小コントラスト要件を満たす必要があります。

+
+ +
+

関連リンク

+ +
+
+ + From 817970eb6ced45c3392a6647b98d34679aa78ca7 Mon Sep 17 00:00:00 2001 From: mayuhamada Date: Mon, 26 Aug 2024 02:58:40 +0000 Subject: [PATCH 14/28] Translate images-text.html via GitLocalize --- publishing/ja/html/images-text.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/publishing/ja/html/images-text.html b/publishing/ja/html/images-text.html index 375e223b..806e42f7 100644 --- a/publishing/ja/html/images-text.html +++ b/publishing/ja/html/images-text.html @@ -73,7 +73,7 @@

解説

関連リンク

    -
  • DIAGRAM — Best Practices for Authoring Extended Descriptions in EPUB +
  • DIAGRAM — EPUB で拡張説明を作成するためのベストプラクティス
  • MDN — <img>: 画像埋め込み要素
    • From 147b902f619504e4213f5a4058f04b8f5f074e00 Mon Sep 17 00:00:00 2001 From: karen-atdo Date: Mon, 26 Aug 2024 02:58:42 +0000 Subject: [PATCH 15/28] Translate indexes.html via GitLocalize --- publishing/ja/html/indexes.html | 182 ++++++++++++++++++++++++++++++++ 1 file changed, 182 insertions(+) create mode 100644 publishing/ja/html/indexes.html diff --git a/publishing/ja/html/indexes.html b/publishing/ja/html/indexes.html new file mode 100644 index 00000000..1ed86f4d --- /dev/null +++ b/publishing/ja/html/indexes.html @@ -0,0 +1,182 @@ + + + + + 索引（Indexes） + + + + + + + +
    +
    +

    要約

    + +

    セクションとリストを使用して索引を構成し、各項目へのアクセスを簡素化します。

    +
    + +
    +

    テクニック

    + +
      +
    • +

      section要素を使用して、関連するエントリーのセットをグループ化します。[[WCAG-1.3.1]]

      +
      • +
    • +

      各セクションに見出しを含めます [[WCAG-1.3.1]]

      +
      • +
    • +

      ul要素を使用して、エントリーのリストを構造化します。[[WCAG-1.3.1]]

      +
      • +
    • +

      リンクを容易にするために、静的なページ区切り位置をテキストに含めます。[[WCAG-1.3.1]]

      +
      • +
    +
    + +
    +

    例

    + +
    +
    +

    例1 — 明確な見出しのある索引

    +
    + + 
    <nav role="doc-index">
+   <h1>Subject Index</h1>
+   
+   <section>
+     <h2>A</h2>
+     
+     <ul>
+       <li>
+         Apples, <a href="#page01">1</a>, 
+         <a href="#page27">27</a>
+       </li>
+       …
+     </ul>
+   </section>
+   
+   …
+</nav>
    +
    + +
    +
    +

    例 2 — 暗黙的な見出しのある索引

    +

    索引エントリーのセットが視覚的なスペースによってのみ区切られている場合は、 aria-label属性を使用して支援技術用の見出しを提供します。

    +
    + + 
    <nav role="doc-index">
+   <h1>Index</h1>
+   
+   <section aria-label="A">
+     <ul>
+       <li>
+         Apples, <a href="#page01">1</a>, 
+         <a href="#page27">27</a>
+       </li>
+       …
+     </ul>
+   </section>
+   
+   <section aria-label="B">
+     <ul>
+       <li>
+         Blueberries, <a href="#page01">1</a>, 
+         <a href="#page27">27</a>
+       </li>
+       …
+     </ul>
+   </section>
+   
+   …
+</nav>
    +
    + +
    +
    +

    例3 — ヘッダー付き索引

    +

    header要素を使用して、索引エントリーのリストの前に予備情報をグループ化します。

    +
    + + 
    <nav role="doc-index">
+   <header>
+      <h1>Index</h1>
+      
+      <p>This is an index to the main text …</p>
+	
+      <p>Alphabetization is word-by-word: …</p>
+   </header>
+   
+   …
+</nav>
    +
    +
    + +
    +

    よくある質問

    + +
    +
    EPUB インデックス仕様に従う必要がありますか？
    +
    +

    epub:typeセマンティクスの使用は必須ではありませんが、この文書の構造化原則に従うことが推奨され、アクセシビリティに最も役立つ原則はこのページで繰り返し説明されています。これらのセマンティクスは出版社の内部ワークフローには役立つかもしれませんが、現時点ではリーディングシステムの索引を強化するものではなく、 epub:typeセマンティクスはアクセシビリティを提供しません。

    + +

    現時点では仕様の採用が限られているため、仕様のパッケージ ドキュメント識別要件に従う必要はありません。

    +
    + +
    索引にはnav要素とsection要素のどちらを使用すればよいですか?
    +
    +

    どちらも技術的には許容されますが、 nav要素を優先するべきです。索引は、目次と似て非なるナビゲーション補助機能で、コンテンツの重要な領域へのリンクのリストです。

    +
    + +
    複数のページにまたがるトピックにリンクするにはどうすればよいですか?
    +
    +

    トピックにページ範囲が含まれている場合は、範囲全体にタグを付け、最初のページにリンクします。

    + + 
    <a href="c02.xhtml#pg49" aria-label="49 to 51">49–51</a>
    + +

    最初のページと最後のページにリンクしたり、範囲を分割して個々のページにリンクしたりすることは避けてください。索引エントリーの意味は十分に確立されているため、範囲を一連のページにすると、特に句読点を読み上げない支援技術を使用している場合は、議論の範囲について読者を混乱させる可能性があります。

    + +

    ユーザーが範囲の終わりに到達したことを判断できるように、テキストにページ区切りマーカーを含めるようにしてください。

    +
    +
    +
    + +
    +

    解説

    + +

    索引のアルファベット順および数字順に関連するエントリー間のナビゲーションを容易にするには、ネストされたsection要素を使用します。多くの索引には、エントリーセット間の見出しとして数字または文字が含まれていますが、これらが存在しないか必要でない場合は、囲んでいるセクションのaria-label属性に数字または文字を含めて、支援技術によって読み上げられるようにします。また、明示的または暗黙的な見出しがないと、支援技術ではセクション間を移動する機能が提供されないことがよくあります（純粋にスタイル要素として扱われます）。

    + +

    各セクションのエントリーは、順序なしリストを使用して構造化します。エントリーのアルファベット順の順序は重要ではないためです（たとえば、索引は、情報を失うことなく逆順に並べ替えることができます）。リストを使用すると、支援技術のユーザーは、段落や同様のマークアップを使用した場合のように、一度に 1 つずつ移動する必要がなくなり、リスト項目をジャンプして前後に行き来できます。

    + +

    リストを使用すると、ナビゲーションが簡単になるだけでなく、リスト内の位置が通知されるため、ユーザーは必要に応じて後で同じ場所にすばやく戻ることができます。

    + +

    電子出版物を参照するための最適な方法はまだ進化していますが、多くの出版物では静的なページ区切りマーカーが使用されています。これらは印刷版ソースと一致したものでなければならないわけではなく、索引からの安定した参照を確保するために、純粋にデジタル作品のみにも追加できます。

    +
    + +
    +

    関連リンク

    + + +
    +
    + + From 0163cd0669e9a3cf7bf7ba4c04f4f0407cf1086c Mon Sep 17 00:00:00 2001 From: karen-atdo Date: Mon, 26 Aug 2024 02:58:43 +0000 Subject: [PATCH 16/28] Translate index.html via GitLocalize --- publishing/ja/html/index.html | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) create mode 100644 publishing/ja/html/index.html diff --git a/publishing/ja/html/index.html b/publishing/ja/html/index.html new file mode 100644 index 00000000..a490feb0 --- /dev/null +++ b/publishing/ja/html/index.html @@ -0,0 +1,22 @@ + + + + + HTML（エイチ ティー エム エル） + + + + + + + +
    +
    + + From 4b156e523fe284946776dba6978356bb7f556712 Mon Sep 17 00:00:00 2001 From: Misako Nomura Date: Mon, 26 Aug 2024 02:58:47 +0000 Subject: [PATCH 17/28] Translate MathML.html via GitLocalize --- .../accessibilityFeature/MathML.html | 101 ++++++++++++++++++ 1 file changed, 101 insertions(+) create mode 100644 publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html diff --git a/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html b/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html new file mode 100644 index 00000000..f51e487a --- /dev/null +++ b/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html @@ -0,0 +1,101 @@ + + + + + MathML + + + + + + + +
    +
    +

    定義

    + +

    数式と式が [MathML] でエンコードされていることを識別します。

    +
    + +
    +

    例

    + +
    +
    +
    例 1 — EPUB 3
    +
    + 
    <meta property="schema:accessibilityFeature">
+   MathML
+</meta>
    +
    + +
    +
    +
    Example 2 — EPUB 2
    +
    + 
    <meta name="schema:accessibilityFeature"
+      content="MathML"/>
    +
    + +
    +
    +
    例3 — オーディオブック
    +
    + 
    "accessibilityFeature": ["MathML"]
    +
    +
    + +
    +

    解説

    + +

    The MathML value is used to indicate that the MathML markup language has been used to encode the mathematical equations. For Web-based formats like EPUB, Presentational MathML is used to encode the content as it can be displayed in a growing number of reading systems and browsers.

    + +

    Presentaion MathML には、Content MathML でのみ利用可能な重要な意味情報が欠けていることがよくありますが、支援技術にサポートされており、ユーザーはより簡単にナビゲートしてコンテンツを理解できます。

    + +

    フォールバックの説明が提供される場合、 MathML値は、多くの場合、 describedMath 値とペアになります。

    + +

    See the MathML knowledge base page for more information.

    + +
    +
    +

    円の定義のための MathML 方程式。

    +
    + 
    <math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
+   <mrow>
+      <msup>
+         <mi>x</mi>
+         <mn>2</mn>
+      </msup>
+      <mo>+</mo>
+      <msup>
+         <mi>y</mi>
+         <mn>2</mn>
+      </msup>
+      <mo>=</mo>
+      <msup>
+         <mi>r</mi>
+         <mn>2</mn>
+      </msup>
+   </mrow>
+</math>
    +
    +
    + +
    +

    関連リンク

    + + +
    +
    + + From 1d01e524ab86f0c4148fc059062a25d169331d89 Mon Sep 17 00:00:00 2001 From: mayuhamada Date: Mon, 26 Aug 2024 02:58:49 +0000 Subject: [PATCH 18/28] Translate MathML.html via GitLocalize --- .../ja/metadata/schema.org/accessibilityFeature/MathML.html | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html b/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html index f51e487a..f4e88d08 100644 --- a/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html +++ b/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html @@ -36,7 +36,7 @@

    例

    -
    Example 2 — EPUB 2
    +
    例 2 — EPUB 2
    <meta name="schema:accessibilityFeature"
       content="MathML"/>
    @@ -53,13 +53,13 @@

    例

    解説

    -

    The MathML value is used to indicate that the MathML markup language has been used to encode the mathematical equations. For Web-based formats like EPUB, Presentational MathML is used to encode the content as it can be displayed in a growing number of reading systems and browsers.

    +

    MathML値は、数式のエンコードに MathML マークアップ言語が使用されていることを示すために使用されます。EPUB などの Web ベースの形式では、ますます多くのリーディングシステムやブラウザーで表示できるように、コンテンツをエンコードするために Presentation MathML が使用されます。

    Presentaion MathML には、Content MathML でのみ利用可能な重要な意味情報が欠けていることがよくありますが、支援技術にサポートされており、ユーザーはより簡単にナビゲートしてコンテンツを理解できます。

    フォールバックの説明が提供される場合、 MathML値は、多くの場合、 describedMath 値とペアになります。

    -

    See the MathML knowledge base page for more information.

    +

    詳細については、 MathML ナレッジベース ページを参照してください。

    From a9c686d7ece85b33f8c76d716ff1ef01e100fd29 Mon Sep 17 00:00:00 2001 From: karen-atdo Date: Mon, 26 Aug 2024 02:58:50 +0000 Subject: [PATCH 19/28] Translate none.html via GitLocalize --- .../schema.org/accessibilityFeature/none.html | 72 +++++++++++++++++++ 1 file changed, 72 insertions(+) create mode 100644 publishing/ja/metadata/schema.org/accessibilityFeature/none.html diff --git a/publishing/ja/metadata/schema.org/accessibilityFeature/none.html b/publishing/ja/metadata/schema.org/accessibilityFeature/none.html new file mode 100644 index 00000000..6ded388a --- /dev/null +++ b/publishing/ja/metadata/schema.org/accessibilityFeature/none.html @@ -0,0 +1,72 @@ + + + + + none（アクセシビリティ機能なし） + + + + + + + +
    +
    +

    Definition

    + +

    Indicates that the resource does not contain any accessibility features.

    +
    + +
    +

    Examples

    + +
    +
    +
    Example 1 — EPUB 3
    +
    + 
    <meta property="schema:accessibilityFeature">
+   none
+</meta>
    +
    + +
    +
    +
    Example 2 — EPUB 2
    +
    + 
    <meta name="schema:accessibilityFeature"
+      content="none"/>
    +
    + +
    +
    +
    Example 3 — Audiobooks
    +
    + 
    "accessibilityFeature": ["none"]
    +
    +
    + +
    +

    Explanation

    + +

    The none value is used to indicate that a publication does not include any accessibility features.

    + +

    This value exists so that there is no ambiguity about whether a publication does not contain any accessibility features or whether it was never checked for them.

    +
    + +
    +

    Related Links

    + + +
    +
    + + From b4f61e47828f5b528232d52a3af12d6af2e2db43 Mon Sep 17 00:00:00 2001 From: Misako Nomura Date: Mon, 26 Aug 2024 02:58:51 +0000 Subject: [PATCH 20/28] Translate none.html via GitLocalize --- .../schema.org/accessibilityFeature/none.html | 23 ++++++++++--------- 1 file changed, 12 insertions(+), 11 deletions(-) diff --git a/publishing/ja/metadata/schema.org/accessibilityFeature/none.html b/publishing/ja/metadata/schema.org/accessibilityFeature/none.html index 6ded388a..c6d66a51 100644 --- a/publishing/ja/metadata/schema.org/accessibilityFeature/none.html +++ b/publishing/ja/metadata/schema.org/accessibilityFeature/none.html @@ -17,17 +17,17 @@
    -

    Definition

    +

    定義

    -

    Indicates that the resource does not contain any accessibility features.

    +

    リソースにアクセシビリティ機能が含まれていないことを示します。

    -

    Examples

    +

    例

    -
    Example 1 — EPUB 3
    +
    例 1 — EPUB 3
    <meta property="schema:accessibilityFeature">
    none
@@ -36,7 +36,7 @@ 
    Examples
    
 				
 				
    
 					
    
-						
    Example 2 — EPUB 2
    
+						
    例 2 — EPUB 2
    
 					
    
 					
    <meta name="schema:accessibilityFeature"
       content="none"/>
    
@@ -44,27 +44,28 @@ 
    Examples
    
 				
 				
    
 					
    
-						
    Example 3 — Audiobooks
    
+						
    例3 — オーディオブック
    
 					
    
 					
    "accessibilityFeature": ["none"]
    -

    Explanation

    +

    解説

    The none value is used to indicate that a publication does not include any accessibility features.

    -

    This value exists so that there is no ambiguity about whether a publication does not contain any accessibility features or whether it was never checked for them.

    +

    この値は、出版物にアクセシビリティ機能が含まれていないかどうか、またはアクセシビリティ機能があるかの確認がされていないかどうかについて曖昧さがないようにするために存在します。

    -

    Related Links

    +

    関連リンク

    From 292e531dec78b0bd5ed6dec4144971355332d374 Mon Sep 17 00:00:00 2001 From: mayuhamada Date: Mon, 26 Aug 2024 02:58:52 +0000 Subject: [PATCH 21/28] Translate none.html via GitLocalize --- .../ja/metadata/schema.org/accessibilityFeature/none.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/publishing/ja/metadata/schema.org/accessibilityFeature/none.html b/publishing/ja/metadata/schema.org/accessibilityFeature/none.html index c6d66a51..38c0ce94 100644 --- a/publishing/ja/metadata/schema.org/accessibilityFeature/none.html +++ b/publishing/ja/metadata/schema.org/accessibilityFeature/none.html @@ -53,7 +53,7 @@

    例

    解説

    -

    The none value is used to indicate that a publication does not include any accessibility features.

    +

    none値は、出版物にアクセシビリティ機能が含まれていないことを示すために使用されます。

    この値は、出版物にアクセシビリティ機能が含まれていないかどうか、またはアクセシビリティ機能があるかの確認がされていないかどうかについて曖昧さがないようにするために存在します。

    From cbbebc8133f5a997255683baf6b5ec9b36cd76f6 Mon Sep 17 00:00:00 2001 From: mayuhamada Date: Mon, 26 Aug 2024 02:58:54 +0000 Subject: [PATCH 22/28] Translate index.html via GitLocalize --- publishing/ja/sync-media/index.html | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) create mode 100644 publishing/ja/sync-media/index.html diff --git a/publishing/ja/sync-media/index.html b/publishing/ja/sync-media/index.html new file mode 100644 index 00000000..5c7fdf62 --- /dev/null +++ b/publishing/ja/sync-media/index.html @@ -0,0 +1,22 @@ + + + + + マルチメディアの同期（Synchronized Multimedia） + + + + + + + +
    +
    + + From aae3150f2a65336ef3351adff896926d5c28da0b Mon Sep 17 00:00:00 2001 From: mayuhamada Date: Mon, 26 Aug 2024 02:58:55 +0000 Subject: [PATCH 23/28] Translate highlight.html via GitLocalize --- publishing/ja/sync-media/highlight.html | 97 +++++++++++++++++++++++++ 1 file changed, 97 insertions(+) create mode 100644 publishing/ja/sync-media/highlight.html diff --git a/publishing/ja/sync-media/highlight.html b/publishing/ja/sync-media/highlight.html new file mode 100644 index 00000000..0d6c5931 --- /dev/null +++ b/publishing/ja/sync-media/highlight.html @@ -0,0 +1,97 @@ + + + + + ハイライト（Highlighting） + + + + + + + +
    +
    +

    要約

    + +

    再生中のテキストのハイライトが、テキストの読み取りの邪魔にならないように気をつけます。

    +
    + +
    +

    テクニック

    + + +
    + +
    +

    例

    + +
    +
    +
    例 1 — 背景のハイライトの定義（EPUB 3）
    +
    + + 
    .-epub-overlay-active {
+   background-color: rgb(255,255,220);
+}
    +
    + +
    +
    +
    例 2 — コントラストを向上させるためにデフォルトの色を割り当てる（EPUB 3）
    +
    + + 
    .-epub-overlay-active {
+   color: rgb(0,0,0);
+   background-color: rgb(255,255,0);
+}
    + +
    +
    + +
    +

    よくある質問

    + +
    +
    背景の陰影のみを適用できますか?
    +
    +

    いいえ、アクティブなテキストに任意の CSS プロパティを適用できますが、選択した内容が出版物のアクセシビリティに影響する可能性があることに注意してください。

    +

    また、メディアも考慮してください。フォント サイズを大きくすると、アクティブなテキストが目立ちやすくなるように思えるかもしれませんが、実際の結果では、EPUB のページ上でテキストが飛び回ってしまう可能性があります。たとえば、1 つの段落がフォーカスを失うと、そのテキストサイズは縮小され、次の段落は拡大されるため、レイアウトが「移動」します。また、ページが最初にレンダリングされたときに表示されていたテキストが、新しいハイライトが適用されるとビューポートから押し出される場合もあります。

    +
    +
    +
    + +
    +

    解説

    + +

    再生中にテキストが同期されている場合、どの部分がナレーションされているかがより明確になるようにスタイルを設定することもできます。

    + +
    +

    EPUB 3

    + +

    EPUB 3 では、特別なmedia:active-classプロパティを使用して、パッケージ ドキュメント メタデータ内のアクティブ要素に適用する CSS クラスを定義できます。

    + + 
    <meta property="media:active-class">
+-epub-overlay-active
+</meta>
    + +

    この場合、リーディングシステムは、添付されたすべてのCSSファイルで-epub-overlay-activeというクラスをチェックし、再生中に同期された各要素に定義されているスタイルを適用します。

    + +
    +

    注記

    +

    CSS クラスに使用する名前は重要ではありませんが、わかりやすくするために、クラスの目的を示す名前を付けることをお勧めします。

    +
    +
    +
    +
    + + From 28f2461f1f9d50f2e22586e709eb602c65870559 Mon Sep 17 00:00:00 2001 From: mayuhamada Date: Mon, 26 Aug 2024 02:58:57 +0000 Subject: [PATCH 24/28] Translate lists.html via GitLocalize --- publishing/ja/sync-media/lists.html | 143 ++++++++++++++++++++++++++++ 1 file changed, 143 insertions(+) create mode 100644 publishing/ja/sync-media/lists.html diff --git a/publishing/ja/sync-media/lists.html b/publishing/ja/sync-media/lists.html new file mode 100644 index 00000000..a00c2817 --- /dev/null +++ b/publishing/ja/sync-media/lists.html @@ -0,0 +1,143 @@ + + + + + リスト（Lists） + + + + + + + +
    +
    +

    要約

    + +

    メディア同期形式の書籍内のリスト構造を識別して、同期メディアの再生中のナビゲーションをより良いものにします。

    +
    + +
    +

    テクニック

    + +
      +
    • +seq要素を使用してリストと項目を構造化します。[[WCAG-1.3.1]]
      • +
    • +epub:type属性を使用してseq要素のタイプを識別します。[[WCAG-1.3.1]]
      • +
    +
    + +
    +

    例

    + +
    例１ — 順序付きリストと順序なしリストの比較
    <ul>
+<li>…</li>
+<li>
+  <p>…</p>
+  <p>…</p>
+<li>
+<li>
+  <ol>
+	 <li>…</li>
+  </ol>
+<li>
+</ul>
    <seq epub:type="list">
+<par epub:type="list-item">…</par>
+<seq epub:type="list-item">
+  <par>…</par>
+  <par>…</par>
+</seq>
+<seq epub:type="list-item">
+  <seq epub:type="list">
+	 <par epub:type="list-item">…</par>
+  </seq>
+</seq>
+</seq>
    -->
    + +
    +
    例2 — 定義リストの比較
    + + 
    <dl>
+<dt>…</dt>
+<dd>…</dd>
+
+<dt>…</dt>
+<dt>…</dt>
+<dd>…</dd>
+<dd>
+  <p>…</p>
+  <p>…</p>
+<dd>
+</dl>
    + 
    <seq epub:type="list">
+<seq epub:type="list-item">
+  <par>…</par>
+  <par>…</par>
+</seq>
+<seq epub:type="list-item">
+  <par>…</par>
+  <par>…</par>
+  <par>…</par>
+  <par>…</par>
+  <par>…</par>
+</seq>
+</seq>
    +
    +
    + +
    +

    解説

    + +

    リストのナビゲーションを容易にするために、メディア オーバーレイ ドキュメントは、再生モードを中断することなくユーザーがリストを検出し、回避したり読み飛ばしたりできるようにマークアップする必要があります。

    + +

    オーバーレイ内のリストの基本的なマークアップはリストの種類に関係なく同じですが、HTML5 には対応する必要がある２つの異なる種類のリストが含まれています。

    + +
    +

    順序付きリストと順序なしリスト

    + +

    HTML のolおよびulリスト要素はそれぞれ項目のセットを表し、次のように同様のマークアップをします。

    + +
      +
    • 1 つのseq要素でリスト内のすべての項目を囲みます。このseqには、プロパティlistを指定するepub:type属性が必要です。
      • +
    • 複雑なリスト項目（２つ以上の同期ポイントを含むもの）も、 seq要素を使用して識別する必要があります。これらのseq要素には、プロパティlist-itemを指定するepub:type属性が必要です。リスト項目にサブリストや表などの複雑な構造が含まれている場合は、回避やスキップが可能になるように、それらの構造を適切にマークアップする必要があります。
      • +
    • 単一の同期ポイントのみを含む単純なリスト項目は、プロパティlist itemを指定するepub:type属性を持つpar要素を使用して表すことができます。
      • +
    +
    + +
    +

    定義リスト

    + +

    HTML 定義リスト（ dl要素）は、1 つ以上の名前（ dt要素）を 1 つ以上の値（ dd要素）に関連付けます。オーバーレイ ドキュメントでこれらのリストを作成するときは、次のマークアップ ルールに従う必要があります。

    + +
      +
    • 1 つのseq要素でリスト内のすべての用語と定義を囲む必要があります。このseqには、順序付きリストと順序なしリストと同じプロパティlistを指定するepub:type属性が必要です。
      • +
    • +seq要素は、関連するdtとddペアをすべて囲み、プロパティlist-itemを指定するepub:type属性を含める必要があります。
      • +
    +
    +
    + +
    +

    関連リンク

    + +
    +
    + + From ef82e16910887110053929e08920819c79fcd775 Mon Sep 17 00:00:00 2001 From: mayuhamada Date: Mon, 26 Aug 2024 02:58:59 +0000 Subject: [PATCH 25/28] Translate overlays.html via GitLocalize --- publishing/ja/sync-media/overlays.html | 208 +++++++++++++++++++++++++ 1 file changed, 208 insertions(+) create mode 100644 publishing/ja/sync-media/overlays.html diff --git a/publishing/ja/sync-media/overlays.html b/publishing/ja/sync-media/overlays.html new file mode 100644 index 00000000..09839180 --- /dev/null +++ b/publishing/ja/sync-media/overlays.html @@ -0,0 +1,208 @@ + + + + + メディアオーバーレイ（Media Overlays） + + + + + + + + +
    +
    +

    概要

    + +

    EPUB 3 では、メディアオーバーレイと呼ばれるメディアの同期の実装が定義されています。この仕様では、テキストのレンダリングと音声の再生を同期するためのSMIL文法のプロファイルが定義されています。

    + +

    メディアオーバーレイ ドキュメントは、次の要素を使用して構築されています。

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    要素使用
    smil +smil要素は、各メディアオーバーレイのルート要素であり、オプションのheadと必須のbody要素が含まれます。
    head +head要素には、オプションのmetadata要素にメタデータを含めることができますが、EPUB 3 仕様ではメタデータは必須ではありません。
    metadata +metadata要素は、外部の名前空間からのメタデータをオーバーレイに含めることができる拡張要素です。
    body +body要素は、含まれるseqとpar要素の順序によって再生を定義します。
    seq +seq要素は、オーバーレイを構造化するために使用されます。ユーザーが読み飛ばし、または回避したいセクション、表、リストなどの複雑な構造を表すために使用されます。
    par +par要素は、子のtextやaudio要素内の同期ポイントを定義します。
    text +text要素は、視覚的なレンダリングを同期するコンテンツ ドキュメントと要素を識別します。
    audio +audio要素で、音声ファイルを指定します。オプションで再生の開始点と終了点を指定します。
    + +

    出版物を同期するには、出版物内の各コンテンツ ドキュメントに独自のオーバーレイが関連付けられている必要があります。オーバーレイは、オーバーレイを定義するitemの ID を持つmedia-overlay属性を使用して、パッケージ ドキュメント マニフェスト内のコンテンツ ドキュメントに関連付けられます。

    + +
    + +
    +

    例

    + +
    +
    例 1 — 基本的なオーバーレイ ドキュメント
    + +

    次の例は、見出しと 2 つの段落のみで構成される章のオーバーレイ ドキュメントを示しています。

    + + 
    <smil xmlns="http://www.w3.org/ns/SMIL"
+	  xmlns:epub="http://www.idpf.org/2007/ops"
+	  version="3.0">
+   <body>
+	  <seq
+		   epub:textref="chapter_001.xhtml"
+		   epub:type="bodymatter chapter">
+	  
+		 <par>
+			<text src="chapter_001.xhtml#c01h01"/>
+			<audio
+				   src="audio/c01.mp4"
+				   clipBegin="0:00:00.000" 
+				   clipEnd="0:00:05.250"/>
+		 </par>
+		 
+		 <par>
+			<text src="chapter_001.xhtml#c01p0001"/>
+			<audio
+				   src="audio/c01.mp4"
+				   clipBegin="0:00:05.250"
+				   clipEnd="0:00:58.100"/>
+		 </par>
+		 
+		 <par>
+			<text src="chapter_001.xhtml#c01p0002"/>
+			<audio
+				   src="audio/c01.mp4"
+				   clipBegin="0:00:58.100"
+				   clipEnd="0:02:04.000"/>
+		 </par>
+	  </seq>
+   </body>
+</smil>
    +
    + +
    +
    例 2 — 章のドキュメントをオーバーレイにリンクする
    + + 
    <item id="xchapter_001"
+	  href="chapter_001.xhtml"
+	  media-type="application/xhtml+xml"
+	  media-overlay="chapter_001_overlay"/>
+
+<item id="chapter_001_overlay"
+	  href="chapter_001_overlay.smil"
+	  media-type="application/smil+xml"/>
    +
    +
    + +
    +

    サンプル

    + +

    EPUB サンプル プロジェクトには、メディア オーバーレイを実装する次の出版物が含まれています。

    + + +
    + +
    +

    関連リンク

    + +
    +
    + + From 13df621c59471c6ff66781aca971a4cf3eccbe8d Mon Sep 17 00:00:00 2001 From: mayuhamada Date: Mon, 26 Aug 2024 02:59:00 +0000 Subject: [PATCH 26/28] Translate tables.html via GitLocalize --- publishing/ja/sync-media/tables.html | 104 +++++++++++++++++++++++++++ 1 file changed, 104 insertions(+) create mode 100644 publishing/ja/sync-media/tables.html diff --git a/publishing/ja/sync-media/tables.html b/publishing/ja/sync-media/tables.html new file mode 100644 index 00000000..c2ccf537 --- /dev/null +++ b/publishing/ja/sync-media/tables.html @@ -0,0 +1,104 @@ + + + + + 表（Tables） + + + + + + + +
    +
    +

    要約

    + +

    同期メディア形式の書籍内の表構造を識別して、同期メディアの再生中のナビゲーションをより良いものにします。

    +
    + +
    +

    テクニック

    + +
      +
    • Structure tables, rows, and cells using seq elements. [[WCAG-1.3.1]]
      • +
    • +epub:type属性を使用してseq要素のタイプを識別します。[[WCAG-1.3.1]]
      • +
    +
    + +
    +

    例

    + +
    +

    例 1 — XHTML 表 マークアップと、オーバーレイ 表 マークアップの比較

    + 
    <table>
+   <tr>
+	  <td>
+		 <p>…</p>
+		 <p>…</p>
+	  </td>
+	  <td>…</td>
+	  <td>
+		 <ul>
+			<li>…</lt>
+		 </ul>
+	  </td>
+   </tr>
+</table>
    + + 
    <seq epub:type="table">
+   <seq epub:type="table-row">
+	  <seq epub:type="table-cell">
+		 <par>…</par>
+		 <par>…</par>
+	  </seq>
+	  <par epub:type="table-cell">…</par>
+	  <seq epub:type="table-cell">
+		 <seq epub:type="list">
+			<par epub:type="list-item">…</par>
+		 </seq>
+	  </seq>
+   </seq>
+</seq>
    +
    +
    + +
    +

    解説

    + +

    XHTMLの表が、支援技術を使用するユーザーがナビゲートできるマークアップ構造を提供するのと同様に、メディア オーバーレイ ドキュメントも再生を容易にするためにマークアップを通じて同等の読み飛ばし（skippability）と回避（escapability）の機能を提供する必要があります。

    + +

    この構造は、マークアップ内の対応する行とセルを表すseq要素を使用してオーバーレイに階層化できます。表マークアップをオーバーレイ マークアップに変換する一般的なプロセスは次のとおりです。

    + +
      +
    • 表全体を、epub:type属性でプロパティtableを指定した、１つのseq要素で囲みます。
      • +
    • 表の各行は、epub:type属性でプロパティtable-rowを指定したseq要素を使用して表されます。
      • +
    • 複雑な表セル（2 つ以上の同期ポイントを含むセル）は、epub:type属性で、プロパティtable-cellを指定したseq要素を使用して識別されます。セルにネストされた表やリストなどの複雑な構造が含まれている場合は、その構造を適切にマークアップして、そこからの回避と読み飛ばしが可能になるようにする必要があります。
      • +
    • 単一の同期ポイントのみを含む単純な表セルは、epub:type属性でプロパティtable-cellを指定したpar要素を使用して表すことができます。
      • +
    +
    + +
    +

    関連リンク

    + +
    +
    + + From 4fd226a64d6bf0e4ac407fe2b1da099d664a8725 Mon Sep 17 00:00:00 2001 From: Misako Nomura Date: Mon, 26 Aug 2024 02:59:01 +0000 Subject: [PATCH 27/28] Translate tables.html via GitLocalize --- publishing/ja/sync-media/tables.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/publishing/ja/sync-media/tables.html b/publishing/ja/sync-media/tables.html index c2ccf537..c04ef85b 100644 --- a/publishing/ja/sync-media/tables.html +++ b/publishing/ja/sync-media/tables.html @@ -26,7 +26,8 @@

    要約

    テクニック

      -
    • Structure tables, rows, and cells using seq elements. [[WCAG-1.3.1]]
      • +
    • +seq要素を使用して表、行、セルを構造化します。[[WCAG-1.3.1]]
    • epub:type属性を使用してseq要素のタイプを識別します。[[WCAG-1.3.1]]
    From dfba1b305b3b09ce3a2dc7b0b5b45156debacb8d Mon Sep 17 00:00:00 2001 From: Matt Garrish Date: Mon, 26 Aug 2024 08:39:23 -0400 Subject: [PATCH 28/28] update lang attributes --- publishing/ja/html/images-icons.html | 2 +- publishing/ja/html/images-selection.html | 2 +- publishing/ja/html/images-text-based.html | 2 +- publishing/ja/html/images-text.html | 2 +- publishing/ja/html/index.html | 2 +- publishing/ja/html/indexes.html | 2 +- .../ja/metadata/schema.org/accessibilityFeature/MathML.html | 2 +- .../ja/metadata/schema.org/accessibilityFeature/none.html | 2 +- publishing/ja/metadata/schema.org/accessibilityHazard.html | 2 +- publishing/ja/sync-media/highlight.html | 2 +- publishing/ja/sync-media/index.html | 2 +- publishing/ja/sync-media/lists.html | 2 +- publishing/ja/sync-media/overlays.html | 2 +- publishing/ja/sync-media/tables.html | 2 +- publishing/ja/wcag/dragging-movements.html | 2 +- publishing/ja/wcag/error-identification.html | 2 +- publishing/ja/wcag/error-prevention-all.html | 2 +- publishing/ja/wcag/error-prevention-legal-financial-data.html | 2 +- publishing/ja/wcag/error-suggestion.html | 2 +- publishing/ja/wcag/extended-audio-description-prerecorded.html | 2 +- 20 files changed, 20 insertions(+), 20 deletions(-) diff --git a/publishing/ja/html/images-icons.html b/publishing/ja/html/images-icons.html index b7336569..77f49020 100644 --- a/publishing/ja/html/images-icons.html +++ b/publishing/ja/html/images-icons.html @@ -1,5 +1,5 @@ - + アイコン diff --git a/publishing/ja/html/images-selection.html b/publishing/ja/html/images-selection.html index e0348178..df1f16e8 100644 --- a/publishing/ja/html/images-selection.html +++ b/publishing/ja/html/images-selection.html @@ -1,5 +1,5 @@ - + 画像の選択（Image Selection） diff --git a/publishing/ja/html/images-text-based.html b/publishing/ja/html/images-text-based.html index fbc059ca..276aab85 100644 --- a/publishing/ja/html/images-text-based.html +++ b/publishing/ja/html/images-text-based.html @@ -1,5 +1,5 @@ - + テキストベースの画像（Text-based Images） diff --git a/publishing/ja/html/images-text.html b/publishing/ja/html/images-text.html index 806e42f7..63df187b 100644 --- a/publishing/ja/html/images-text.html +++ b/publishing/ja/html/images-text.html @@ -1,5 +1,5 @@ - + 文字画像（Images of Text） diff --git a/publishing/ja/html/index.html b/publishing/ja/html/index.html index a490feb0..f2446582 100644 --- a/publishing/ja/html/index.html +++ b/publishing/ja/html/index.html @@ -1,5 +1,5 @@ - + HTML（エイチ ティー エム エル） diff --git a/publishing/ja/html/indexes.html b/publishing/ja/html/indexes.html index 1ed86f4d..9bed7aac 100644 --- a/publishing/ja/html/indexes.html +++ b/publishing/ja/html/indexes.html @@ -1,5 +1,5 @@ - + 索引（Indexes） diff --git a/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html b/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html index f4e88d08..36b69dfc 100644 --- a/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html +++ b/publishing/ja/metadata/schema.org/accessibilityFeature/MathML.html @@ -1,5 +1,5 @@ - + MathML diff --git a/publishing/ja/metadata/schema.org/accessibilityFeature/none.html b/publishing/ja/metadata/schema.org/accessibilityFeature/none.html index 38c0ce94..a0c96b5f 100644 --- a/publishing/ja/metadata/schema.org/accessibilityFeature/none.html +++ b/publishing/ja/metadata/schema.org/accessibilityFeature/none.html @@ -1,5 +1,5 @@ - + none（アクセシビリティ機能なし） diff --git a/publishing/ja/metadata/schema.org/accessibilityHazard.html b/publishing/ja/metadata/schema.org/accessibilityHazard.html index 10e58727..5ad7ebc0 100644 --- a/publishing/ja/metadata/schema.org/accessibilityHazard.html +++ b/publishing/ja/metadata/schema.org/accessibilityHazard.html @@ -1,5 +1,5 @@ - + accessibilityHazard（アクセシビリティ上の危険性） diff --git a/publishing/ja/sync-media/highlight.html b/publishing/ja/sync-media/highlight.html index 0d6c5931..1a458a1d 100644 --- a/publishing/ja/sync-media/highlight.html +++ b/publishing/ja/sync-media/highlight.html @@ -1,5 +1,5 @@ - + ハイライト（Highlighting） diff --git a/publishing/ja/sync-media/index.html b/publishing/ja/sync-media/index.html index 5c7fdf62..56274814 100644 --- a/publishing/ja/sync-media/index.html +++ b/publishing/ja/sync-media/index.html @@ -1,5 +1,5 @@ - + マルチメディアの同期（Synchronized Multimedia） diff --git a/publishing/ja/sync-media/lists.html b/publishing/ja/sync-media/lists.html index a00c2817..89956f1a 100644 --- a/publishing/ja/sync-media/lists.html +++ b/publishing/ja/sync-media/lists.html @@ -1,5 +1,5 @@ - + リスト（Lists） diff --git a/publishing/ja/sync-media/overlays.html b/publishing/ja/sync-media/overlays.html index 09839180..c79cb9f9 100644 --- a/publishing/ja/sync-media/overlays.html +++ b/publishing/ja/sync-media/overlays.html @@ -1,5 +1,5 @@ - + メディアオーバーレイ（Media Overlays） diff --git a/publishing/ja/sync-media/tables.html b/publishing/ja/sync-media/tables.html index c04ef85b..5643cb53 100644 --- a/publishing/ja/sync-media/tables.html +++ b/publishing/ja/sync-media/tables.html @@ -1,5 +1,5 @@ - + 表（Tables） diff --git a/publishing/ja/wcag/dragging-movements.html b/publishing/ja/wcag/dragging-movements.html index 2bde69c8..16f9e6b2 100644 --- a/publishing/ja/wcag/dragging-movements.html +++ b/publishing/ja/wcag/dragging-movements.html @@ -1,5 +1,5 @@ - + ドラッグ動作 diff --git a/publishing/ja/wcag/error-identification.html b/publishing/ja/wcag/error-identification.html index 4c35edcf..0af43a54 100644 --- a/publishing/ja/wcag/error-identification.html +++ b/publishing/ja/wcag/error-identification.html @@ -1,5 +1,5 @@ - + エラーの特定 diff --git a/publishing/ja/wcag/error-prevention-all.html b/publishing/ja/wcag/error-prevention-all.html index 0dfa7da5..3ba7a576 100644 --- a/publishing/ja/wcag/error-prevention-all.html +++ b/publishing/ja/wcag/error-prevention-all.html @@ -1,5 +1,5 @@ - + エラー回避（全て） diff --git a/publishing/ja/wcag/error-prevention-legal-financial-data.html b/publishing/ja/wcag/error-prevention-legal-financial-data.html index 4fa4423a..e97e4734 100644 --- a/publishing/ja/wcag/error-prevention-legal-financial-data.html +++ b/publishing/ja/wcag/error-prevention-legal-financial-data.html @@ -1,5 +1,5 @@ - + エラー回避（法的、金融及びデータ） diff --git a/publishing/ja/wcag/error-suggestion.html b/publishing/ja/wcag/error-suggestion.html index e3056192..83f02fc6 100644 --- a/publishing/ja/wcag/error-suggestion.html +++ b/publishing/ja/wcag/error-suggestion.html @@ -1,5 +1,5 @@ - + エラー修正の提案 diff --git a/publishing/ja/wcag/extended-audio-description-prerecorded.html b/publishing/ja/wcag/extended-audio-description-prerecorded.html index 33991c6f..99863611 100644 --- a/publishing/ja/wcag/extended-audio-description-prerecorded.html +++ b/publishing/ja/wcag/extended-audio-description-prerecorded.html @@ -1,5 +1,5 @@ - + 拡張音声解説（収録済み）