Google のSEO対策

Google の検索結果に自身のウェブサイトが表示されるようになりましたが、SEO対策については行きあたりばったりでやっていたので、一度立ち止まってGoogle のSEO についての基本的なことを整理しておこうと思います。
WordPress のブログ立ち上げの流れなので、WordPress と絡めた整理になります。

1. はじめに

Google の検索結果に自身のウェブサイトが表示されるようにするためには、Google にインデックス登録してもらう必要があります。
クローラ等によりウェブサイトのページが検出されますが、検出されたページは内容を分析された上でGoogleインデックスに登録されます。

インデックスとは

ウェブサイトのURLを登録するGoogleの大規模なデータベースのことをインデックスと呼びます。インデックスに登録されると検索結果に表示されるようになります。

ちなみに、インデックスという用語は、Google検索セントラルというGoogle のSEO関連のサポート用のページで下記のような使い方をされていました。

  • (Googleは)定期的にウェブを探索し、見つかったサイトを Google のインデックスに登録しています
  • Google はインデックスに追加するサイトを自動で探しています

また、インデックスを使った以下のような表現もあります。

  • Googleインデックス
    • Googleのインデックスのこと
  • インデックス登録
    • クローラが検出したページの内容を把握しようとするプロセスのこと
    • インデックス登録をリクエスト:ウェブサイトの運営者がGoogleにインデックスの登録を依頼すること

2. Google がウェブサイトを検出する方法

Google がウェブサイトのページを検出する方法は、いろいろな方法があるようですが、ここでは下記の3つのパターンに分けて整理してみようと思います。

  • Googleのクローラによるウェブサイトの検出
  • ウェブサイトの運営者からのインデックス登録の依頼
  • ウェブサイトからの更新の通知

それぞれ、章を分けて説明します。

3. Google のクローラによるウェブサイトの検出

Googleのクローラは、既知のウェブサイトのリンクをたどる等により新しいページや更新されたページを検出します。

クローラとは

正式には「ウェブクローラ」。
定期的にウェブを探索して、新しいページや更新されたページを検出するプログラムのことをクローラと呼びます。
また、クローラに関連する用語に以下のようなものがあります。

  • クローリング
    • クローラがウェブを探索すること
  • クロール
    • 「クローリング」と同じ意義
  • クローラビリティ
    • ウェブサイトのページが クローラからアクセス可能なこと、および正しく認識されること
  • Googlebot
    • Google のクローラの総称

クローラによるページの検出は以下の方法で行われます。

  • 既知のページのリンクをたどって検出
  • ウェブサイトの運営者から提出されたサイトマップのURLを元に検出

既知のページのリンクをたどって検出

ウェブサイトが他のブログやウェブサイトでリンク付きで紹介されていると、そのリンクのURLをたどってクローラがページを検出します。

ウェブサイトの運営者から提出されたサイトマップのURLを元に検出

Google Search Console を使ってウェブサイトのサイトマップのURL をGoogle に送信すると、クローラがサイトマップに記述されているページのURL にアクセスしてページを検出します。

4. ウェブサイトの運営者からのインデックス登録の依頼

Google Search Console を使ってインデックス登録したいページのURL をGoogle に送信すると、クローラがそのURL にアクセスしてページを検出します。

5. ウェブサイトからの更新の通知

外部のウェブホストなどからの、新しいページや更新されたページがあることの通知を受けて、クローラがそのページのURL にアクセスしてページを検出します。

調べてみると、この方法がインデックス登録に有効に働くのか良くわからないですが、仕組み自体がなくなっている訳ではないので記載しておきます。

更新情報サービス(XML-RPC ping)

WordPress は標準で、投稿の新規作成や更新をすると、更新情報サービスの設定で登録したURL に向けてXML-RPC ping を送信して、投稿の新規作成や更新があったことを通知する機能があります。
※ XML-RPC ping は、リクエストボディをXML で記述したPOST のHTTP リクエスト

更新情報サービスは、サイドメニューの[設定] > [投稿設定] で登録することができます。

サイドメニューの[設定] > [投稿設定] > 更新情報サービス

デフォルトで”Ping-o-Matic” というWordPress Foundation が運営している更新情報サービスのURLが登録されています。

ここに、他の更新情報サービスのURL を追加すれば、追加したURL にもping が送信されるようになります。

WordPress.org の「更新通知サービス」のページに、例として更新情報サービスのURLがたくさん掲載されていますが、”停止しているものもあるかもしれませんのでご注意下さい” と注意書きがあるので、単純に全てコピペすればOKという訳ではなさそうです。

試しにいくつかのURLにアクセスしてみると、301エラー(Moved Permanently)や404エラー(Not Found)が返ったり、ドメインの名前解決ができないものがありました。現在ではあまり活用されていない仕組みなのでしょうか。

ちなみに、Google は2014年頃にブログ検索というサービスが終了した時点でpingを受けなくなっているようです。

個人的には、意味のない通信を送出するのはあまり気持ちの良いことではないので、当ブログには元々登録されていたPing-o-Matic だけ登録した状態にしておくことにしました。

WebSub(旧名:PubSubHubbub)

WordPress の標準機能ではないですが、プラグインを追加することで前述の「更新情報サービス(XML-RPC)」と同じような、投稿の新規作成や更新をすると、投稿の新規作成や更新があったことを通知するWebSub(旧名:PubSubHubbub)という仕組みを使うことができます。

WebSub のことを簡単に記載しておきます。

  • WebSub はPublisher、Subscriber、Hub の三者で構成される
  • ブログの場合、Publisher(ブログ)、Subscriber(Google)、Hub(Hubサービス) という位置づけになる
  • Publisher が投稿を追加するとHub に通知され、通知を受けたHub はSubscriber にPublisher の投稿が追加されたことを通知する

WordPress のプラグインは下記の2つがよさそうでした。

  • WebSub (FKA. PubSubHubbub)
    • PubSubHubbub Team が開発している
    • WordPress 5.9 リリースの翌日に5.9の対応版がリリースされた(最終更新日:2022/1/27)ので、継続してメンテナンスされていることが期待できる
    • デフォルトの通知先:Google PubSubHubbub Hub、SuperFeedr、WebSubHub
  • PuSHPress
    • Automattic 社がプラグインの開発に関わっている
    • プラグインにHub が組み込まれているので、WordPress からの通知はSubscriber に直接送られる(他のプラグインは、WordPress →Hub →Subscriber の経路で送られる)

当ブログでは、WebSub (FKA. PubSubHubbub) プラグインを使うことにしました。
通知先のHub は、サイドメニューの[設定] > [WebSub] で登録することができます。

WordPressの管理画面 サイドメニューの[設定] > [WebSub]

デフォルトで3つのHub のURL が登録されていました。
一番上の”https://pubsubhubbub.appspot.com” は”google” という文字がないですが、Google のHub のようです。

6. Google Search Console について

過去の投稿でGoogle Search Console を使ってサイトマップの送信とインデックス登録について記載しているので、ここではGoogle Search Console の便利なツールについて簡単に記載します。

サイトマップの登録

サイトマップのURL をGoogle に登録することができます。
登録しておくと、Google はサイトマップに更新がないかを定期的に確認するようになります。

URL検査(インデックス登録)

ウェブサイトの特定のURL に対して、Google にインデックス登録を依頼することができます。
インデックスに登録するかどうかは、Google がページを分析して決定するので、依頼すれば必ず登録される訳ではないです。

robots.txt テスター

robots.txt に対して、以下のチェックをすることができます。

  • robots.txt の構文とロジック上の問題がないかのチェック
  • ウェブサイト上の特定のURLに対して、Google のクローラをブロックできているかのチェック

後者は、例えばGoogle画像検索で表示されたくない画像のURLに対して、Googlebot-Image クローラをブロックできているかのテストができます。

モバイルフレンドリーテスト

ウェブサイトの特定のURL に対して、以下のチェックをすることができます。

  • モバイルデバイスでのページの使いやすさのテスト
  • クローラがページにアクセス可能で、コンテンツを正しく認識できるかのテスト

7. あとがき

SEO の基本を整理しよう、ということでGoogle のSEO対策についてざっと整理してみました。なんとなく要点はつかめたような気がしています。

これまでSEO ということでGoogle のことを取り上げていましたが、今後はMicrosoft のBing のSEO対策など、横に展開することもしていきたいと思います。

参考

Google Search Console(その2)

前々回の投稿「WordPressのサイトマップ」でサイトマップをGoogleに送信しましたが、その後なかなかGoogleの検索結果に表示されないのでGoogleの「初心者向けSEO」というページを調べてみると、Search Console の[URL検査] というツールでインデックス登録の依頼ができることが分かりました。
以下、その作業記録を記載します。

Googleにインデックス登録を依頼する

1. Search Console のページを開く

Google Search Console のページを開き、左上のプロパティが対象のウェブサイトのURL が選択されていることを確認します。

Search Console

2. URL検査 の実行

サイドメニューの[URL検査] ボタンをクリックすると、検索窓へのURLの入力を求められるので、自身のウェブサイトのURLを入力します。
今回、「https://madoverload.com」を入力しました。

すると、URL検査の処理が開始され、しばらくすると検査結果として下記のメッセージが表示されました。

URLがGoogleに登録されていません
検査結果(インデックスの登録)
検出-インデックス未登録
検査結果(カバレッジ)

どうやらエラーはないけれども、まだインデックスに登録されていないようです。

3. 公開URLをテスト

URL検査の検査結果が表示されたページの右上の[公開URLをテスト] ボタンをクリックします。
この[公開URLをテスト]は、指定したURL がGoogle でインデックス登録ができるかどうかを確認する機能のようです。

公開URLをテストしています
公開URLをテスト実行中

公開URLのテストが完了すると、検査結果の文言が更新されました。
・更新前:URLがGoogleに登録されていません
・更新後:URLはGoogleに登録できます

URLはGoogleに登録できます
検査結果(公開URLのテスト後)
検査結果(登録の可否の詳細)

登録の可否に記載されているメッセージ「特定の条件が満たされている場合にのみ、URLはインデックスに登録されます」の特定の条件のリンク先を見てみると、インデックスの登録が上手く行かない時に役立ちそうな情報が記載されていたので、リンク先を記載しておきます。

4. インデックス登録をリクエスト

URL検査の検査結果の”インデックス登録をリクエスト” がリンクになっているのでクリックすると、下記のメッセージが表示されました。

インデックス登録をリクエスト済み

ウィンドウ右下のOKをクリックして検査結果のページに戻ると、リンクになっていた箇所の文言が更新されました。
・更新前:インデックス登録をリクエスト
・更新後:インデックス登録をリクエスト済み

検索結果(インデックス登録をリクエスト後)

5. インデックスの登録完了

翌日、URL検査を再度実行してみると、検査結果がインデックスに登録さたという内容に更新されていました。

検査結果(インデックス登録をリクエストの翌日)

Googleでsite:クエリにドメイン名を指定して検索してみると、検索結果に表示されるようになっていました。

Google検索結果「site:madoverload.com」

あとがき

ブログを開設してから1ヶ月過ぎていますが、ようやくGoogleの検査結果に表示されるようになりました。

今回、ブログを開設してからGoogleの検索結果に表示されるようになるまで、ざっくり表現すると、下記の流れでやりました。

  1. WordPress のブログ開設
  2. サイトマップの作成
  3. Googleにサイトマップ送信
  4. Googleにインデックスの登録を申請
  5. Googleのインデックスに登録(検索結果に表示される)

SEO対策について詳しくないので、行きあたりばったりなところがありましたが、正直なんとかなったという感じです。

SEO対策に力を入れるつもりがなくても、SEOの基本的なことの理解が不十分であることが分かったので、この機会にいろいろ調べて整理しようと思います。(その投稿がいつできるかは整理の進み具合により時間がかかる可能性があるので未定)

参照

Google Search Console(その1)

直前の投稿「WordPressのサイトマップ」で、ブログのサイトマップをGoogle Search Console を使ってGoogle に送信しましたが、このSearch Console を使い始める際の手順を記載していなかったので記載しておきます。

Search Console についての解説は最低限に留め、あくまでも今回の作業記録を記載します。

Google Search Console とは

Google が提供する無料のサービス(ツール郡)で、自身のウェブサイトのコンテンツをGoogle に送信したり、Google での検索の状況を確認することができます。

Google Search Console を始める

1. Search Console にアクセス

Google検索セントラルのサイトにアクセスして[ご利用開始] ボタンをクリックして表示されるページで、[Search Console に移動] ボタンをクリックします。

2. プロパティタイプを選択

登録するウェブサイトをドメインまたはURL のどちらで指定するのかを選択します。

プロパティタイプの選択

ドメインとURLプレフィックスの違いを簡単に記載しておきます。

ドメインURLプレフィックス
ウェブサイトの入力
(例)
example.com
sub1.example.com
https://example.com
https://www.example.com
https://sub1.example.com
所有権の確認方法ドメイン名プロバイダ以下のいずれか
・HTMLファイル
・HTMLタグ
・Google Analytics
・Googleタグマネージャー
・ドメイン名プロバイダ
比較(ドメイン⇔URLプレフィックス)

今回、”URLプレフィックス” を選択したので、下記のように自サイトのURLを入力して[続行] ボタンをクリックしました。

URLプレフィックスを選択

3. 所有権の確認(URLプレフィックス)

プロパティタイプ:”URLプレフィックス” を選択すると、所有権の確認方法を選択するページが表示されます。

所有権の確認 > HTMLファイル

所有権の確認は、下記の5つの方法から選択できます。

内容
HTMLファイル指定されたHTMLファイルを自身のウェブサイトのルートフォルダにアップロードする
HTMLタグ指定されたHTMLメタタグを自身のウェブページのHTMLページのheadタグ内に記述する
※<meta name=”google-site-verification” 〜
Google AnalyticsGoogle Analytics のアカウントを使用する
(自身のウェブページのHTMLページのheadタグ内に以下を記述する)
・Google アナリティクス タグ
・トラッキング コード
GoogleタグマネージャーGoogleタグマネージャーのアカウントを使用する
(自身のウェブページのHTMLページのbodyタグ内に以下を記述する)
・タグ マネージャー コード
ドメイン名プロバイダ指定されたTXTレコードを自身のウェブサイトのDNSレコードに追加する
所有者の確認方法

今回、”HTMLファイル” を選択しました。
以下、HTMLファイルで所有権の確認をする手順を記載します。

  1. 「1. ファイルをダウンロード」の「↓ xxxx〜xxx.html」ボタンをクリックして、HTMLファイルを端末上にダウンロードする
  2. FTPツール(FileZilla など)を使って、ダウンロードしたHTMLファイルを自身のウェブサイトのルートフォルダにアップロードする
  3. アップロードしたファイルのパーミッションを読込のみ(404など)に変更する
  4. 所有権の確認の[確認] ボタンをクリックすると所有権の確認処理が始まり、下記の”所有権を証明しました” のページが表示された
所有権を証明しました

4. 所有権を証明した後の作業

この後、直前の投稿「WordPressのサイトマップ」の「サイトマップをGoogle に送信する」に記載した作業を行いました。

あとがき

今回、プロパティタイプは”URLプレフィックス”、所有権の確認は”HTMLファイル”を選択した理由を記載しておきます。

  • プロパティタイプ:”URLプレフィックス” を選択した理由
    • 所有権の確認を”HTMLファイル”にしたかったため
  • 所有権の確認方法:”HTMLファイル” を選択した理由
    • ブログのウェブページとDNSサーバの設定に影響がない
    • 他の確認方法と比べて、第三者が確認方法を特定しづらい
    • 静的HTMLファイルをサーバーに配置するのみで容易
    • Google Analytics と Googleタグマネージャーを使っていない

今後、以下のようなことがあれば、変更を検討することになりそうです。

  • Google Analytics を使うことになった場合、”Google Analytics”
  • Googleタグマネージャーを使うことになった場合、”Googleタグマネージャー”
  • サブドメインを使うことになった場合、サブドメイン向けの”HTMLファイル”を追加するか、プロパティタイプを”ドメイン”に変更する
  • 所有権の確認が2つ以上の方法で行われるようにしたくなった場合、HTMLファイル+HTMLタグ+ドメイン名プロバイダ

参照

WordPressのサイトマップ

WordPress のサイトマップについて調べてみました。

サイトマップとは

サイトマップは、ウェブサイトの投稿やページ、その他のファイルの情報を記述したファイルで、Google などの検索エンジンがこのファイルを読み込むことで、ウェブサイトの情報を効率的に収集することができるようになります。

サイトマップにはオプションとして、コンテンツがいつ更新されたのかや、ウェブサイトがどれぐらいの頻度で更新されているのか等の検索エンジンにとって有益な情報を記述することもできます。

サイトマップの記述ルール等の仕様は、大手検索エンジンのGoogle、Yahoo、Microsoft で標準化を行っています。

  • Sitemaps.org − Sitemap.org (スポンサー:Google、Yahoo、Microsoft)

WordPress 標準のサイトマップ

WordPress は標準でサイトマップが出力されるようになっています。
以前はプラグインが必要でしたが、どうやらWordPress 5.5 で出力されるようになったみたいです。

サイトマップの場所は、ルートの”wp-sitemap.xml” です。
当ブログのサイトマップは下記のURLになります。
※ “sitemap.xml” にアクセスすると”wp-sitemap.xml” にリダイレクトされるようになっていました。

ブラウザからアクセスすると、下記のように表示されます。

WordPress標準のサイトマップ

なお、デフォルトのままでは問題や改善すべき点があったので、以下その対応について記載します。

ユーザ名を非表示にする

デフォルトでは”wp-sitemap-users-1.xml” というサイトマップにWordPress に登録しているユーザのユーザ名が表示されてしまうので、function.php を更新してこのサイトマップを非表示にします。
※ ユーザ名が漏洩すると、攻撃者に管理画面でユーザ名を固定したパスワードのブルートフォース攻撃の機会を与えてしまうので、ユーザ名の漏洩はセキュリティの観点であまり望ましくないことと考えています。

function.php に下記を追記します。(末尾に追記しました)

/**
 * Removing Certain Sitemaps
 * users
 */
add_filter(
    'wp_sitemaps_add_provider',
    function( $provider, $name ) {
        if ( 'users' === $name ) {
            return false;
        }
        return $provider;
    },
    10,
    2
);

これで、“wp-sitemap-users-1.xml” が出力されなくなりました。

“wp-sitemap-users-1.xml” が表示されなくなった

最終更新日を表示する

デフォルトでは最終更新日が出力されないので、function.php を更新して出力されるようにします。
※ 最終更新日がないと、検索エンジンのクローラがコンテンツがいつ更新されたのかや、ウェブサイトがどれぐらいの頻度で更新されているのか等が判断できないので、表示した方がよいみたいです。

function.php に下記を追記します。(末尾に追記しました)

/**
 * Adding Additional Tags to Sitemap Entries
 * lastmod
 */
add_filter(
    'wp_sitemaps_posts_entry',
    function( $entry, $post ) {
        $entry['lastmod'] = date('c', strtotime($post->post_modified_gmt));
        return $entry;
    },
    10,
    2
);

これで、下記のように最終更新日が表示されるようになりました。

最終更新日が表示されていない
最終更新日が表示されるようになった

なお、後述「サイトマップのカスタマイズについて」で案内しているリンク先に最終更新日を追加するサンプルコードが記載されていますが、そのままだと日付の書式がW3C Datetime フォーマットになっていなかったので、W3C Datetime フォーマットで出力されるようにしました。
(Google Search Console でサイトマップのステータスが、”無効な日付” でエラーになっているのがこれで解消されました)

サイトマップのカスタマイズについて

他にも、カスタムサイトマップの追加や、特定の投稿やページの除去、サイトマップ自体を完全に表示しないようにするなど色々できるみたいです。
詳しくは、以下のサイトをご参照ください。

サイトマップまわりの仕組み

robots.txt

robots.txt は、検索エンジンのクローラに対して、サイトのどの URL にアクセスしてよいかを伝えるものです。
robots.txt の場所は、ルートの”robots.txt ” です。
当ブログのrobots.txt は下記のURLになります。

WordPress 標準のサイトマップが出力される状態でrobots.txt を見てみると、下記のようにサイトマップのURLが記述されていました。
この記述により、クローラがサイトマップファイルを見つけることができるようになります。

Sitemap: https://madoverload.com/wp-sitemap.xml

robots メタタグ

robots メタタグは、HTMLページのheadタグ内に「<meta name=’robots’ 〜」と記述するもので、ページ単位で検索エンジンに対して、登録の是非や、ユーザに対して検索結果をどのように表示してもらいたいのかを指定するものです。
当ブログのHTMLページのrobots メタタグは下記の記述になっていました。

<meta name='robots' content='max-image-preview:large' />

WordPress の設定

WordPress の設定画面で、検索エンジンのクローラにサイトマップやページを読み込んでもらいたいかどうかを設定することができます。
管理画面の[設定] > [表示設定] の”検索エンジンでの表示” で行います。

管理画面の[設定] > [表示設定]

“検索エンジンがサイトをインデックスしないようにする” のチェックをOFFにしていると、サイトマップ、robots.txt、robots メタタグはこれまで説明した状態になっていました。

試しにチェックをONにすると、下記の状態になりました。

  • サイトマップのURLにアクセスすると、”お探しのページが見つかりません”というWordPressのページが表示される
  • robots.txt から「Sitemap: https://madoverload.com/wp-sitemap.xml」が消える
  • robots メタタグが下記の記述になる(noindexはページをインデックスに登録してもらいたくない、nofollowはページのリンクを辿ってもらいたくない)
<meta name='robots' content='noindex, nofollow' />

当ブログはもう初期設定も終え、投稿もいくつかしているのでチェックをOFFにして検索エンジンのクローラを受け入れる状態にしておきますが、ブログの開設中はチェックをONにしておいた方がよかったのかもしれません。
(とはいえブログを開設して1ヶ月経ちますが、ドメイン名をググってもヒットしませんでした)

サイトマップをGoogle に送信する

当ブログは開設して1ヶ月になりますが、誰も存在を知らない状態です。Twitter への自動投稿でブログのURLを貼るようにしましたが、アクセス数が0という日も普通にあります。

せっかくサイトマップが出力されるようになっているので、Google にサイトマップの存在を知らせてインデックスに登録してもらうよう働きかけてみたいと思います。

調べてみると、Google Search Console にサイトマップを送信することで、それができるようです。
以下、その手順を記載します。

1. Search Console にブログを登録する

サイトマップをGoogle Search Console に送信する為には、Search Console に自身のウェブサイトのドメインまたはURLを登録して、そのウェブサイトが自身に所有権があることを証明する必要があります。
具体的な手順は省略しますが、今回は下記で行いました。

  • プロパティタイプの選択:URLプレフィックス
  • 所有権の確認:指定されたHTMLファイルをダウンロードして自サイトにアップロード

2. Search Console にサイトマップを送信する

Search Console にウェブサイトを登録すると、Search Console の管理画面が表示されます。
サイドメニューの[インデックス] > [サイトマップ] をクリックすると、”新しいサイトマップの追加” というサイトマップのファイル名を入力するフォームが表示されるので、ファイル名を入力して[送信] ボタンをクリックします。

サイドメニューの[インデックス] > [サイトマップ]

サイトマップの送信が完了すると、下記のメッセージが表示されます。

[OK] ボタンをクリックすると元の画面に戻り、送信する前は何も表示されていなかった”送信されたサイトマップ” に、今回送信したサイトマップが表示されます。
送信してすぐはステータスが”取得できませんでした” となっていましたが、1〜2分待つと”成功しました” に更新されました。

サイドメニューの[インデックス] > [サイトマップ]

ここで、送信したサイトマップをクリックすると、読み込まれたサイトマップの処理結果を確認することができます。

読み込まれたサイトマップ(エラーあり)

ステータスがエラーになっているサイトマップがあるので、エラーになっているサイトマップをクリックすると詳細情報が表示されます。

サイトマップの詳細情報(エラー)

サイトマップの読み込みはできるようですが、「親タグ:url、タグ:lastmod」の日付の値に問題があるということです。

このエラーは、前述「最終更新日を表示する」に記載した最終更新日の日付の書式がW3C Datetime フォーマットになっていなかったことが原因によるもので、W3C Datetime フォーマットで出力されるようにすることで解消することができました。

読み込まれたサイトマップ(エラーなし)

エラーが解消されたサイトマップをクリックすると、詳細画面も”サイトマップは正常に処理されました” となっていました。

サイトマップの詳細情報(正常)

なお、エラーの原因を解消しても直ぐにはステータスが更新されず、24時間経ってから見てみるとステータスが”成功しました” に更新されていました。
試しに、送信した日にSearch Console に登録したサイトマップを削除し、再度”新しいサイトマップの追加” をしてみたのですが、エラーのままだったので、この登録はキャッシュに登録されて定期的に処理されているのかもしれません。

サイトマップの再送について調べてみると、Search Console のヘルプに「サイトマップを変更した場合でも、Google がすでに認識しているサイトマップを再送信する必要はありません。Google は、次にサイトをクロールしたときに、変更を検出します」という記載がありました。
これは、再送は即時に反映される訳ではないということの裏返しの表現なのかもしれません。

あとがき

サイトマップを表示させるためにはプラグインの導入が必要と思っていましたが、調べてみるとプラグインがなくてもなんとかなりました。
ただ、プラグインを入れたからこそできることというのがあるかもしれないので、もし必要にかられたら導入を検討したいと思います。

サイトマップのGoogle への登録が成功し、エラーもなくなりましたが、今回の作業が完了した後にドメイン名をググってもヒットしませんでした。
はたして、いつになったら検索結果に表示されるのでしょうか。。

参考

WordPress→Twitter の導線

WordPress のブログからTwitter への導線について考察してみます。
ブログを見に来てくれた人がTwitter をやっていることに気づき、ツイートを見に来たり、アカウントをフォローする流れが感覚的にできる状態になっているのかを整理したいと思います。

Twitter のフォロアーになってくれれば、タイムラインに流れるTwitter へのブログの自動投稿が目に入り、ブログに来てくれることにつながるので、ブログとTwitter の両方を運用するのであれば意識しておいた方がよさそうです。

1. Twitter をやっていることに気づく

ブログのトップページや投稿のページを開いた時は、PCとスマホともに画面上にTwitter をやっていることがわかるボタンやアイコンは表示されていないです。
ただ、投稿を読んで気に入ってくれた時に気づいてもらえれば良いというのと、デザイン上もページが表示された時にあまり雑音がない状態にしておきたいので、これでよいことにします。

上記の「投稿を読んで気に入ってくれた時に気づいてもらえれば良い」という点で、投稿の下には共有ボタンを表示するようにしてあります。

また、PCではサイドバーが右に表示されるので、投稿を読んでいる途中でサイドバーにあるTwitter ボタン(フォローボタンとメンションボタン) に気づいてもらえるかもしれません。

あと、ページの先頭になければ末尾に探しに行くという行動を想定して、ページの末尾のフッター部にTwitter アイコンを表示してあります。

2. Twitter のツイートを見に来たり、アカウントをフォローする

投稿の共有ボタン

投稿の下に共有ボタンを表示してあります。
投稿の先頭に配置してもよいのかもしれませんが、投稿を読み終わった時にそのままシェアという行動に移れるので、ここに配置するのが自然かと思います。

共有ボタンをクリックすると、Twitter のツイートするウィンドウが開き、そこには投稿のタイトルとURLが既に入力された状態になります。

サイドメニューのTwitterボタン(フォローボタン)

サイドバーに“@RodentGiantさんをフォロー” というボタンを表示してあります。
このボタンのデザインから、このボタンをクリックすればフォローする流れにつながると予想できると思います。

ボタンをクリックすると、Twitterアカウントのページが開き、[フォロー] ボタンが表示されるようになっています。

サイドメニューのTwitterボタン(メンションボタン)

サイドバーに”@RodentGiantさんへツイートする” というボタンを表示してあります。
このボタンのデザインから、このボタンをクリックすれば@RodentGiant 宛にツイートする流れにつながると予想できると思います。

ボタンをクリックすると、Twitter のツイートするウィンドウが開き、そこには”@RodentGiant” が入力された状態になります。

このTwitter ボタンはTwitter Publish で生成したHTMLコードをウィジェットに貼り付けて表示しています。

ページ末尾のTwitterアイコン

ページの末尾のフッター部にTwitter アイコンを表示してあります。
鳥の絵だけの文字がないアイコンのデザインなので、このアイコンをクリックすればTwitter のアカウントのページが表示されると予想できると思います。

このアイコンはWordPress 標準のソーシャルリンクメニューを使って表示しています。
以下、表示させる手順を記載します。

  1. [外観] > [メニュー] をクリック
  2. [メニューを編集]タブの[メニュー構造] を編集する
    • Twitter 以外(Facebook、Instagram、メール)のカスタムリンクを削除
    • Twitter のURLに自身のTwitter アカウントのURLを指定
  3. [メニュー設定] の[メニューの位置] にある”ソーシャルリンクメニュー” のチェックを入れて、[メニューを保存] ボタンをクリック

※ 上記の手順だけでなく、[外観] > [カスタマイズ] > [メニュー] > [サブメニュー] でも同じ設定ができます。

3. その他

投稿の本文へのツイートの埋め込み

直前の投稿「Twitter Publish」で記載した方法で、Twitter の特定のツイートを投稿に埋め込むことができるので、ここからTwitter のツイートのページを表示させることができます。

位置づけがなんとなく上記「2. Twitter のツイートを見に来たり、アカウントをフォローする」と違うのでその他として記載しておきました。

  • 自分以外のTwitter アカウントのツイートの埋め込み
    • クリックすると、その人のツイートが表示される
    • 投稿に誰かのツイートを掲載したい時に使う
  • 自分のTwitter アカウントのツイートの埋め込み
    • クリックすると@RodentGiant のアカウントのツイートが表示される
    • 自分のツイートを掲載したい時に使う(やる機会があまりなさそう)

あとがき

投稿の共有ボタンを表示する方法について、今回は記載しませんでした。機会があったら書こうと思います。

参照

Twitter Publish

自身のブログやホームページにTwitter のツイートやボタンを埋め込む方法として、Twitter社がTwitter Publish というサービスを提供しています。
Twitter Publish − Twitter

使い方

1. URLを指定

“What would you like to embed?” と表示されているので、埋め込みたいページのURLを入力して[→] をクリック。

URLを指定

2. タイムラインの埋め込み(左)かTwitter ボタン(右)か選択

“Here are your display options” と表示されているので、”Embedded Timeline”(左)か”Twitter Buttons”(右)のどちらかをクリック。

選択(タイムラインの埋め込み、Twitterボタン)

3. タイムラインの埋め込み

“Embedded Timeline” を選択すると、
埋め込み用のHTMLタグが表示されるので、下の方に表示されているプレビューでよければ、[Copy Code] ボタンをクリックして、自身のブログ等に貼り付けます。
※ [Copy Code] ボタンをクリックすると、クリップボードにHTMLタグがコピーされます。

“set customization options” という青文字がリンクになっているので、このリンクをクリックすると、デザインをカスタマイズすることができます。
デザインを選択するオプションが表示されるので、適宜変更して[Update] をクリック。

4. Twitter ボタン

Twitter Buttons” を選択すると、
“Select the button you’d like to use” と表示されるので、”Follow Button”(左)か”Mention Button”(右)のどちらかをクリック。

選択(フォローボタン、メンションボタン)

4-1. フォローボタン

“Follow Button”(左)を選択すると、
埋め込み用のHTMLタグが表示されるので、下に表示されているプレビューでよければ、[Copy Code] ボタンをクリックして、自身のブログ等に貼り付けます。
※ “set customization options” のリンクからデザインのカスタマイズが可能

4-2. メンションボタン

Mention Button”(右)を選択すると、
埋め込み用のHTMLタグが表示されるので、下に表示されているプレビューでよければ、[Copy Code] ボタンをクリックして、自身のブログ等に貼り付けます。
※ “set customization options” のリンクからデザインのカスタマイズが可能

実際の埋め込み結果

実際にこのページに埋め込んでみました。
埋め込むと以下のように表示されます。

タイムラインの埋め込み

プロフィールページのURL(https://twitter.com/RodentGiant)

ツイートページのURL(https://twitter.com/RodentGiant/status/1481924474740293645)

Twitterボタン(フォローボタン)

Twitterボタン(メンションボタン)

WordPress での利用

WordPress へのHTMLタグの埋め込み

[Copy Code] ボタンをクリックしてクリップボードにコピーしたHTMLタグは、WordPress ではカスタムHTMLのブロックに貼り付けるだけで、ページに埋め込むことができます。

WordPress の埋め込みブロックの機能

なお、WordPress には埋め込みブロックという便利な機能があるので、埋め込みたいTwitter のページのURLを指定するだけで簡単に、Twitter Publish で作ったHTMLタグを使うのと同じように表示させることができます。
デザインのカスタマイズをしたい場合はTwitter Publish を使う、あまり凝らずに簡単に貼り付けたい場合は埋め込みブロックを使う、というように使い分けをしてもよいのかもしれないです。

参照

Twitter はじめました

Twitter のアカウントを作りました。
ブログとTwitter の両方をいい感じに使い分けできればと思います。

いい感じに使い分けのイメージ

  • ブログの投稿は情報の整理、Twitter は気軽な備忘録
  • ブログに投稿すると、投稿のリンクが自動でツイートされる

参考

  • Twitter − Twitter の公式サイト

WordPressのユーザーのアバター

WordPress のユーザーのアバターを設定します。ここでいうアバターはアイコン画像のことで、管理画面のログインユーザや投稿の投稿者の表示などで使われます。

WordPress のユーザーのアバターは、Gravatar というサービスにアカウントを作りアイコン画像を登録することで、WordPress 上に表示されるようになります。管理画面でアイコン画像をアップロードして設定するということはできないようです。

Gravatar とは

Gravatar の公式サイトに「Globally Recognized Avatar」と説明があります。登録したアバター(アイコン画像)が世界中の色々なウェブサービス(Slack、GitHubなど)で認識されて、アカウントと紐付けて自動で表示される、という感じでしょうか。
運営はAutomattic というWordPress.com を運営している会社が行っています。この会社はプラグインのAkismet やJetpack の運営も行っていて、2018年にはTumblr社を買収しているので、世間的にはある程度の信頼を得ている会社なのではないかと思われます。
Gravatar(公式サイト)

Gravatar のアカウント登録

Gravatar のアカウント登録は、WordPress.com アカウントを使って行います。つまり、既にWordPress.com アカウントを持っている人はそのアカウントを使ってGravatar のアカウントを登録することができますが、持っていない人は新たにWordPress.com アカウントを登録する必要があるということになります。
WordPress.com(公式サイト)

具体的にアカウント登録の方法は、以下の3つのパターンがあります。

  • 既にWordPress.com アカウントを持ってる人向け
  • 新たにWordPress.com アカウントを登録する人向け(メールアドレスとパスワードを使ってアカウントを登録)
  • 新たにWordPress.com アカウントを登録する人向け(GoogleまたはAppleのアカウントを使ってアカウントを登録)

Gravatar のアカウントを登録するためには、まずはGravatar のウェブサイトにアクセスします。
WordPress の管理画面で、
[ユーザー] > [プロフィール写真] の [Gravatar でプロフィール画像の変更が可能です] のリンクをクリックしてGravatar のウェブサイトにアクセスすることができます。

既にWordPress.com アカウントを持ってる人向け

既に持っているWordPress.com アカウントを使ってGravatar のアカウントを登録します。

  1. Gravatar のトップページにある[Gravatar を作成] ボタンをクリック
  2. [すでに WordPress.com のアカウントをお持ちですか?] のリンクをクリック
  3. 持っているWordPress.com アカウントでログインします。(下記のいずれか)
    • メールアドレスまたはユーザー名とパスワードを使ってログイン
    • GoogleまたはAppleのアカウントを使ってログイン
  4. “Sign in to Gravatar with WordPress.com Connect” で[Sign in with WordPress.com] ボタンをクリック
  5. WordPress.comからメールが送られてくるのでメール本文の[有効化]ボタンをクリックすると、Gravator のアカウントが登録されます

新たにWordPress.com アカウントを登録する人向け(メールアドレスとパスワードを使ってアカウントを登録)

Gravatar のウェブサイト上で、メールアドレス、ユーザー名、パスワードを入力してアカウントを登録する方法です。登録完了後のGravatar へのログインは、登録したメールアドレスまたはユーザー名とパスワードを入力して行います。いわゆるパスワード認証です。

アカウントの登録は以下の手順で行います。

  1. Gravatar のトップページにある[Gravatar を作成] ボタンをクリック
  2. “WordPress.com アカウントを使用して Gravatar にサインアップする” と表示されているページで下記を入力して[アカウントを作成] ボタンをクリック
    • メールアドレス
    • ユーザー名
    • パスワード
  3. “Sign in to Gravatar with WordPress.com Connect” で[Sign in with WordPress.com] ボタンをクリック
  4. WordPress.comからメールが送られてくるのでメール本文の[有効化]ボタンをクリックすると、WordPress.com とGravator のアカウントが登録されます

新たにWordPress.com アカウントを登録する人向け(GoogleまたはAppleのアカウントを使ってアカウントを登録)

WordPress.com とGravatarのアカウントのパスワードを管理したくない人向けです。Gravatarを使う為にはWordPress.com アカウントを持つ必要がありますが、WordPress.com アカウントはGoogle またはApple のアカウントを使ってログインすることができるので、これを利用します。いわゆるソーシャルログイン(SNS認証)です。

手順としては、(1) Google またはApple のアカウントを使ってWordPress.com アカウントを作成してから、(2) 上記”既にWordPress.com アカウントを持ってる人向け” の手順でWordPress.com アカウントでGravatar にログインしてGravatarにサインアップ(Gravatar のアカウントを登録)する、という流れになります。

  • WordPress.com アカウントの作成
    1. WordPress.com のウェブサイトにアクセスします。(ブラウザのアドレスバーに https://wordpress.com を入力してWordPress.com のページを開くなど)
    2. 右上の[始めてみよう]ボタンをクリック
    3. “ここからスタート。まず、WordPress.com アカウントを作成してください” と表示されているページで、下記のいずれかの方法でアカウントを作成する。(細かい手順は省略します)
      • メールアドレス、ユーザー名、パスワードを入力して作成
      • GoogleまたはAppleのアカウントを使って作成
    4. ドメインを選択します
      • 選択窓に任意の名称を入力します。入力した名称が未登録だと、入力した名称をサブドメインとした「入力した名称.wordpress.com」のような無料のドメインが選択できます。
    5. プランを選択します
      • パーソナル、プレミアム、ビジネス、eコマースなど有料のプランが目立って表示されていますが、[無料サイトで開始] のリンクから無料のサイトを選択することが可能です。
    6. WordPress.comからメールが送られてくるのでメール本文の[今すぐ認証]ボタンをクリックすると、WordPress.com のアカウントが登録されます
  • Gravatar アカウントの登録
    • 上記”既にWordPress.com アカウントを持ってる人向け” 参照

Gravatar のアバターを登録

Gravatar アカウントの登録が完了したら、自身のアバター(アイコン画像)をアップロードします。
わたしがアップロードした画像はこちらです。

Capybara dim
Capybara(dim)

ちなみに、Google のカウントにプロフィール写真を登録しておくと、Gravatar アカウントを登録した際にその画像が登録されます。

画像は複数アップロードしておいて選択することができるので、気分でアバターを変えたい場合は使いたい画像をすべてアップロードしておいて、変えたくなったら都度変更するという使い方もよさそうです。

Gravatar への画像の追加は、いろいろなところでできるようです。
・右上のアイコンをクリックして表示されるメニューから[画像を追加] をクリック
・メニューの[マイプロフィール]をクリックし、サイドバーの[フォトギャラリー] を選択して[新規画像を追加]ボタンをクリック
・メニューの[マイGravatar] をクリックし、”2. 新規画像を選択”の”新規画像を追加” のリンクをクリック

Gravatar に画像を追加する方法は下記の4種類の方法があります。
・新規アップロード
・過去のアップロード
・URLから
・ウェブカメラから

この中から”新規アップロード” の手順を記載します。

画像を新規アップロードする手順

  1. [ファイルを選択] ボタンをクリックして端末上の画像ファイルを選択し[次へ] をクリック
    • アップロードする画像のサイズは10MBという制限があります
  2. アップロードした画像の切り抜きを行います。
  3. レーティングの選択
    • 年齢を確認するオプションで、画像が誰に対して表示するのに適切であるのかを指定します。
    • 通常は”G” を選択すると思いますが、子どもには不適切な場合や人によっては不快に感じる可能性がある場合は”G” 以外を設定します。
      • G:誰に対してもOK
      • PG:失礼な振る舞い、挑発的な服装、冒涜的な言葉、軽い暴力を含む
      • R:冒涜的な表現、激しい暴力、ヌード、薬物の乱用等を含む
      • X:ハードコアな性的画像や非常に不快な暴力を含む
  4. 画像に割り当てるメールアドレスを選択
    • 割り当てる場合は、対象のメールアドレスにチェックを入れて、[選択したアドレスに使用する] をクリック
    • 割り当てない場合は、[この画像はまだ使用しない] ボタンをクリック

WordPress 上にアバターを表示する

WordPressのユーザーとGravatarのアカウントの紐付けは登録したメールアドレスで行われる仕組みになっています。
もし、WordPressのユーザーとGravatarのアカウントのメールアドレスが同じであれは、この時点でWordPress上にアバターが表示されているのではないでしょうか?

管理画面の[ユーザー] > [プロフィール] のプロフィール写真
ログイン中の右上
投稿ページの投稿者

WordPress のユーザのメールアドレスと、Gravatar に登録されているメールアドレスが異なる場合

もし、WordPress のユーザーとGravatar のアカウントに登録されているメールアドレスが異なっている場合は、Gravatar に登録したアバターをWordPress のユーザーに紐付けることができないのでWordPress に表示されません。この場合は、WordPress のユーザーのメールアドレスを、Gravatar に追加することで紐付けることが可能です。

Gravatar のアカウントにメールアドレスを追加する手順

  1. Gravatar にログインして右上のアイコンをクリックして表示されるメニューから[メールアドレスの追加] を選択します
  2. 追加するメールアドレスを入力して[追加] ボタンをクリック
  3. Gravatar(gravatar.com ドメインのメールアドレス)からメールが送られてくるのでメール本文の認証用のURLをクリック(またはブラウザにURLを貼り付ける)すると、Gravatar アカウントにメールアドレスが追加されます
  4. メニューの[マイGravatar] をクリックして、”Gravatars を管理” の”1. 修正するメールを選択” で追加したメールアドレスを選択
  5. “2. 新規画像を選択” でメールアドレスに紐付ける画像を選択します。画像を追加したい場合は、[新規画像を追加] リンクをクリックして画像を追加してから選択します。

参照

WordPressのセキュリティ対策(WP本体)その3

WordPress本体に対して行うセキュリティ対策「WordPressのセキュリティ対策(WP本体)その2」の続きです。

サイトヘルス機能

管理画面を見ていたら「サイトヘルスステータス」というのがあるのに気づきました。

緑の丸で”良好” となっていますが、パフォーマンスやセキュリティを改善する余地があるようです。”サイトヘルス画面” のリンクをクリックすると、サイトヘルスというページが開きました。
[ツール] > [サイトヘルス] でもこの画面が開けるようです。初めて知りました。この画面には”ステータス”と”情報”の2つのタブがあり、デフォルトでは”ステータス”タブが表示されるようになっています。

サイトヘルスステータス

ステータス

セキュリティ観点の改善点が2つあるようです。
・停止中のプラグインの削除
・停止中のテーマの削除

プラグインについては、さくらインターネットのクイックインストールという機能を使ってWordPressをインストールしたのですが、自動的に幾つかのプラグインがインストールされていてそのまま放置していました。有効にするか検討してから不要なものを削除したいので、今回はこのままにしておきます。(宿題)

テーマは、先月デザインのカスタマイズをしたところで、敢えて変える理由が現状はないので停止中のものは削除することにしました。
テーマの削除は、[外観] > [テーマ] で削除したいテーマを選択して表示されるテーマの詳細画面の右下に”削除” ボタンがあるので、これで削除できます。
(今回削除したのは、”Twenty Nineteen”、”Twenty Twenty”、”Twenty Twenty-One”の3つ)

セキュリティ以外で、パフォーマンスの改善点も1つありますが、今回は対応を見送ります。(宿題)

「テスト通過 v」というボタンがあるのでこれをクリックすると、問題ないと判断された複数の項目が表示されました。セキュリティの項目は7つありました。
・サイトは他のサービスと安全に接続可能です
・このサイトは設定ではデバッグ情報を出力しません
・プラグインとテーマの自動更新は正しく設定されているようです
・WordPress.org に接続可能です
・バックグラウンド更新が動作中です
・サイトは有効なHTTP 接続を使用しています
・Authorization ヘッダーは適切に動作しています

詳しくは、公式サイトに記載されています。
サイトヘルス画面 − WordPress.ORG(日本語)

サイトヘルス情報

もう一つのタブ”情報” をクリックすると、サイトヘルス情報という画面が表示されます。

情報

ここでは、WordPress の構成に関する詳細情報が、10個の分類で表示されていて、各分類の”v”をクリックすると詳細の項目が表示されます。
・WordPress
・ディレクトリとサイズ
・現在のテーマ
・使用中のプラグイン
・停止中のプラグイン
・メディア処理
・サーバー
・データベース
・WordPress 定数
・ファイルシステムパーミッション

どうやら、レンタルサーバーの管理画面で確認していたものが、WordPress の管理画面で確認できるようです。

ここで挙げられている項目に改善点があれば、ステータスの方に表示されるという仕組みになっているようです。セキュリティ対策が最低限できているかが一目瞭然でとても親切で助かります。

あとがき

今回はここまで。
停止中のプラグインの削除が宿題として残っていますが、とりあえずこの程度の個人ブログとしては、一通りのセキュリティ対策はできたのではないかと思います。次回また何かネタがあれば投稿しようと思います。