使いまわしに気をつけよう / 環境省「国民のみなさまへ」のaltに書かれた文字列の謎

2012/08/11ネットの噂, フェイクニュース


8月10日に環境大臣から出された「国民のみなさまへ | 環境省」という文書。手書きでもないのになんで縦書き画像なんだよ、とかいろいろ気になる点はあるのですが、最近の話題はHTMLソースの中のALTに書かれた文章。

追記:8月13日に修正されたようです。現在はこの文言はありません。このミスを陰謀と結び付けてる人もいるようで、頭痛いです。



「お手紙」の下の「ご意見ご要望をお寄せください」の部分。ここも文章が画像になっててアレなんだけど、そこのalt属性にこう書かれている。

“「みんなの力でがれき処理」を応援いただける方は、下記の必須事項を記入して、応援します!ボタンを押してください。”

なんじゃこれは?である。


[code lang="html"]
<p class="lead">
<img src="images/tit.gif" alt="「みんなの力でがれき処理」を応援いただける方は、下記の必須事項を記入して、応援します!ボタンを押してください。" width="268" height="24">
</p>
[/code]
国民のみなさまへ | 環境省



つい最近、HTMLを使いまわしてalt属性が不一致になった例を見かけたので(ず’s 将棋 » 第23期女流王位表彰式写真の謎)、これも同じような問題だろうと思って探してみたら、「広域処理情報サイト 【環境省】 -津波による災害廃棄物処理を全国で-」が見つかった。

該当部分にまったく同じ文言が書かれている。左図と上図を見くらべると、選択できる項目も一緒で、どうやらこれを使いまわした節がある。


この部分の前後の差分(diff -u)を取ってみた。画像・画像サイズの置き換えが主で、そのほかの部分にはほとんど手が入っていない。“<!– 0311追加箇所 –>” というコメントもそのままだ。

[code lang="html"]
+&lt;div id=&quot;content&quot;&gt;

– &lt;p class=&quot;lead&quot;&gt;&lt;img src=&quot;images/text_00.gif&quot; alt=&quot;「みんなの力でがれき処理」を応援いただける方は、下記の必須事項を記入して、応援します!ボタンを押してください
。&quot; width=&quot;717&quot; height=&quot;14&quot;&gt;&lt;/p&gt;
+ &lt;p class=&quot;lead&quot;&gt;&lt;img src=&quot;images/tit.gif&quot; alt=&quot;「みんなの力でがれき処理」を応援いただける方は、下記の必須事項を記入して、応援します!ボタンを押してください。&quot;
width=&quot;268&quot; height=&quot;24&quot;&gt;&lt;/p&gt;

&lt;form method=&quot;post&quot; action=&quot;index.php&quot;&gt;
&lt;dl&gt;
– &lt;dt&gt;&lt;img src=&quot;images/h3_01.gif&quot; alt=&quot;ニックネーム&quot; width=&quot;100&quot; height=&quot;34&quot;&gt;&lt;/dt&gt;
– &lt;dd class=&quot;text&quot;&gt;&lt;input type=&quot;text&quot; name=&quot;name&quot;&gt;&amp;nbsp;&amp;nbsp;&lt;img src=&quot;images/text_01.gif&quot; alt=&quot;必須&quot; width=&quot;44&quot; height=&quot;34&quot;&gt;&lt;/dd&gt;
– &lt;dt&gt;&lt;img src=&quot;images/h3_02.gif&quot; alt=&quot;都道府県&quot; width=&quot;100&quot; height=&quot;34&quot;&gt;&lt;/dt&gt;
+ &lt;dt&gt;&lt;img src=&quot;images/h3_01.gif&quot; alt=&quot;ニックネーム&quot; width=&quot;78&quot; height=&quot;32&quot;&gt;&lt;/dt&gt;
+ &lt;dd class=&quot;text&quot;&gt;&lt;input type=&quot;text&quot; name=&quot;name&quot; maxlength=&quot;20&quot;&gt;&amp;nbsp;&amp;nbsp;&lt;img src=&quot;images/text_01.gif&quot; alt=&quot;必須&quot; width=&quot;44&quot; height=&quot;34&quot;&gt;&lt;/dd&gt;
+ &lt;dt&gt;&lt;img src=&quot;images/h3_02.gif&quot; alt=&quot;都道府県&quot; width=&quot;78&quot; height=&quot;32&quot;&gt;&lt;/dt&gt;
&lt;dd&gt;
&lt;select id=&quot;area&quot; name=&quot;area&quot; class=&quot;selectable&quot;&gt;
&lt;optgroup label=&quot;北海道&quot;&gt;
@@ -130,33 +196,66 @@
&lt;/select&gt;&amp;nbsp;&amp;nbsp;&lt;img src=&quot;images/text_01.gif&quot; alt=&quot;必須&quot; width=&quot;44&quot; height=&quot;34&quot;&gt;
&lt;/dd&gt;
&lt;!– 0311追加箇所 –&gt;
– &lt;dt&gt;&lt;img src=&quot;images/h3_04.gif&quot; alt=&quot;年齢&quot; width=&quot;100&quot; height=&quot;34&quot;&gt;&lt;/dt&gt;
+ &lt;dt&gt;&lt;img src=&quot;images/h3_04.gif&quot; alt=&quot;年齢&quot; width=&quot;78&quot; height=&quot;32&quot;&gt;&lt;/dt&gt;
[/code]


ということで、この件はHTMLを使いまわしたときに画像だけを差し替えて alt属性までは手が回らなかった(仕様になかった?)ために発生したのだと思われます。

目の不自由な方のための音声読み上げブラウザ等に配慮してalt属性に適切な文字を入れるべきなんだけど、使いまわしたときにチェック漏れしやすいんですよねえ。まあ、配慮を考えるなら、そもそも「みなさまへのお手紙」が画像でどこにもテキストが無いのが一番問題なんですけどね…


追記:本件について “担当した大手広告代理店”云々というtweetがあるんですが、本当かなあ?。Web界隈は比較的新しい分野なので、必ずしも大手や広告代理店が受注してるとも限らないように思うのですが。どなたかご存知の方はいらっしゃいますか?


リンク: