ＨＰ制作における＜本文へのスキップについて＞アクセシビリティへの配慮

質問

弱小公的機関でＨＰの制作をしております。アクセシビリティ対策として、総務省のパンフを参考に検討していたところ、このなかで目の不自由な方への対応として、ナビゲーションをよみとばすための＜本文へのスキップ＞をつけるとよい、とあるのをみて、試作したのですが、この部分＜本文へのスキップ＞を不可視にして高さを低く設定しても、各ページ共通のナビ部分のレイアウトが下がり、見栄えがよくありません。
このgooのサイトの場合も各ページ共通のナビゲーションは多々あると思いますが、＜本文へのスキップ＞　があるようには思えませんが、メジャーなサイトではなにかもっとクレバーな方法で対応しているのでしょうか？
よい方法があったらご教授していただけると助かります。

回答No.2

UKY

> やっぱり透明画像を使って、上端部にスキップ機能を設定するのは（ブラウザ上で見える現状の上端部の高さを変えることなく）難しいのでしょうか？

いや、そんなことはありません。スタイルシートをちゃんと設定すれば余計な空白は出ません。大概は、CSS の display:none を当てはめるだけで完全に隠すことができます。

ちなみに、本文へのスキップは画像である必要はありません。どうせ見えないのですから、普通に文字を書いてリンクしておけばいいのです。
意味もなく画像を使うと、音声ブラウザで「ここに画像があります」などと読まれて逆にがっかりする可能性もあります。

回答No.1

UKY

音声ブラウザ利用者が「前置きのナビゲーションはいいから早く本文を」と思うのと同じように「普通」のブラウザを使っている人たちだって「ナビゲーションはいいから早く本文を」と思っています。
例えばまさにこの質問のページ
http://oshiete1.goo.ne.jp/kotaeru.php3?q=1782569
ですが、ページを開いたときには画面の上半分以上がナビゲーションで占められており、その分 多くスクロールしないと質問・回答が読めません。音声ブラウザに比べればたいしたことはないかもしれませんが、それでもスクロールするのに手間が掛かっていることに変わりありません。

最初のナビゲーションは見たくない・聞きたくないので飛ばす、というくらいなら、そもそも最初からナビゲーションなんて書かなければいい、とは思いませんか?

さて、goo はトップページ<http://www.goo.ne.jp/>で「本文へ飛ぶ」類のリンクを使っていますが、ダミー画像を使っている点は感心しません。
もっとも、ちゃんとした音声ブラウザなら見出しや段落単位でスキップする機能ぐらいは備えているでしょうから、内容がちゃんとマークアップされていればわざわざリンクを用意しなくても閲覧者側で対応できると思うんですけどね。

補足

ご多忙のなか明快なご回答ありがとうございます。

　＞内容がちゃんとマークアップされていればわざわざリンクを用意しなくても閲覧者側で対応できると思うんですけどね。

　つまり、文法がきちんとしていれば、閲覧者側でうんざりするような、同じことの読み上げ繰り返しは回避できるのですね。ありがとうございます。

　ところで。。。
　やっぱり透明画像を使って、上端部にスキップ機能を設定するのは（ブラウザ上で見える現状の上端部の高さを変えることなく）難しいのでしょうか？