web-dev-qa-db-ja.com

どのHTML5タグがお金に適していますか?

価格、金額、または口座残高を表すためにこれらの HTML5タグ を適切に選択する必要がある場合(例:3/9/2012 - Income: 1.200,00 €またはitem #314159 - price: $ 31,99

  • 金額にどのタグを選択しますか、またその理由は何ですか。
  • 通貨も独自のタグでラップする必要がありますか?

<span class="income">1.200,00 €</span><span class="price">$ 31,99</span>のような一般的なインライン要素は避けたいのですが、これまでのところ、それに関する参照はありません。

33

varのHTML仕様 は次のように述べています。

Var要素は変数を表します。これは、数式またはプログラミングコンテキストの実際の変数、定数を表す識別子、関数パラメーター、または単に散文のプレースホルダーとして使用される用語である可能性があります。

私にとって、これは<var>が例の価格に適していないことを意味します。それはあなたが達成しようとしていることに依存しますが、あなたの選択肢は次のようです:

  1. 製品の価格については、microdata( ref )を使用します(例 Schema.orgのoffer vocabulary )。
  2. 重要性を示さずに価格に注意を向けたい場合は<b>を使用します( ref
  3. アイテム化されたレシートの合計価格など、価格が重要な場合は<strong>を使用します
  4. 価格のスタイルを変える要素が必要な場合は、クラスで<span>を使用しますが、<b><strong>は適切ではありません
  5. 上記のどれも適切ではなく、価格をスタイル設定したくない場合は、何もしないでください

あなたが与えた例から、価格を値上げする必要はないようです。例が財務情報を表示するための表からのものである場合、アクセシビリティーのために、それらがそれぞれ<th scope="col">Income</th>または<th scope="col">Price</th>という見出しの列にあることを確認してください。

お役に立てば幸いです。

32
Oli Studholme

HTML5仕様 を見ると、価格がセマンティックエンティティであると見なされていないことは明らかです。そして、私は同意します。次のように考えてください。

意味要素があった場合、これは結果になります

<p>
   I have 4 apples, 2 oranges and <money>5 <currency>dollars</currency></money>.
</p>

5ドルと2オレンジの違いは何ですか? <fruit>タグも?

金額にどのタグを選びますか、またその理由は何ですか。

CSSを追加する場合は、spanclassを使用します。
セマンティクスをあまり気にしないため。ありがたいですが、実際には重要なのはスタイリングです。

通貨も独自のタグでラップする必要がありますか?

絶対にありません。

私は本当に一般的なインライン要素を避けたいです

どうして?

<i>「お金の特別な性質」を表現したい場合。

I要素は、代替音声または気分でのテキストのスパンを表すか、そうでなければ通常の散文から異なるテキスト品質を示す方法でオフセットします。 ...
http://dev.w3.org/html5/spec/the-i-element.html

14

<data>

<p>The price is <data class="money" value="100.00">$100</data>.</p>

HTML5仕様 によると:

data要素は、value属性内のそれらのコンテンツの機械可読形式とともに、そのコンテンツを表します。

要素は、microformatsまたはmicrodataと組み合わせると、データプロセッサ用の機械可読値と、Webブラウザでのレンダリング用の人間可読値の両方を提供します。この場合、value属性で使用されるフォーマットは、使用中のmicroformatsまたはmicrodataボキャブラリによって決定されます。

この場合、 microdata を使用して、通貨の種類などの追加情報を追加することもできます。

9
jackvsworld

var以上のセマンティックスを見ることができません。

<var>1.200,00 <abbr title="EUR">€</abbr></var>
2
Alix Axel

ここでは 定義リスト を使用します。

HTML要素(またはHTML説明リスト要素)は、用語と説明のペアのリストを囲みます。この要素の一般的な用途は、用語集を実装するか、メタデータ(キーと値のペアのリスト)を表示することです。

<dl>
   <dt>Income:</dt>
   <dd>1.200,00 €</dd>
   <dt>Price:</dt>
   <dd>$31,99</dd>
</dl>
2
net.uk.sweet