SEOを考慮したHTMLコーディングの復習
今回は、SEO対策の方法について、復習することにしました。
ちょうど今月(2012月10月)、Googleのウェブマスター向けガイドラインが更新されたようですので、
そちらから、HTMLコーディングに関する主なものをまとめてみました。
あからさまなスパム行為は省略しました。
基本
1. サイトの構造はわかりやすく。
2. 主要ページへのリンクを記載したサイトマップを用意する。
サイトマップ内のリンクが非常に多い場合は複数ページに分ける。
3. ユーザーが検索するときに入力する可能性と高いキーワードをサイトに含める。
4. 重要な名前、コンテンツ、リンクは、画像の代わりにテキストを使用。
画像を使用する必要がある場合は、alt属性を使用して、説明テキストを組み込む。
5. 無効なリンクを防ぐ。HTMLが正しいか確認する。
避けるべきことと、対策
1. JavaScriptを使って、外部ページにリダイレクト(サイトにアクセスしたユーザーを、リクエストされたURLとは別のURLに移動させること)すること。
対策→ 新サイトへの移動などの場合は、301リダイレクトを使用する。
2. 隠しテキストと隠しリンクの利用
・白の背景で白のテキストを使用する
・テキストを画像の背後に置く
・CSSを使用して、テキストを画面外に配置する
・フォントサイズを0に設定する。
・小さな1文字のみをリンクにして、リンクを隠す
画像やJavaScript、動画の使用で、テキストをおく必要がある場合の対策方法と注意点
画像
・alt属性を使用して、わかりやすい説明テキストを記述する。
(例:<img src=”puppy.jpg” alt=”持ってこいをするダルメシアンの子犬”>)
・画像近くに、わかりやすいキャプションや説明テキストを配置する(可能な限り画像の近くに置くと効果的)
・ファイル名を、画像の題材がわかるようなものにする
・alt属性にキーワードを多用しない
(スパムとみなされる場合がある。例:<img src=”puppy.jpg” alt=”子犬 犬の赤ちゃん 小さな子犬 レトリーバー ラブラドール ウルフハウンド セッター ポインター ジャックラッセル テリヤ ドッグ フード ドッグフード 安い 子犬の餌”/>)
・重要なテキストは画像に埋め込まない
JavaScript
・JavaScript内と同じコンテンツを<noscript>タグ内に記述する
(<noscript>タグ内の内容は、JavaScript内のコンテンツと完全に同様にする)
動画
・動画の説明テキストをHTML内に記述する
3. 誘導ページの利用
(誘導ページ:特定のフレーズに対して、検索結果の上位に表示して、ユーザーを特定のサイトやページに誘導する目的で設置された、特定のキーワードやフレーズ用に作成された、テンプレートを使用した品質の低いページの集まり)
対策→ ユーザーの利便性を考慮した、質の高いページを設置する
画像の配置やJavaScriptなどで、デザインの都合上、対策が難しい場合もありますが、
改めて、これらのことを頭に入れてデザインをすることで、
利便性の高い、SEOも考慮されたサイト作りに役立てたいです。
Author Profile
NINOMIYA
Webデザイナー兼コーダー出身のフロントエンド開発者です。 UXデザインやチーム開発の効率化など、勉強中です。
SHARE