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

解決済

質問者：dream_cats
質問日時：2007/10/09 14:21
回答数：5件

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

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (5件)

ベストアンサー優先
最新から表示
回答順に表示

No.4ベストアンサー

回答者： taloo
回答日時：2007/10/10 18:15

位置指定はpositionとfloat、それにせいぜいmarginなどを併用するしか方法はありません。

細心の注意を支払うことで、どんなブラウザで見ても綺麗な表示のページになります。

> 私には難しく、もっといい方法があるのではないかと思い質問しました。
残念ながら、がんばってくださいとしか言いようがないですね(^^;
スタイルシートで出来なければ、音声・テキストブラウザ用とそれ以外のブラウザ用の2種類、そのなかで<noscript>などを使用するほうが簡単だと思います。

最低限のヘッダは最初に書いておいた方が良いと思います。
そのページの内容がわかりますし、間違えて入ってきたページかどうかの判断もそこでできます。
私が音声ブラウザ対応ページを作る場合は、主にページタイトルとパンくずリストにしてます。
ページタイトルを見て（聞いて）間違えた場合は次に読まれるパンくずリストを使ってすぐに戻ってもらえますから。

- 0
- 件

通報する

この回答へのお礼

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

通報する

お礼日時：2007/10/12 11:57

No.5

回答者： taloo
回答日時：2007/10/12 14:27

OKWaveコミュニティー > [技術者向] コンピューター > プログラミング > HTML

現在地を示す↑これです。
英語ではtopic pathと言います。

- 0
- 件

通報する

この回答へのお礼

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

通報する

お礼日時：2007/10/12 15:59

No.3

回答者： suzuko
回答日時：2007/10/10 10:17

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

ご存じかも知れませんが。

参考URL：http://www.research.ibm.com/trl/projects/acc_tec …

- 0
- 件

通報する

No.2

回答者： taketan_mydns_jp
回答日時：2007/10/10 08:59

#1です。

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

- 0
- 件

通報する

No.1

回答者： taketan_mydns_jp
回答日時：2007/10/10 08:58

読み上げブラウザについては詳しくありませんが、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にコピーしています。

今考えた方法なので、もっとスマートな方法はあると思いますが（笑。

参考まで。