WordPress最初にするSEO対策

WordPress最初にするSEO対策

WordPressを導入した後に最初に行うべきSEO対策を紹介いたします。一般的に内部SEOと言うやつです。今から紹介するSEO対策は最低限のSEO対策だと思っていただいてもいいと思います。これをする・しないで検索順位は結構変わってくるのできっちり行いましょう。重要度の高い順に紹介していきます。
スポンサーリンク



noindexの設置

巡回してきた検索エンジンに不要なページを知らせる必要が有ります。これをしておかないと非常にマイナスになり得ますので即座に対処される事をお勧めします。SEO対策されるなら必須です。

記事投稿前Wordpressインストール後初期設定?

WordPress初期設定

WordPressをインストールした後の基本設定を紹介した記事になります。プラグイン「All in One SEO Pack」を使用したnoindex処置・パーマリンクの設定・カテゴリーとタグの設定方法を説明しています。

設定がまだ終わっていない方は直に対応される様にして下さい。必須項目になります。

CSSのインライン化

CSSのインライン化を行う事により表示速度が上がりストレス無く訪問したユーザーがブログを読む事が出来ます。又Google自体も表示速度が速いブログに対して高評価を与え検索順位が上がります。時間の掛かる項目では有りますがSEO対策する上で絶対にやっておいた方がよい項目です。

今回の説明ではh1~h6の見出しCSSをインライン化(ヘッダーに移植)の説明をします。

☆ポイント☆

WordPressのファイルを編集する場合は必ずバックアップを取りましょう。

WordPress機能の外観→テーマの編集→スタイルシート(style.css)内にh1・h2・h3・h4・h5・h6と書かれた部分を全て切り取ります。

1.外観→テーマの編集を選択します

Wordpress外観テーマ編集の説明

WordPress最初にするべきSEO対策1

2.テンプレート欄からスタイルシート(style.css)をクリックし現在のテーマのCSSを表示させます。

Wordpress機能の外観→テーマの編集→スタイルシート(style.css)

WordPress最初にするべきSEO対策2

3.スタイルシート(style.css)CSSコードの中のh1~h6の記載されている部分を全て選択し選択範囲内で右クリックの切り取りを選択します。

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {font-family: "Raleway", Helvetica, Arial, sans-serif;font-weight: 500;line-height: 1.4;
color: #333333;margin-top: 0;margin-bottom: 16px;margin-bottom: 1rem;

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a {color: #333333;}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover, .h1 a:hover, .h2 a:hover, .h3 a:hover, .h4 a:hover, .h5 a:hover, .h6 a:hover {
color: #46a28d;text-decoration: none;}

h1,.h1 {font-size: 38px;font-size: 2.375rem;line-height: 1.2;}
h2,.h2 {font-size: 32px;font-size: 2rem;}
h3,.h3 {font-size: 24px;font-size: 1.5rem;}
h4,.h4 {font-weight: normal;font-size: 18px;font-size: 1.125rem;}
h5,.h5 {font-size: 15px;font-size: 0.9375rem;}
h6,.h6 {font-weight: normal;text-transform: uppercase;font-size: 13px;font-size: 0.8125rem;}

☆ポイント☆

WordPressテーマによってh1~h6スタイルシートのCSSの書き方は異なります。

WordPress機能の外観→テーマの編集→テーマヘッダー(header.php)内の<head></head>に<style>~</style>を作成してコピー貼り付けを行います。

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title><?php wp_title( '|', true, 'right' ); ?></titile>
<style> ← 作成

※ここにコピー貼り付け

</style> ← 作成
<?php wp_head(); ?>
</head>

☆ポイント☆

WordPressテーマによってテーマヘッダーのPHPの書き方は異なります。

CSS見出しインライン化は簡単なのでちゃっちゃとやっちゃいましょうね。その他の項目も時間をかけてもインライン化はやるべきです。その他CSSのインライン化は使用されるテーマによって異なります。方法は上記手順と変わらないので時間を作ってドンドンインライン化を行って下さい。

☆ポイント☆

CSSのインライン化を行う項目はブログを表示された時に処理されるCSSになり主な対象は以下のようになります。

ヘッダー(長さ・高さ)・記事部分(幅・高さ)・サイドバー(幅・高さ)・フッター(幅・高さ)・タイトル(大きさ・位置)・その他機能(幅・高さ・位置)・デフォルト文字(大きさ・文字の間隔・文字のフォント)・画像(高さ幅率%)等々

内部SEO レンダリングをブロックしている JavaScript・CSS を排除する方法

JavaScript・CSS 排除する方法

表示速度=レンダリングといいます。レンダリングを上げる方法について細かく記載した記事です。レンダリングを上げる方法として今回紹介したCSSだけでは無く、JavaScriptでも大きな表示速度のロスを与えている場合があります。SEO対策においてこの事項はかなり重要項目になります。

 

ピンバック機能の削除

WordPress同士で作成された自分のブログサイトに誰かがリンクを貼るとこちらも勝手にリンクを貼る機能になります。関連性の強い同一内容のブログならSEO対策の恩恵は受けれますが、そんなに世の中甘く無く全く関係の無いブログサイトからのリンクが大量に貼られたりしたりします。今のSEOにとってその事は大きなマイナスに繋がる可能性が大なので、私はこの機能を削除する事を強くお勧めします。

ヘッダーPHP

<link rel="pingback" href="<!--?php bloginfo( 'pingback_url' ); ?-->">

無駄なリンクの削除

テーマを選んだ後デフォルト状態なのにも関わらず既に幾つかリンクが貼られています。あなたのブログに沿ったリンク元なら問題ないのですが、99.9%の方が全く関係の無いリンク元になりますので削除しましょう。

ヘッダーPHP

<link rel="profile" href="http://gmpg.org/xfn/11">

フッターPHP

?php printf( esc_html__( 'Codilight Theme by %1$s', 'codilight-lite' ), 'a href="'. esc_url( 'http://www.famethemes.com/themes' ) .'"FameThemes' ); ?

フッターPHP

<a href="<?php echo esc_url( __( 'http://wordpress.org/', 'reddle' ) ); ?>" title="<?php esc_attr_e( 'A Semantic Personal Publishing Platform', 'reddle' ); ?>" rel="generator"><?php printf( __( 'Proudly powered by %s', 'reddle' ), 'WordPress' ); ?></a>
<span class="sep"> | </span>
<?php printf( __( 'Theme: %1$s by %2$s.', 'reddle' ), 'Reddle', '<a href="http://wordpress.com/themes/reddle/" rel="designer">WordPress.com</a>' ); ?>

無駄な見出しの排除

WordPressのテーマの各箇所においてh1とh2が使われています。例えば私の場合メインタイトルの初心者がもの申す部分にはh1が使われていたりします。今のSEO対策における見出しの効果は余り見いだせないですが、文字の協調はユーザーの利便性に繋がる項目になり私としてはこの部分は是非直しておかなければならない項目の一つだと思っております。

テーマによって異なる部分は有りますが私のテーマで無駄な見出し部分の紹介を致します。

無駄な見出し場所

ヘッダーPHP

<h1 class="site-title"><a href="' . esc_url( home_url( '/' ) ) . '" rel="home">' . get_bloginfo( 'name' ) . '</a></h1>

まだ許せる見出し場所になります。ブログタイトルを売り込みたい場合はこの箇所は無視しても結構です。むしろ有った方がいい項目です。ブログタイトルでは無く投稿記事で勝負されている場合はここのh1は取り除かれた方がいいです。

コメントPHP

<h2 class="comments-title h3">
<?phpprintf( // WPCS: XSS OK.esc_html( _nx( '1 Comment', '%1$s comments',get_comments_number(), 'comments title', 'codilight-lite' )),number_format_i18n( get_comments_number() ));?></h2>

コメントタイトルにh2が使用されています。

<h2 class="screen-reader-text"><?php esc_html_e( 'Comment navigation','codilight-lite' ); ?></h2>

コメント文字にh2が使用されています。

<h2 class="screen-reader-text"><?php esc_html_e( 'Comment navigation','codilight-lite' ); ?></h2>

上記と全く同じでコメント文字にh2が使用されています。

見出しh2はご存知のとうりブログで言う各説明のタイトルと同様に非常重要な見出しとなります。その見出しh2がコメントで使用されているのは非常に無駄になります。では簡単に是正方法を説明致します。

無駄な見出しの直し方

この見出しh2を見直す方法は2とうり有ります。

  1. CSSを完全に見直し対処する。
  2. h2より重要度の低い見出しコードを使用する。

1の対処方法は非常に大変になりコードも複雑で増えます。それよりも簡素的に出来る2の対処方法をお勧めします。

先程のh2が使用されている無駄な部分に優先度の低いh6を使用して対処します。

<h6 class="comments-title h3">
<?phpprintf( // WPCS: XSS OK.esc_html( _nx( '1 Comment', '%1$s comments',get_comments_number(), 'comments title', 'codilight-lite' )),number_format_i18n( get_comments_number() ));?></h6>

凄く簡単な対処方法になるので直に対応される事をお勧めします。まず無いとは思いますがレイアウト崩れの可能性も0では無いので、各ブラウザにて確認される事をお勧めします。

 

ここまでの項目がWordpressを最初から始めたり・テーマを変更されたりした時にやっておいた方がいい最低限のSEO対策になります。一番時間の掛かるCSSのインライン化は出来るだけ早めに仕上げる様にした方がいいですね。見返りは人によって評価は違うと思いますが見た目で分かる程には期待は出来ますからね。

 

関連記事一覧

SEO対策検索順位チェックツール GRC凄くお勧めする理由 
最低限必要な2つのSEO対策ツールの使い方 初心者の方必見です
SEO これぞ!!内部リンク効果的な使い方・貼り方・最適化
スポンサーリンク

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です