顔文字、ASCIIアートがスクリーンリーダーなどの読み上げで大変なことになることはお察しのとおりかと思いますが、これらをアクセシブルにするための代替テキストの提供方法がW3Cの以下のドキュメントにまとめられています。
と、いいつつも、実はこれから紹介する方法はブラウザ、スクリーンリーダーなどの支援機器が充分にサポートしていないようです。現時点では、アクセシビリティを確保するためには、ASCIIアート、顔文字を使わないほうがよいようです。
というわけですので、以下はあくまで参考情報として紹介します。
目次
顔文字
例1 隣接する位置に説明するテキストを配置
ASCIIアートや顔文字のすぐ隣にそれを説明するテキストを配置します。
=8-0（恐怖）
上の事例では、
「=8-0」部分がそのまま読まれてしまいますので、この部分がユーザーの混乱を招く恐れもありそうですが、必要最低限の措置としては有効かもしれません。
例2 abbr要素のtitle属性を使用する
省略語を表すabbr要素のtitle属性を使用します。
<abbr title="恐怖">=8-0</abbr>
title属性の読み上げに対応している機器やアプリケーションが十分でないようです。また、abbr要素は略語をマークアップするための要素なので、abbr要素の本来の使い方から外れてしまっている問題もあります。
参考
例3 画像化し、img要素のalt属性を使用する
顔文字を画像化してしまい、img要素のalt属性を使用する事例です。
<img src="fright.gif" alt="恐怖"/>
画像化してしまっては、あえてテキストで絵的に表現する意味が失われてしまいますが、alt属性をサポートするブラウザやアプリケーションは多いため、有効な方法です。
ASCIIアート
事例4 スキップリンク
さし絵：蝶のASCIIアート
<a href="#skipbutterfly">ASCIIアートをスキップ</a>
LLLLLLLLLLL
__LLLLLLLLLLLLLL
LLLLLLLLLLLLLLLLL
_LLLLLLLLLLLLLLLLLL
LLLLLLLLLLLLLLLLLLLL
_LLLLLLLLLLLLLLLLLLLLL
LLLLLLLLLLLLLLLLLLLLLL
L _LLLLLLLLLLLLLLLLLLLLLLL
LL LLLLLL~~~LLLLLLLLLLLLLL
_L _LLLLL LLLLLLLLLLLLL
L~ LLL~ LLLLLLLLLLLLL
LL _LLL _LL LLLLLLLL
LL LL~ ~~ ~LLLLLL
L _LLL_LLLL___ _LLLLLL
LL LLLLLLLLLLLLLL LLLLLLLL
L LLLLLLLLLLLLLLL LLLLLL
LL LLLLLLLLLLLLLLLL LLLLL~
LLLLLLLL_______ L _LLLLLLLLLLLLLLLL LLLLLLLL
~~~~~~~LLLLLLLLLLLLLLLLLLLLLLLLL~ LLLLLL
______________LLL LLLLLLLLLLLLLL ______LLLLLLLLL_
LLLLLLLLLLLLLLLLLLLL LLLLLLLL~~LLLLLLL~~~~~~ ~LLLLLL
___LLLLLLLLLL __LLLLLLLLLLLLL LLLLLLLLLLLLL____ _LLLLLL_
LLLLLLLLLLL~~ LLLLLLLLLLLLLLL LLLLLLLLLLLLLLLLLL ~~~LLLLL
__LLLLLLLLLLL _LLLLLLLLLLLLLLLLL_ LLLLLLLLLLLLLLLLLL_ LLLLL
LLLLLLLLLLL~ LLLLLLLLLLLLLLLLLLL ~L ~~LLLLLLLLLLLLL LLLLLL
_LLLLLLLLLLLL LLLLLLLLLLLLLLLLLLLLL_ LL LLLLLLLLL LLLLLLLLL
LLLLLLLLLLLLL LLLLLLLLLLLLL~LLLLLL~L LL ~~~~~ ~LLLLLL
LLLLLLLLLLLLLLL__L LLLLLLLLLLLL_LLLLLLL LL_ LL_ _ LLLLLL
LLLLLLLLLLLLLLLLL~ ~LLLLLLLL~~LLLLLLLL ~L ~LLLL ~L LLLLLL~
LLLLLLLLLLLLLLLL _LLLLLLLLLL LL LLLLLLL___ LLLLLLLLLL
LLLLLLLLLLLLLLLL LL~LLLLLLLL~ LL LLLLLLLLLLLL LLLLLLL~
LLLLLLLLLLLLLLLL_ __L _L LLLLLLLL LLL_ LLLLLLLLLLLLLLLLLLLLL
LLLLLLLLLLLLLLLLLLLL L~ LLLLLLLL LLLLLLL~LLLLLLLLLLLLLLLL~
LLLLLLLLLLLLLLLLLLLL___L_ LL LLLLLLL LLLL LLLLLLLLLLLLLL
~~LLLLLLLLLLLLLLLLLLLLLLLL LLLLL~ LLLLL ~~~~~~~~~
LLLLLLLLLLLLLLLLLL_ _ LLL _LLLLL
~~~~~~LLLLLLLLLL~ LLLLLL
LLLLL _LLLLLL
LLLLL L L LLLLLLL
LLLLL__LL _L__LLLLLLLL
LLLLLLLLLL LLLLLLLLLLLL
LLLLLLLLLLLLLLLLLLLLLL
~LLLLLLLLLLLLLLLLL~~
LLLLLLLLLLLLL
~~~~~~~~~
<a name="skipbutterfly></a>
こういうやる夫系はどうするんだろう・・・・。
＿＿＿_ ／ ＼ ／ _ノ ヽ､_ ＼ ／ oﾟ(（●）) (（●）)ﾟo ＼ ほんとはVIPでやりたいんだお… | （__人__） | ＼ ｀ ⌒´ ／ ＿＿＿_ ／ ＼ ／ _ノ ヽ､_ ＼ ／ oﾟ⌒ ⌒ﾟo ＼ でもVIPPERはクオリティ高いスレしか相手してくれないお･･･ | （__人__） | ＼ ｀ ⌒´ ／ ＿＿＿_ ／⌒ ⌒＼ ／（ ●） （●）＼ ／::::::⌒（__人__）⌒::::: ＼ だからニュー速でやるお! | |r┬-| | ＼ `ー'´ ／
参考
例5 画像化し、img要素のalt属性を使用する
ASCIIアートを画像化してしまい、img要素のalt属性を使用する事例です。
<img src="yaruo.gif" alt="だからニュー速でやるお！と言っているやる夫"/>
画像化してしまっては、あえてテキストで絵的に表現する意味が失われてしまいますが、alt属性をサポートするブラウザやアプリケーションは多いため、有効な方法です。
（2014/12/6追記）例6 figure要素とWAI-ARIAのrole属性を使う
WAI-ARIAのrole属性を解釈できるユーザーエージェントであれば、ASCIIアートを画像に相当するものであると、解釈させることもできるようです。
詳細は、@momdo_ さんの以下のブログをご参照ください。
関連エントリ
ウェブアクセシビリティガイドラインについて
代替テキスト
リンクのはり方
- リンク先を別ウィンドウ（タブ）で表示させることはアクセシビリティ上どうなのか。
- アクセシビリティに配慮したリンクのはり方とは（その1）–リンクテキストとリンクの配置–
- アクセシビリティに配慮したリンクのはり方とは（その2）- リンクのみせ方 –
- アクセシビリティに配慮したリンクのはり方とは（その3）–画像を用いたリンク–