web-dev-qa-db-ja.com

「alt」属性内の単語を強調して句読点にする方法は？

たとえば、かなりの量のテキストを変更する必要がある場合は、言います。 （可能な場合は画像からプレーンテキストに引き出すのが最善だと思います...しかし、物事は必ずしも理想的ではなく、残念なことに...そしてそうでない場合は、一貫性を持たせるのが良いでしょう、信頼できるアプローチ。）

見出し、改行などを強調したい場合があります。

私は人間（スクリーンリーダーなどを使用）と検索エンジンの両方で最高の読書を考えています。目が見える人のための最適化は十分に簡単です-アスタリスク、または他の視覚的な句読点、空白などを使用できます...

** HEADLINE **  
I would really like to know how to 
properly *emphasize* things in alt-texts.

And how about line breaks and whitespace?

<Latest specials are here>

しかし、それはどのようにして検索エンジンに伝わりますか？スクリーンリーダーに？この種のこと、つまり人々/ Googleが理解している慣習の共通言語に関するベストプラクティスはありますか？

seohtmlaccessibilityalt-attribute
1
Aaron Wallentine

代替テキストをスタイルできます。代替テキストを太字にしたり、背景を追加したり、色を変更したりできます。改行を追加することもできます。一部の単語を太字にしたり、一部の単語を通常にしたりすることは不可能だと思いますが、解決策があれば、それも持ちたいと思います。

以下に例を示します。

<img src="foo.jpg" alt="Line 1
Line 2" />
<br><br>
<img src="foo.jpg" alt="someText" style="color:#54C5D0; font-weight: bold;" src="IMG_URL"/> 
<br><br>
<div style="color:#54C5D0;font-weight:bold">
<img src="foo.jpg" alt="line1
line2" style="border:1px solid #aaeedd" src="IMG_URL"/> 
</div> 
        <style>img{white-space:pre}</style>

http://jsfiddle.net/o3keo9bp/

2
Michael d

テキスト（*…*、**…**、__…__、(!!)など）を使用することは別として、ユーザーが理解する場合としない場合（または画面で読み上げる場合もある）読者）、方法はありません。

複雑な代替説明がある場合、alt属性は適切なソリューションではありません。 longdesc属性、figureでfigcaptionを使用する、または（imgの代わりに）object要素を使用します。 この回答の例

1
unor