SEOノート
SEOとは、Googleなど検索エンジンで上位に表示されるようWebページの構成や内容を工夫することだそうです。
学んだ内容を再確認できるよう整理しました(内容は入門レベルです)。
下の灰色のボタンで表示を絞り込むことができます。
GoogleのSEOスターターガイドメモ
サイト登録の確認
site:ドメイン名 をgoogleで検索する。
例 site:cukeplate.com
robots.txt
クローラのアクセスをブロックする。
正規表現も使用できる。
注意: 機密情報はこれで管理しない。
例:
User-agent: googlebot # 以降の記述の対象となるクローラー
Disallow: /icons/ # クロールを禁止するパス
User-agent: Googlebot-Image # 画像を検索結果から削除
Disallow: /images/kappa.jpg
Disallow: /images/kappa-*.jpg
Sitemap: # XMLサイトマップのURL
Crawl-delay: # クロール間隔
metaタグでクローリングを控えるよう要求したい時
<meta name="robots" content="nofollow">
noindexタグ
google検索で非表示とする。
(URL直打ちでアクセスはできる)
例: <meta name="robots" content="noindex">
title要素
○: ページ毎にオリジナルのタイトルを付ける。
✖: 長すぎる、不要なキーワードの濫用、繰り返し。
目安は24文字程度。
bingでは英語で50-60文字が推奨されている。
(全角の日本語では25〜30文字に相当)
例:
<head>
<title>○○のページ</title>
</head>
見出しタグ
コンテンツの階層構造を作成する。
意味のある場所で見出しタグを使用する。
見出しは短くする。
h1は1ページに1回だけ、ページの最初に使う。
hタグとpタグをセットで使う。
タイトルリンク
タイトルリンクは自動的に決まる。
<head>の内容
メインの視覚的なタイトル
<h1>などの見出し
スタイル処理で目立たせたコンテンツ
ページ内のその他のテキスト
ページ上のアンカーテキスト
ページを示すリンク内のテキスト
28文字以内にまとめる(長いと省略される)
description
ページ毎に要約した具体的な内容を記載する。
bingでは英語で150-160文字が推奨されている。
(全角の日本語では75〜80文字に相当)
例:
<head>
<meta name="description" content="要約した内容">
</head>
キーワード
検索でヒットして欲しいキーワードは冒頭に書く。
(スクロールせずに見えるエリアは特に重要)
検索の目的も意識してキーワードを決める。
キーワード同士を近づける。
文章に違和感のないことは大前提。
同じ段落で同一キーワードを繰り返すことは避ける。
キーワードの使用頻度は上位3つ合わせて6〜7%が適切。
キーワード頻度チェックツール(外部サイト)
画像(img)
画像の説明は想像できるように具体的に簡潔に書く。
例:
<img src="kasa.jpg" alt="月に暈がかかっている写真" />
ファイル名も想像しやすいものにする。
単語はハイフン(-)で繋ぐ。
画像の周辺にはfigcaptionタグ(画像の見出しや説明)をつける。
画像データは圧縮してサイズを小さし、表示速度を上げる。
表示速度の測定はGoogle PageSpeed Insights(外部サイト)
モバイル対応
PCとモバイル両方に対応させる。
cssを使ったレスポンシブウェブデザイン。
Firefoxでは、[Ctrl] + [Shift] + [m]でスマホの表示を確認できる。
内部リンク
パンくずリストで構造と現在位置をわかりやすくする。
リンクはトップから4クリック以内で階層を浅くする。
テーマの近いページのリンクをつける。
SEOに有効なリンクの順序は、テキスト > 画像 > URL
テキストリンクには、キーワード、同義語、共起関係の言葉を使う。
外部リンクは5%程度に抑える。
チェックツール(外部サイト)
クロールの再依頼
Google Search Consoleを使う。
URL検査を行いインデックス登録を再登録する。
URLが多い場合はサイトマップを送信する。
サイトマップ
公式サイトへのリンク
登録
サイトマップをrobots.txtに追加する。
またはSearch Consoleに直接送信する。
xmlサイトマップの例
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://www.example.com/foo.html</loc>
<lastmod>2022-06-04</lastmod>
<changefreq>monthly</changefreq>
<priority>0.8</priority>
</url>
</urlset>
loc: 登録したいURLアドレス
lastmod: 更新日
changefreq: 更新頻度
priority: 優先度(0~1.0)
changefreq(更新頻度)
always : アクセスする度
hourly : 1時間毎
daily : 毎日
weekly : 1週間
monthly : 1か月
yearly : 1年
never : 更新なし
xmlサイトマップの注意点
エンコードはUTF-8。
ファイルサイズは圧縮なしで50MB以内。
URLは5万件以内で絶対パスを記載する。
ルートへの配置を推奨(サイトマップで知らせる中で一番上のディレクトリに配置)
インデックスさせたくないURLは記述しない。
パーマリンク
短く、ページ内がイメージできる英単語を使う。
日本語タイトルはURLが長くなるため非推奨。
後で変更すると検索エンジンの評価がリセットされるためカテゴリーはあらかじめよく考えておく。
コピー率
各ページのコピー率は50%未満にする。
コピー率判断ツール(外部サイト)
エラー診断
ソースコードのエラー診断
Markup Validation Service(外部サイト)
指摘される内容の例
・セクションに見出し(h2,h6など)がない。
(見出しが不要な不要な場合はdiv要素の使用を検討。
ファイルサイズの圧縮
画像ファイルの圧縮
画像ファイルのサイズを小さくして読み込みにかかる時間を少なくする。
Visual Studio Codeの拡張機能learn-imagesを使って圧縮できる。
(ファイルを選択 → 右クリック → Compress imageを実行)
javascriptとcssの圧縮
画像ファイルのサイズを小ささくして読み込みにかかる時間を少なくする。
Visual Studio Codeの拡張機能Minifyを使って圧縮できる。
(ファイルを選択 → F1 → Minifyを実行)
WordPress
お勧めのフォーマット
コーポレートサイトならLightning
ブログサイトならCocoon
セキュリティ対策
プラグインは必要最小限にする。
WAF(Web Application Firewall)を有効にする。
SSLをリダイレクトで設定する。
パーマリンク
カスタム構造を使用する。
/%category%/%postname%/