gooブログのモバイル表示
先月「ブログサービスを提供している会社の方へのお願い： モバイル表示でのalt属性機能追加」という記事で書いたように、gooブログをモバイル表示させると記事中の画像に「alt属性」によって指定した代替テキストがiPhone/iPadのVoiceOverという読み上げ機能で読み上げられないという問題がありました。
ブログでこのことを書くとともに、gooブログのサポートに質問＆依頼をしたところ、この問題を解決していただきましたのでお知らせします。gooブログ事務局そしてサポート・エンジニアのみなさま、ありがとうございました。
以下、次のブログ記事を例にとってどのような改善が行われたのか説明させていただきます。
宇宙の形、ガウスの曲面論と内在幾何（第１回）
http://blog.goo.ne.jp/ktonegaw/e/80515a1627564b9d4f52883a270dc738
![PC表示した画像の箇所]()
この記事の画像には「alt属性」を使って代替テキストが埋め込んであります。PC表示したページのソースを見ると、次のように埋め込まれていることがわかります。
![PC表示した画像の箇所のソース]()
このページをモバイル表示させ、同じ場所のソースを見ると次のように代替テキストが抜け落ちてしまっていました。赤い文字で示した場所のことです。
![モバイル表示した画像の箇所のソース：問題解決前]()
今回、問題を解決していただいた結果、同じ箇所を表示させると次のように代替テキストが埋め込まれていることがわかります。VoiceOver機能でこの部分がちゃんと読み上げられることを確認しました。
![モバイル表示した画像の箇所のソース：問題解決後]()
ただし次の問題が残ってますが、最初の２つはgooブログのモバイル表示の問題ではなくHTMLのページの仕様、VoiceOverでどの部分を読み上げさせるかという問題なのだと思います。
問題１： 今回の改善では「title属性」で指定した文字列サポートしない。
回答いただいたgoo事務局からのご説明によるとモバイル表示で「title属性」はサポートしないということです。次のページの説明を見る限り、これは妥当な判断だと思います。
[HTML5]title属性の使い方から考えるコンテンツの意味と提供方法
http://webcre8.jp/think/html-attribute-title.html
問題２： 「alt属性」による代替テキストが指定されない場合、画像の長いURLが読み上げられてしまい、視覚障がい者の可読性の妨げになっている。
「alt属性」による代替テキストが指定されない場合とは「alt=""」と指定するのではなくalt属性がそもそも記述されていない状況のことを指します。
これは正しい仕様だと思います。「alt属性」による代替テキストが指定されない場合はリンク先の画像のURL+ファイル名が読み上げられるべきです。問題の本質はgooブログで画像のURLが長すぎるということです。各画像のURLに「短縮URLオプション」などで機能強化すれば、この問題は解決できると思います。
またはVoiceOverの仕様変更という選択肢も考えられます。読み上げる対象が画像ファイルであることがわかっている場合、そしてそれが非常に長いURL、ファイル名のときは読み上げを「イメージファイル名です。」のように省略するという方法が考えられます。（これは画像ファイルだけでなく一般的に長すぎるURLすべてについて言えることだと思います。）
問題３： gooブログ記事トップの画像には「alt属性」による代替テキストが指定できないので、画像の長いURLが読み上げられてしまう。
トップ画像についても「alt属性」による代替テキストが指定できるようになれば問題は解決します。これは現在、PC表示でもモバイル表示でも共通している問題です。
gooブログで記事を書いている皆様へ
今回の機能改善によってgooブログのアクセシビリティが向上しました。ただし、これが活かされるかどうかは、ブログをお書きになっている皆様の意識次第です。せっかく利用できるようになった機能ですから、積極的に活用していただけるとうれしいです。
今回の機能改善は、もともとTwitterで３年ほど前から相互フォローさせていただいている @s_Yanasy さんからの連絡がきっかけでした。彼は全盲の数学を専攻している大学2年生です。
また相互フォローさせていただいている @kazuhito さんにはこの記事を書いていただき、技術的なことを教えていただきました。ありがとうございました。
微力ではありますが、アクセシビリティ改善のお手伝いをすることができてよかったと思っています。
関連記事：
ブログサービスを提供している会社の方へのお願い： モバイル表示でのalt属性機能追加
http://blog.goo.ne.jp/ktonegaw/e/808f5d358a352a9295f6ec87b75b2ebc
視覚障害者が読める理数系書籍や学習環境について（リンク集）
http://blog.goo.ne.jp/ktonegaw/e/4eff04be772bb5d20f62a886c2502a5f
ブログ執筆のはげみになりますので、１つずつ応援クリックをお願いします。
![にほんブログ村 科学ブログ 物理学へ]()
![人気ブログランキングへ]()
![]()
![]()
![]()
![]()
![]()
先月「ブログサービスを提供している会社の方へのお願い： モバイル表示でのalt属性機能追加」という記事で書いたように、gooブログをモバイル表示させると記事中の画像に「alt属性」によって指定した代替テキストがiPhone/iPadのVoiceOverという読み上げ機能で読み上げられないという問題がありました。
ブログでこのことを書くとともに、gooブログのサポートに質問＆依頼をしたところ、この問題を解決していただきましたのでお知らせします。gooブログ事務局そしてサポート・エンジニアのみなさま、ありがとうございました。
以下、次のブログ記事を例にとってどのような改善が行われたのか説明させていただきます。
宇宙の形、ガウスの曲面論と内在幾何（第１回）
http://blog.goo.ne.jp/ktonegaw/e/80515a1627564b9d4f52883a270dc738
この記事の画像には「alt属性」を使って代替テキストが埋め込んであります。PC表示したページのソースを見ると、次のように埋め込まれていることがわかります。
このページをモバイル表示させ、同じ場所のソースを見ると次のように代替テキストが抜け落ちてしまっていました。赤い文字で示した場所のことです。
今回、問題を解決していただいた結果、同じ箇所を表示させると次のように代替テキストが埋め込まれていることがわかります。VoiceOver機能でこの部分がちゃんと読み上げられることを確認しました。
ただし次の問題が残ってますが、最初の２つはgooブログのモバイル表示の問題ではなくHTMLのページの仕様、VoiceOverでどの部分を読み上げさせるかという問題なのだと思います。
問題１： 今回の改善では「title属性」で指定した文字列サポートしない。
回答いただいたgoo事務局からのご説明によるとモバイル表示で「title属性」はサポートしないということです。次のページの説明を見る限り、これは妥当な判断だと思います。
[HTML5]title属性の使い方から考えるコンテンツの意味と提供方法
http://webcre8.jp/think/html-attribute-title.html
問題２： 「alt属性」による代替テキストが指定されない場合、画像の長いURLが読み上げられてしまい、視覚障がい者の可読性の妨げになっている。
「alt属性」による代替テキストが指定されない場合とは「alt=""」と指定するのではなくalt属性がそもそも記述されていない状況のことを指します。
これは正しい仕様だと思います。「alt属性」による代替テキストが指定されない場合はリンク先の画像のURL+ファイル名が読み上げられるべきです。問題の本質はgooブログで画像のURLが長すぎるということです。各画像のURLに「短縮URLオプション」などで機能強化すれば、この問題は解決できると思います。
またはVoiceOverの仕様変更という選択肢も考えられます。読み上げる対象が画像ファイルであることがわかっている場合、そしてそれが非常に長いURL、ファイル名のときは読み上げを「イメージファイル名です。」のように省略するという方法が考えられます。（これは画像ファイルだけでなく一般的に長すぎるURLすべてについて言えることだと思います。）
問題３： gooブログ記事トップの画像には「alt属性」による代替テキストが指定できないので、画像の長いURLが読み上げられてしまう。
トップ画像についても「alt属性」による代替テキストが指定できるようになれば問題は解決します。これは現在、PC表示でもモバイル表示でも共通している問題です。
gooブログで記事を書いている皆様へ
今回の機能改善によってgooブログのアクセシビリティが向上しました。ただし、これが活かされるかどうかは、ブログをお書きになっている皆様の意識次第です。せっかく利用できるようになった機能ですから、積極的に活用していただけるとうれしいです。
今回の機能改善は、もともとTwitterで３年ほど前から相互フォローさせていただいている @s_Yanasy さんからの連絡がきっかけでした。彼は全盲の数学を専攻している大学2年生です。
また相互フォローさせていただいている @kazuhito さんにはこの記事を書いていただき、技術的なことを教えていただきました。ありがとうございました。
微力ではありますが、アクセシビリティ改善のお手伝いをすることができてよかったと思っています。
関連記事：
ブログサービスを提供している会社の方へのお願い： モバイル表示でのalt属性機能追加
http://blog.goo.ne.jp/ktonegaw/e/808f5d358a352a9295f6ec87b75b2ebc
視覚障害者が読める理数系書籍や学習環境について（リンク集）
http://blog.goo.ne.jp/ktonegaw/e/4eff04be772bb5d20f62a886c2502a5f
ブログ執筆のはげみになりますので、１つずつ応援クリックをお願いします。
