【Laravel】SEO対策する

えび

LaravelSEO意識した際に最低限したことをメモ

サイトマップを動的作成してサチコに登録する

  • 作成方法は過去記事参照

【Laravel8】サイトマップを動的に作る

上記で生成したURL ({サイトURL}/sitemap)をサーチコンソール、通称サチコに登録する

title, h1, metaタグを記載する

  • headタグ内にtitle, metaを、bodyタグ内にh1を記載
    当たり前のことだけどこれがだいじ
<head>
<title>サイトタイトル</title>
<meta name="description" content="概要文を120文字程度">
<meta name="keywords" content="キーワード1,キーワード2,キーワード3">
<meta charset="utf-8">
</head>
<body>
<h1>サイト見出しタイトル</h1>
</body>

現在のページによって表示を切り替えたい場合

毎回書き換えるのがめんどくさい場合は、
request()->route()->getName()でルート名を取得して条件分岐すると便利

@if (request()->route()->getName() === 'profile')
  <title>プロフィール | サイト名</title>
@else
  <title>サイト名</title>
@endif

OGPタグを設置する

OGPとは

Open Graph Protocolの略
TwitterやFacebookなどのSNSでURLをシェアされたときに、
そのページの画像やタイトル、descriptionを正しく表示させるために指定する

これは検索エンジン対策というよりも、
シェアされたときにどれだけユーザーの関心を引いて
SNSからの流入を増やすかどうかに関係してくる

  • OGPタグはheadタグ内に設置する
<meta property="og:type" content="ページの種類" />
<meta property="og:title" content="タイトル" />
<meta property="og:description" content="ディスクリプション" />
<meta property="og:site_name" content="サイト名" />
<meta property="og:url" content="サイトURL" />
<meta property="og:image" content="サムネイル画像の URL" />
<!-- Twitterシェア時の表示形式指定 -->
<meta name="twitter:card" content="summary_large_image" />
  • Twitterでの表示イメージはここで確認できる

canonicalタグを設定する

canonicalタグとは

サイトの正規URLをGoogleさんの検索エンジンに正しく認識してもらうためのタグ

例えば下記のような「重複ページ」があるケース

  • wwwありとwwwなし
    http://test.com or http://www.test.com
  • 最後のバックスラッシュ(/)ありとなし
    http://test.com or http://test.com/
  • index.htmlのありとなし
    http://test.com or http://test.com/index.html

こういった「同一コンテンツ」なのに複数のURLが存在する場合は
重複ページ」と認識されてSEO評価が下がる原因になる
なので、canonicalタグを設置して統一する

  • タグ設置方法: headタグ内に下記タグを設置する

<link rel=”canonical” href=”{サイトのURLを絶対パスで指定}” />

  • Laravelでの設置は下記コードでOK
<head>
<link rel="canonical" href="{{ url()->current() }}" />
</head>

必ずheadタグの中に記載すること

上記のようにLaravelのurl()ヘルパーを使用すると、
簡単に現在のURLを絶対パスで取得できるので便利

画像のalt属性をもれなく指定する

  • alt属性の指定で検索順位がグンと上がることはないけど、
    画像を認識できない検索エンジンに対して、これは○○の画像ですよ、と親切に教えてあげることが大事だったりする
<img src="apple.png" alt="リンゴ" />

他随時追記してく