ベストアンサー

読み上げの音声ブラウザに親切なHPの作り方。

2007/10/09 14:21

読み上げソフトはhtmlを上から読み上げるため、目の不自由な人が閲覧しやすいように、知りたい内容が一番最初に読み上げられるように、ヘッダーやメニューを下のほうのhtmlに書き、コンテンツをbodyのすぐ後ろに書いて構築していきたいと思ってます。レイアウトをCSSでやる場合、position:absolute;を使ってヘッダーやメニューやコンテンツの配置を決めてあげるのが一般的な方法なのでしょうか？このようなやり方をすると、IEでもSAFARIでも同じように見えるように作りこむのが、私には難しく、もっといい方法があるのではないかと思い質問しました。また参考になるＨＰがあれば教えてください。よろしくお願いいたします。

dream_cats
お礼率68% (26/38)

HTML
回答数5
ありがとう数2

みんなの回答 （5）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

神崎渉瑠（@taloo）
ベストアンサー率44% (1016/2280)

2007/10/10 18:15 回答No.4

位置指定はpositionとfloat、それにせいぜいmarginなどを併用するしか方法はありません。細心の注意を支払うことで、どんなブラウザで見ても綺麗な表示のページになります。 > 私には難しく、もっといい方法があるのではないかと思い質問しました。残念ながら、がんばってくださいとしか言いようがないですね(^^; スタイルシートで出来なければ、音声・テキストブラウザ用とそれ以外のブラウザ用の2種類、そのなかで<noscript>などを使用するほうが簡単だと思います。最低限のヘッダは最初に書いておいた方が良いと思います。そのページの内容がわかりますし、間違えて入ってきたページかどうかの判断もそこでできます。私が音声ブラウザ対応ページを作る場合は、主にページタイトルとパンくずリストにしてます。ページタイトルを見て（聞いて）間違えた場合は次に読まれるパンくずリストを使ってすぐに戻ってもらえますから。

質問者

お礼 2007/10/12 11:57

回答有り難うございます。＞私が音声ブラウザ対応ページを作る場合は、主にページタイトルとパンくずリストにしてます。パンくずリストという言葉をはじめて聞きましたが、どういうことでしか？教えていただけたらうれしいです。

ログインすると、全ての回答が全文表示されます。

その他の回答 (4)

神崎渉瑠（@taloo）
ベストアンサー率44% (1016/2280)

2007/10/12 14:27 回答No.5

OKWaveコミュニティー > [技術者向] コンピューター > プログラミング > HTML 現在地を示す↑これです。英語ではtopic pathと言います。

質問者

お礼 2007/10/12 15:59

あーこれをパンくずリストというのですね。有り難うございます。

ログインすると、全ての回答が全文表示されます。

suzuko
ベストアンサー率38% (1112/2922)

2007/10/10 10:17 回答No.3

ご質問への直接の回答ではありませんが、参考URLの「aDesigner」は検証するには最適ですよ。ご存じかも知れませんが。

参考URL：: http://www.research.ibm.com/trl/projects/acc_tech/adesigner.htm

ログインすると、全ての回答が全文表示されます。

taketan_mydns_jp
ベストアンサー率58% (450/773)

2007/10/10 08:59 回答No.2

#1です。なぜか</body>と</script>タグが入れ替わってしまいました。修正して下さい。

ログインすると、全ての回答が全文表示されます。

taketan_mydns_jp
ベストアンサー率58% (450/773)

2007/10/10 08:58 回答No.1

読み上げブラウザについては詳しくありませんが、JavaScriptを使うと無視されるので、こんな感じでやることも出来るのではないでしょうか。 <body> <div id="header"></div> <div id="menu"></div> <div id="contents">ここに本文が来ます。</div> <div id="copies" style="display:none"> <p>以下、ヘッダー部分です。</p> <div id="header_copy">ヘッダー部分</div> <p>以下。メニュー部分です。</p> <div id="menu_copy">メニュー部分</div> </div> <script type="text/javascript">  </body> </script> copies部分はブラウザでは表示されず、JavaScriptでheaderとmenuにコピーしています。今考えた方法なので、もっとスマートな方法はあると思いますが（笑。参考まで。

ログインすると、全ての回答が全文表示されます。