要約

ネイティブMathMLマークアップのレンダリングのサポートは増えていますが、サポートシナリオによっては、依然として回避策が必要な場合があります。

テクニック

例1 — ブロックレベルのMathML方程式
<math xmlns="http://www.w3.org/1998/Math/MathML">
   <mfrac>
      <msqrt>
         <mtext>a</mtext>
      </msqrt>
      <mi>b</mi>
   </mfrac>
</math>
例2 — インラインMathML方程式
In the Pythagorean equation,
   <math xmlns="http://www.w3.org/1998/Math/MathML">
      <mrow>
         <msup>
            <mi>a</mi>
            <mn>2</mn>
         </msup>
         <mo>+</mo>
         <msup>
            <mi>b</mi>
            <mn>2</mn>
         </msup>
         <mo>=</mo>
         <msup>
            <mi>c</mi>
            <mn>2</mn>
         </msup>
      </mrow>
   </math>,
   the sum of the square of …
例3 — インラインテキスト数式
If <span role="math">2 + x = 9</span>, what is the value of <var>x</var>?

デモ:

2+x=9の場合、xの値は何ですか?

例4 — 代替テキスト付きの画像

画像が唯一の出力である場合でも、出版者がMathMLマークアップのソースを持っている場合は、それを画像と一緒に(おそらく非表示の)divに保存できます。出版者は、公開するコンテンツで使用する形式を選択できます(つまり、サポートの少ない代替形式を除外します)。また、スクリプトを使用してどちらをレンダリングするかを決定することで、両方の形式を公開することもできます(IE11などの古いユーザーエージェントを考慮する必要がある場合は、hidden属性にCSSフォールバックも必要になる可能性があることに注意してください)。


<div class="mathml-eq">
   <img src="squarerootab.jpg" alt="Square root of the result of a divided by b"/>
   <div hidden="hidden">
      <math xmlns="http://www.w3.org/1998/Math/MathML">
         <mfrac>
            <msqrt>
               <mtext>a</mtext>
            </msqrt>
            <mi>b</mi>
         </mfrac>
      </math>
   </div>
</div>

あるいは、処理やレンダリングへの影響を回避するためにMathMLマークアップをHTMLコメント(<!-- -->)内に隠すこともできます。ただし、後で再処理するときに問題が発生する可能性があります。


<img src="squarerootab.jpg" alt="Square root of the result of a divided by b"/>
<!-- <math xmlns="http://www.w3.org/1998/Math/MathML">
         <mfrac>
            <msqrt>
               <mtext>a</mtext>
            </msqrt>
            <mi>b</mi>
         </mfrac>
      </math> -->

よくある質問

MathMLタグにプレフィックスを付ける必要はありますか?

いいえ、MathMLタグにプレフィックスを使用することはお勧めしません(例:m:math)。

支援技術とユーザーエージェントのすべての組み合わせが XMLを認識するわけではないため、MathMLマークアップをサポートしていても、プレフィックス付きマークアップはサポートされない可能性があります。

HTMLとXHTML構文間の互換性をするためにも、「プレフィックスなし」のタグの使用が推奨されます(XMLプレフィックスはHTMLではサポートされていません)。

MathMLマークアップでARIA mathロールを使用する必要はありますか?

いいえ、MathMLマークアップではmathロールを使用しないことを強くお勧めします。多くの場合、このロールを使用すると、ユーザーがMathMLマークアップにアクセスできなくなります。

mathロールはテキストの数式に制限する必要があります(例3を参照)。

どのように説明文を入れればよいですか?

現在、サポートが不十分なため、説明文については推奨される方法がありません。

alttext属性は説明用ではなく、MathMLがサポートされていない場合にMathMLの代わりに使用することを目的としています。この代替に対するリーディングシステムのサポートは不十分です。

MathML 4では、方程式の発音を改善するためにintent属性が導入されていますが、まだドラフト段階です。

aria-label属性とaria-details属性を使用して説明文を提供することは可能ですが、まだテストが必要です。

実証済みのテクニックが出てきた時点で、このガイドは改訂される予定です。

解説

HTMLでのネイティブMathMLサポートの利点は、マークアップに基づいて音声を提供できることですが、そのような音声を提供できるユーザーエージェントはまだ普及していません。ただし、MathMLは、それをサポートするユーザーエージェントにとっては、依然として最もアクセシブルなオプションを提供します。

MathMLレンダリングのサポートがブラウザで広く普及したため、アクセシブルな数式を提供するための最良の選択肢は MathMLマークアップを使用することです。

数学コンテンツにはMathMLが推奨されますが、単純なインラインテキスト方程式はタグ付けされないことがよくあります(例:"x+y=z")。このような方程式は単純に見えますが、支援技術では多くの場合にすべての記号を読み上げないため、ユーザーが理解するのは困難です。このようなタイプの方程式にMathMLを使用しない場合には、mathのロールを持つ要素内にラップする必要があります(例3を参照)。このロールを使用すると、支援技術は発音モードを切り替えることができます。

注記

EPUBでのMathMLのサポートは、リーディングシステムの古さに大きく依存します。ブラウザーコアを積極的に更新するリーディングシステムは現在MathMLを処理できますが、出版者はしばらくの間、古いリーディングシステムでのコンテンツのレンダリングを考慮する必要があります。

それほど堅牢ではないものの、古いリーディングシステムで動作する可能性が高い解決策は、十分に説明的な代替テキスト付きの数式の画像と、より複雑な数式についての拡張説明を提供することです(例4を参照)。

EPUBでのサポートに関する最新情報については、『EPUBでMathMLを作成するためのベストプラクティス』ガイドを参照してください。

関連リンク