マークアップにおけるSEOルール - 2015/04

5686 ワード
CSS SEO google Markup HTML HTML テキストリンク

マークアップにおけるSEOルール - 2015/04

2015年のSEO基本方針

  • ページ構成に沿った素直なテキストワーディングとレイアウトを心がける
  • ユーザーが見ている状態と同様のテキスト、代替テキストを配置する
  • メガフッタのようなリンク過多な実装は控える
  • マイナスインデントやdisplay、font-sizeなどによる代替テキストを隠す行為は禁止とする

head

meta description

  • 120字以内にまとめる
  • 特に冒頭50文字に概要をまとめる
  • 可能であれば冒頭50文字で文章を一旦切る
  • 画面毎に、画面を説明する固有の説明文をライティングする
  • 全画面に共通の文章はサイト名以外不要
  • トップページではサイトを説明する文章を設定する
  • 記事タイトルや日時情報、価格情報など、ごく固有な情報を積極的に含むのが好ましい

meta keywords

  • SEO上の効果はない
  • SEO以外の役割がある場合もありこれまでどおり最低限の実装を行う

meta ogp + fb （※ この部分はhtmlガイドラインに移動するかも）

以下を設置する

<meta property="og:title" content="[ページタイトル]">
<meta property="og:type" content="[ページtype]">
<meta property="og:description" content="[記事の説明]">
<meta property="og:url" content="[ページURL]">
<meta property="og:image" content="[画像URL]">
<meta property="og:site_name" content="[サイトのタイトル]">
<meta property="fb:app_id" content="[facebookアプリID]">

各項目の詳細は以下のとおり

og:title

多くの場合、<title>要素と同じ値を設定する

og:type

特に指定がない場合「website」を設定する

<meta property="og:type" content="website">

og:description

meta descriptionと同じ値を設定する

og:url

多くの場合、link canonicalと同じ値を設定する

og:image

facebookが推奨するサイズ、1200px✕630px（以上）の画像のパスを設定する

fb:app_id

facebookページを作成すると提供される「FacebookページID」の値を設定する

link canonical

  • head要素内に以下を記述する
  • ドメインやサービスごとに取り決めた統一ルールを"正しいURL"としてhref値に設定する
  • 決定するルールは例えば「www.」の有無や「index.html」の有無など
<link rel="canonical" href="［正規化URL］">

link alternate

PCとSP・FPで異なるURI構造をもつサイトにおいて以下の実装を行う

PC側記述

<link rel="alternate" media="only screen and (max-width: 640px)" href="［SP・FP URI］">

SP・FP側記述

<link rel="canonical" href="［PC URI］">

要素

title要素

  • 32文字以下にまとめる
  • 特に冒頭20文字にページの内容をまとめる
  • ページの内容とサイトの内容を表現する
  • タイトル要素の構造としては以下が好ましい
<title>ページ名 サブカテゴリ名 カテゴリ名:サイト名</title>

hx要素

  • <h1>〜<h6>見出し要素にキーワードを適切に設定する
  • 画面全体において適切な数になるように、また適切な見出し階層（アウトライン）構造で設置する
  • テキストを含むCSS背景画像を持つ<hx>要素には、そのテキストをtitle属性値に設定する
  • html5で一部推奨されているmultiple <h1>実装は行わなず、<h1>はページに１つ設置する

a要素

  • ページ内に同一ページへのリンクが複数ある場合、最初のリンクだけが評価される可能性がある
  • ページ内に同一ページへのリンクが複数ある場合、最初のリンクのテキストワーディングに特に注意する

要素構成

  • <body>内の重要なテーマやキーワードがコード上の上部に出現するようブロックを構成する
  • ただし、ページの表示上の順序に反するソースコード順にしてはならない

属性

alt属性

  • <img>要素にalt属性を設定する
  • <img>要素にテキストを含む場合にそのテキストをalt属性値に設定する
  • テキストが長い場合は1文、または20文字程度の適切な長さに要約する
  • １つの要素やテキスト内容に対してalt属性とtitle属性の併用は行わない

title属性

  • テキストを含むCSS背景画像を持つブロック要素にそのテキストをtitle属性値に設定する
  • a要素にtitle属性を設定し、ハイパーリンク先の情報を設定することも有用
  • テキストが長い場合は1文、または20文字程度の適切な長さに要約する
  • １つの要素やテキスト内容に対してtitle属性とalt属性の併用は行わない

robots.txtとsitemap.xml

  • 各ドメインの本番Webサーバ上でrobots.txtとsitemap.xmlの有無を確認する
  • robots.txtとsitemap.xmlが正しく機能したり設定されているかを確認し把握しておく

viewport

スマートフォンなどデバイス毎のviewportを設定する

パフォーマンス

パフォーマンス性が高いほどよい

Microdataの利用

  • コンテンツの内容によってMicrodataマークアップが有用と判断できるプロジェクトにおいて対応する
  • 対応方針はプロジェクトごとに別途定める
  • itemtypeは schema.org の仕様に準ずる （ http://schema.org/docs/full.html ）

本ルールの更新

以上の方針はGoogleなどの検索サービスの動向にしたがって頻繁かつ速やかに更新する