スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
  1. --/--/--(--) --:--:--|
  2. スポンサー広告|
  3. トラックバック(-)|
  4. コメント(-)
  5. | 人気ブログランキング
  6. | FC2 Blog Ranking
  7. | はてなブックマークに追加
  8. | Buzzurlにブックマーク
  9. | livedoor クリップに追加

グローバルナビゲーションを外部 JavaScript 文書にしましょう。おもてなし(ユーザー・エクスペリエンス)向上に役立ちます

 グローバルナビゲーションを外部 JavaScript ファイルにすると、アクセシビリティユーザビリティSEO 向上に役立ちます。もちろん noscript 要素は記述してはいけません。

 などど書くと W3CアクセシビリティユーザビリティSEO の権威者は、何いってんだかと、呆れるに違いないですね。もちろんWeb コンテンツ JIS にもそんなことは書いてありません。

「人の行く裏に道あり 花の山」さて、嘘か誠かご高覧ください。


 1ページの html 文書の情報を単純化すると

  1. (ページ固有の)メインコンテンツ
  2. (メインコンテンツを他の html 文書に関連づけるための)リンク

の二つの情報になります。もちろん例外は多々有りますけどね、例えばリンク集・サイトマップやリンクが全くないページなど。

 この二つは、コンテンツが主でリンクが従ですから、この記述順序が自然です。

 さらに、リンクは関連性の高い html 文書へのリンクから順序良く記述すると、利便性が高くなりますよね。例えば、このページを「Aーいー1」としましょう。

◆コンテンツ直後の関連性の非常に高いページへのリンク

  • Aーいー2
  • Aーいー3
  • Aーいー4
  • Aーいー5
  • Aーいー6
  • Aーいー7

◆その次の関連性の中くらいのページへのリンク(通常はローカルナビゲーション)

  • Aーろ
  • Aーは
  • Aーに
  • Aーほ
  • Aーへ
  • Aーと

◆その次の関連性の低いページへのリンク(通常はグローバルナビゲーション

 このような順序で記述し、各リンクのブロックにも見出しをつける。48Luck式汎用設計(ユニバーサルデザイン)文書構造です。多くのありがちなページの真逆の順序と言って良いでしょう。

 そして正しいマークアップ、ページタイトル・meta の description 属性・見出し等の表現を大事にする。そうすれば、音声読み上げソフト利用者・四肢障碍者など様々な利用者の快適さが増します。欲しいのはメインコンテンツであり、関連性の高いページへのリンクだからです。わずらわしいナビゲーションスキップを考える事が不要になります。

 利用者の中に存在する、検索エンジンが派遣する検索ロボットも瞬時に情報を持ってかえることが出来ます。SEO の効果抜群ではありませんか。

 キーワード出現率があ~たらこ~たらなどと枝葉末節な事より、根本的な SEO 内部要因改善になります。

 また、ペイパーポスト広告テキストリンク広告のバックリンクでページランクを上げる事に一時成功しても、スパム行為としてペナルティを受ける危険性が高いのです(検索エンジン様、さっさとペナルティを与えてください、お願いしますよ)。スパムに成り下がるより、よほど健全で、どんなに検索エンジンのアルゴリズムが変わってもマイナスにはならないロングセラー SEO です。

 さて、視覚上の話に進めます。UI(ユーザインターフェース)として、グローバルナビゲーションは、いわゆるヘッダ下にあることに多くの人がなじんでいます。初心者や高齢者にとって、ベストな位置ですね。実際にはあまりクリックされることはないでしょうが、そこに有ることで安心してスルーできると言う役目です。無いと不安になるのですね。

 記述順序と UI の場所の矛盾をどう解決するかが、本稿の核心です。

  1. CSS
  2. JavaScript

 1つは、CSS。最後に記述したグローバルナビゲーションのブロックを div で囲み、CSS で position を absolute もしくは relative にし、ヘッダ下の位置に固定します。そしてそのなかに、個々のリンクを div で囲み、float を用いて左右に並べていきます。全体が固定で、リンクも画像になっているときに成立します。

 しかし、全体がリキッドレイアウトやエラスティックレイアウトのとき、個々のリンクがテキストのときには難しいですね。利用者が文字を拡大した場合、レイアウトが破状し、他のブロックと重なってしまいます。

 二つ目は、JavaScript。フッターのグローバルナビゲーションを活かしたまま、そっくり同じ物を別に外部 JavaScript 文書にしてしまえば良い。音声読み上げソフトも検索ロボットも、(今のところ)外部 JavaScript 文書を読まない特徴を逆用するのです。ナビゲーションスキップと同じ効果が有りますね。もちろん noscript 要素は不要です、フッターに本物が存在しますから。またnoscript 要素のリンクを隠しリンクスパムと間違えられる危険を冒したくはありません。

 如何でしょう、面倒ですか?JavaScript を多用するのは色々危険ですが、使い方次第ですね。音声読み上げソフト利用者・四肢障碍者・検索ロボットや初心者・高齢者など様々な利用者の快適性が増し、おもてなしユーザー・エクスペリエンス)向上に役立つと言えませんか?

◆関連情報

◆関連エントリー

スポンサーサイト
  1. 2008/04/16(水) 09:00:00|
  2. ユーザー・エクスペリエンス|
  3. トラックバック:1|
  4. コメント:0
  5. | 人気ブログランキング
  6. | FC2 Blog Ranking
  7. | はてなブックマークに追加
  8. | Buzzurlにブックマーク
  9. | livedoor クリップに追加
<<50歳以上のネットユーザーは何を見ているのか?(CNET Japan より) | ホーム | 未成年者のケータイフィルタリング問題>>

コメント

コメントの投稿

管理者にだけ表示を許可する

トラックバック

トラックバックURLはこちら
http://48luck.blog9.fc2.com/tb.php/342-53d1c612

一般的に効果があるとされるSEO対策 - その2

一般的に効果があるとされるSEO対策 - その2
  1. 2008/05/10(土) 01:04:09 |
  2. ウェブサイトの技術っておもしろいよね

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。