京都市 ホームページ制作 会社 / アクセシビリティ・ユーザビリティ配慮
メルマガバックナンバー9
フレームは、必要以上に用いないことが望ましい vol.9
【2006.09.26 vol.9】毎月第2・4火曜日発行
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
障害者や高齢者をはじめ、誰もがアクセス可能なホームページについて
考えるwebアクセシビリティは、検索エンジン（SEO）対策に最も効果的です。
顧客拡大、売上増のための「アクセシビリティとSEOの融合」やホームページ
作成について出来るだけ簡単に解説します。
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
こんにちは、レボネット株式会社の坂井です。
当メルマガの第9号をお読みいただき、ありがとうございます。
このメルマガではこれからのインターネット環境やウェブサイトにとって
必要不可欠なアクセシビリティ対策を中心に、検索エンジンで上位表示を
実現するSEO(検索エンジン最適化)対策と絡めてご説明します。
SEO効果の高いアクセシビリティ対策を施したホームページ制作に
ついてのご相談は無料でお受けしておりますのでお気軽にどうぞ。
■■ レボネット株式会社 電話番号 075-344-3348 ■■
□アクセシビリティとSEO対策の関連について□
┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
目次 ・フレームは、必要以上に用いないことが望ましい
・初歩からのアクセシビリティ・SEO対策実践講座（strong要素編）
・編集後記
発行元・レボネット株式会社
坂井 和広
┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
第1号のメルマガでは、簡単にSEOとアクセシビリティの用語説明をしました。
まだ、アクセシビリティという言葉を聞いたこともないという方は
当メルマガのバックナンバーをご覧ください。
バックナンバーはこちら→http://plus.revonet.co.jp/backnumber_1.html
■フレームは、必要以上に用いないことが望ましい
今回は前回のテーブルレイアウトに引き続いて、ホームページ制作において
過去に広く使われていたフレームについてお話します。
まず、フレームとは、枠 (frame) のこと、HTMLの技術で、ブラウザの
1つの画面を複数に分割してそれぞれに別々な情報を表示する方法のことで、
左側にメニュー、右側に本文を配置するなど、ページを分割している
フレーム（枠）のことを言います。
このフレームは1つのぺージ内で複数のウィンドウを分割して表示したり、
サイドメニューをフレームにし、メニューリンクをクリックしても
メニューは常時画面に表示されたまま他のページを表示させることが
できるので、過去のホームページ制作においてはこのフレームは広く
使われておりました。
ですが、ホームページ制作においてそのフレームを使用したページ構成は
アクセシビリティ、SEOの観点からも見直す必要があるのです。
そのフレームについては、前回もご紹介したJIS X8341-3ウェブコンテンツ
JISに記載されています。
----------------ここから引用----------------------------------
フレームは、必要以上に用いないことが望ましい。使用するときは、
各フレームの役割が明確になるように配慮しなければならない。
参考 音声ブラウザなどの利用者は、視覚的に全体を把握することが
できないため、各フレームの役割を理解したり、フレームの内容の変化を
認識したりすることが難しい場合がある。
参考 キーボードだけで操作するとき、各フレームの役割及び各フレーム
内のデータの変化が分かりにくいために、情報アクセシビリティを損ねる
可能性がある。また、音声ブラウザによっては、フレームを別々のページと
して認識する場合があり、作成者の意図どおりに利用者が理解できない
可能性もある。タイトル又は広告などを表示するためだけにフレームを
使用したり、レイアウトのために中身が空白のフレームを作ったりすると、
利用者は理解しにくくなる。
例1. HTMLでは、frame要素にはtitle属性を用いて各フレームの役割を
記述する。また、フレーム内の各ページにはtitle要素を用いて内容に
あった固有のタイトルを付ける。
例2. HTMLでは、frame要素を使うときは、フレームをサポートして
いないウェブブラウザのためにnoframes要素に代替情報を付与する。
----------------ここまで引用----------------------------------
以上のようにフレームを使用して、メニューを一つのhtmlファイル、
コンテンツ部分をもう一つのhtmlファイルにしてフレームを使って左右に
分けたり、上下に分けたりすることは常時メニューが表示されているため
健常者のユーザーが使いやすい、ユーザビリティの観点では優れていると
いう面はありますが、視覚障害等のために音声ブラウザを使用している
方や、テキストのみでインターネットを閲覧するテキストブラウザを
使用している方、手が不自由でマウス操作が困難でキーボードのみで
操作する方などにとって、適切に情報を得ることができないページと
なる場合があります。
そのため、フレームを使ってホームページを制作することは、健常者の
方にとってはユーザビリティを考慮できていても、音声ブラウザや
テキストブラウザ使用者の方にとっては、アクセシビリティ、
ユーザビリティ共にに考慮されていないページとして適切に情報を
得ることができない可能性があるのです。
音声ブラウザは、フレームを使用したページの内容を把握することが
困難です。実際に左にメインメニュー、右にコンテンツに分けている
フレームのページをIBMの音声ブラウザホームページリーダーを
使用して閲覧してみました。
フレームを使用したホームページを開くと、左のメインメニューの
部分を順次読み上げていき、その後、ページの終わりとなり、
コンテンツ部分にはとべず、コンテンツは閲覧できないように
なっておりました。
メニュー部分とコンテンツ部分が別のhtmlで構成されているため、
画面上は表示されており、視覚的には閲覧できていても、表示画面を
みることができない音声のみで閲覧している方にとってはコンテンツ
部分へのリンクがないため、コンテンツ部分のページは音声では
読み上げられない構造になっているのです。
音声ブラウザによって読み上げ方は様々ですので、一概には
言えませんが、フレームを使用することで生じる弊害と、
弊害を緩和するための正しい使い方や措置を知った上で使用し、
レイアウトのためだけの空白部分に使用したりしないようにするなど、
無駄なフレームは使用しないで、アクセシビリティの観点からも
「フレームは必要以上に用いない」ことを推奨します。
その他、検索エンジンにとっても、メニューにフレームを
使用している場合や、更新情報など別ウインドウを使ってフレームを
使用している場合などは検索エンジンがフレーム内の内容やキーワードを
適切に読みこむことができないため、SEO対策の観点からもフレームは
大きな弊害となります。
以上のことからアクセシビリティの観点からもSEO対策の観点からも、
フレームを使用したホームページを一度見直してみてはいかがでしょうか。
フレームを使っている既存ホームページからXHTMLとCSSを使用した
ウェブ標準準拠の新しいホームページへのリニューアル等のご相談は
sakai@revonet.co.jpまでご連絡下さい。
■初歩からのアクセシビリティ・SEO対策実践講座（strong要素編）--------
ここからは初歩的なことからアクセシビリティ対策・SEO対策の実践方法に
ついて、ご説明していきます。本日はstrong要素についてです。
前回までのソースを使って、body内のソースを以下に表示します。
<body>
<h1>一番重要な見出し1(大見出し)</h1>
<p>見出し1の<strong>内容</strong></p>
</body>
strong要素とは
strongは直訳すると強いという形容詞ですが、強調という意味を
持っています。
テキスト内の特に伝えたい内容の部分をstrongタグで囲み、強調します。
タグの使い方
<strong>～</strong> で囲まれたテキストを強調する際に用い、strongで
囲まれた強調部分は一般的なブラウザでは太字で表示されます。
音声ブラウザによっては、strongで囲んだ強調部分を強く発音することも
あります。
太字（Bold）の略である<b>～</b> で囲みテキストを太字にするタグも
存在しますが、テキストブラウザや音声ブラウザなどでは、太字を表現
できない場合もありますので、アクセシビリティを考慮して、強調する
ことが目的であれば、bタグではなく、strongタグを使用することが
推奨されています。
特に伝えたいテキスト部分をstrongタグで囲み、太字にすることで
検索エンジンが強調する部分を読み取り、他の通常のテキストよりも
重視します。
SEO対策を意識して、目的とするキーワードを盛り込んだ文章をstrong
タグで囲み、1ページづつページを見直してみてください。
テキストを強調するstrong要素についてお伝えしたところで
本日のメルマガはここまで。
次回からも"SEOとアクセシビリティの融合"について、なぜ”検索エンジン
対策に最も効果的”なのか基本的事項から順に詳しくお伝えします。
当メルマガではできるだけ専門用語なども簡単にご説明しておりますが、
もし、わからない用語がありましたら、こちらのヤフーコンピュータ
用語辞典で検索して調べてみてください。
その他、レボネットへのご質問という形でも受け付けていますのでお気軽に
ご質問下さい。
→ http://computers.yahoo.co.jp/dict/
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
情報格差をなくすための障害者や高齢者に配慮したアクセシビリティ対策や
長期的な検索エンジン対策に最も有効なXHTML・CSSコーディング、顧客拡大・
売上増のための検索キーワードを意識したSEO対策など、「アクセシビリティ
とSEOの融合」を図り、web標準に準拠した最も新しいホームページを制作
いたします。
【レボネット株式会社サービス案内サイトREVOplus】
→ http://plus.revonet.co.jp
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■SEO・アクセシビリティ対策済 ホームページ制作をご依頼の場合
20ページまで 207,900円（税込）
※企画・構成等が含まれております。
こちらは特別モニター価格となっておりますので、実績、ご感想などを
ホームページ上で公開させていただきます。
★ご紹介者にキャッシュバック
ホームページ制作をご紹介いただいた方に制作費の10%を還元いたします。
ご依頼・お見積もり・お問い合わせ・ご紹介はsakai@revonet.co.jpまで
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
【編集後記】
----------------------------------------------------------------------
前号でアクセシブルなウェブサイトを表彰するアックゼロヨンアワードの
締め切りが9月15日までとお伝えしてましたが、9月22日までに延期と
なりました。
ちなみに、アックゼロヨン・アワード2006の表彰式は2006年10月31日
火曜日となっております。表彰結果をお楽しみに。
夏も終わり、もうすぐ10月！秋への季節の変わり目は夜は寒いですね。
そんな涼しい夜に最近はプロ野球はセパともに首位決戦で大詰め。
野球がやりやすくなった涼しいこの季節に、熱い首位争いが始まっています。
私は阪神ファンなので、こんな涼しい日にも毎日ひやひやしながら
熱い応援の日々を過ごしてます。セリーグの優勝はどうなることやら。
ひそかに逆転優勝を願っています。
皆さんは昼間は半袖でも朝と夜は長袖を着て、風邪を引かないように
注意してくださいね。
----------------------------------------------------------------------
これからアクセシビリティを広めるため、皆さんのSEO対策のため、
皆さんのさらなる顧客拡大、しいては売り上げアップのための情報源
となり、インターネットの利用環境がより充実したものとなるように
当メルマガがお役に立てるよう願っております。
----------------------------------------------------------------------
☆このメルマガへのご意見・ご質問やホームページ制作・オンラインショップ
構築のご依頼・ご紹介などございましたらご遠慮なくメールください。
あなたもお気軽にこのメルマガへのご意見・ご希望をお送りください。
必ずお返事させていただきます。
メルマガ【 誰でもわかる！SEO効果の高いアクセシビリティ対策 】では、
もっとお役にたてる情報を配信したいと考えておりますので、あなたの
アクセシビリティやSEOについてのご意見・ご感想などもお待ちしております。
..... sakai@revonet.co.jp
最後までお読みいただき、ありがとうございました。
レボネット株式会社
坂井 和広
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
「誰でもわかる！SEO効果の高いアクセシビリティ対策」
───────────────────────────────────
□ 発行元 ..... "アクセシビリティ・SEO対策ホームページ制作会社"
レボネット株式会社 http://plus.revonet.co.jp/
京都府京都市下京区朱雀正会町24番地
TEL:075-344-3348 FAX:075-344-3343
□ E-mail ..... sakai@revonet.co.jp
このメールマガジンの転送は自由です。よろしければ転送してください。
----------------------------------------------------------------------
□ 発行周期 ..... 毎月第2・4火曜日
□ バックナンバー.. http://plus.revonet.co.jp/backnumber.html
■ メルマガ配信登録・アドレス変更・配信停止はこちらからお願いいたします。
まぐまぐ .... http://plus.revonet.co.jp/magazine.html
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━