HTML基礎講座２

基礎的HTMLを復習する。構造的HTMLの概念

アクセシビリティ、検索エンジン(SEO)に強いHTML

１．HTMLについて少々復習してみる。（ヴァージョンについて）

◆現在ホームページビルダーなどでデフォルトで使われているのが、HTML 4.01です。: HyperText Markup Language =HTML
◆次期バージョンとして、このページでも使っているのが、XHTML 1.0 および1.1です。: Extensible HyperText Markup Language =XHTML

２.アクセシビリティを考慮したHTML

◆アクセシビリティとは、: accessibility=とは、access+ability　つまり、アクセスのしやすさと言う考えからきているものであるが、もう少し深い意味で、バリアフリー的要素のほうが強いのかもしれない。
◆HTML4.01よりできるだけXHTML1.0以降を使う。: HTMLの場合どうしても無駄なタグが入る。装飾がかえって見難さをかもし出してしまうこともある。
◆ホームページを利用する人は、健常者ばかりではない。: 色の配色などを考慮する。緑と赤の見合わせなどや、盲目の人に優しいサイトつくりとして読み上げソフトに配慮したサイトつくりを心がける。; 読み上げソフトなどの普及によりテーブルレイアウトでは、サイトの意味合いを伝えきれない場合がある。
◆文字サイズやサイトの背景色コントラストなどの見易さに考慮する。: テキスト文字が小さなサイトを見かけるが、年配者を考慮したフォントサイズを考える必要がある。またフォントサイズの変更が出来るようにしていておく。
◆CSS（スタイルシート）によるサイトデザインにする。: 装飾にかかる部分は出来るだけスタイルシートにする。

３．検索エンジン(SEO)に強いHTML

◆テキストベースのページを作る。: 検索エンジンで拾ってもらいたいキーワード、キーフレーズを散りばめる。キーワードがあって初めて検索されるので、ひとつの単語の同意語、方言やカタカタ、ひらがな、漢字、英語読みなどでキーワードを考える。地域キーワードは必須。岐阜とか…。デザインはまったく検索エンジンに無縁。
◆XHTMLによるタグを使用する。: HTMLとXHTMLを比べてみると…ソースを見てもらえばわかるのだが、XHTMLは、簡素になっている。要するに装飾をつかさどるタグは基本的に使えないようになっている。もちろんXHTML 1.0 Transitionalであれば互換性があるし、特にHTMLでもXHTMLでも大きな仕様の違いがあるわけではないので、それほど神経質になることはない。若干気をつけなければならないことは、大文字小文字の問題。タグは基本的に小文字仕様。終了タグは、基本的に必要。もし<br>などの単独タグは、<br />と記す。などなど。無駄なタグは削除する。
◆装飾のタグは、CSS（スタイルシート）に任せる。: スタイルシートにできることはできるだけスタイルシートを使用する。たとえば<font>タグなどは使用しない。<table>レイアウトではなく<div>タグを使用したレイアウトをつかうなど。
◆装飾タグは、別ファイルとする。（スタイルシートなど）: スタイルシートは別ファイルとする。
◆各ページのデータ容量はできるだけ軽くする。: JavaScriptなどはできるだけ使わないようにするか、別ファイルにするかする。写真画像も大きすぎず、できれば、サムネイル画像にしておく。
◆タイトルを明確にする。: <title>タグでくくったタイトルは、そのページの重要なキーワードを明記する。よくお店の名前や、会社名だけのタイトルを見かけるが、一番売りたいキーワードを明記したほうがいい。またお店の名前をネット上の屋号として検索されやすい屋号とするのも必要。当方、例えば、フリマート、看板ショップなど。
◆<meta>タグを使用する。: たとえば、<head>タグ内で; <meta name="keywords" content="検索エンジン,SEO対策,HTML,岐阜,ホームページ" />
<meta name="description" content="企業向けパソコンネット相談受け付けます。ＳＥＯ対策、パソコン家庭教師、個人指導、ホームページ作成支援などいたします。" />; ヤフー検索エンジンに有効といわれている。
◆構造的HTMLを使用する。: <h1>～<h6><p><ul><li><ol><strong><div>などXHTMLで使用可能なタグをできるだけ使用する。; <br>改行タグや、<font><b>などのタグはあまり使用しない。
◆フレーム構造によるサイトは基本的に作らない。: フレームは、トップページのアドレスのみ表示されるため、サブページの検索対策、グローバルナビゲーション、ローカルナビゲーションの取り付けを怠りやすい。
◆画像を使う場合は<img>内に、必ずalt属性を入れる。: どうしても画像を使う場合は、<img>タグ内に、属性、alt="画像の説明文"を明記する。テキストで出来る部分は出来るだけテキストで表示する。
◆基本的にフラッシュなどでサイトを構築しない。: フラッシュを使用する場合は、よほどのアクセスのある有名サイトとしての自負がある場合のみ。一般的にはＳＥＯ上不向き。
◆日本語は全角文字を使用する。: 半角カタカナは使わない。（携帯サイトなどでは使えるようになっているが検索エンジンでどれだけ拾われてるか少々疑問。）
◆サイトは、できるだけ複数ページに分ける。: 検索エンジンは、トップページだけを拾いにくるのではない。サブページも、検索対象となるので、各ページごとに検索エンジン対策が必要。各ページ上記内容をしっかり施す。個性のある各ページつくり。サイト構造上、ボリュームのあるサイトつくりが必要。
◆シンプル構造のサイト作り。: ボリュームのあるサイトでありかつシンプルでなければならない。トップページへの戻るなどのリンク、サイトマップ、グローバルナビゲーション、ローカルナビゲーションの取り付け。
◆多くのサイトからリンクしてもらう。: 一番有効は検索エンジンに登録すること。また検索上位に来るサイトからリンクを張ってもらう。またできるだけ多くのサイトにリンクを貼ってもらう。相互リンクなどを大いに利用する。
◆PPC広告、アドセンス広告、オーバーチュアのスポンサーサイト広告掲載は控える。: googleアドセンスは、ヤフー検索エンジンにとっては、検索上不利といわれている。実態は不明。逆にgoogleアドワーズや、オーバーチュアのスポンサーサイトとして自社広告を他サイトに載せてもらうことは、とっても有効。
◆ブログ、ＳNＳ(ソーシャル・ネットワーキング・サービス)を使う。: ホームページだけでなく、ブログを書いてホームページと複合的リンクしていく。他ブログへのコメント、トラックバックなどで自サイトへのリンクを残す。またmixiなどのSＮSからのアクセスを稼ぐ。
◆RSSを排出するページ作り。: ブログなどは自動的にRSSを排出しているが、ホームページでも同様に、ＲＳＳ化もしてみる。
◆独自ドメインによるサイト構築: 無料のレンタルサーバーでも検索は十分にされるが、長く育てていくのなら独自ドメインをできるだけ早く所得し登録しておく。
◆高速なサーバーを利用する。: 検索エンジンが訪ねて来た時に、サーバー自体がダウンしていたり、低速では、話にならない。またサイトが重たい状態になっていないようにする。
◆販売目的だけのサイトだけでなく、インターネット上に有効な情報源となれるサイトを作る。: 結局技に走るだけでなく、もっと根本的に、どんな目的のサイトを作るかが問われる。どんなに技を磨いても、訪れる人が、喜んでくれるサイトとなっているかが一番重要であって、自サイトはインターネット上にとって、有効なサイトとなっているか？社会のためになるサイトとなっているか？という根本的なサイトつくり。社会のためになるサイト、人のためになるサイト、思いやりのあるサイトとなっていれば自然にリンクを貼ってくれたり、メジャーなポータルサイトからリンクを張ってもらえたり、紹介してもらえたりする。Web2.0の時代でなくてもそういうサイトが生き残っていくのだろう。