SEO」を導入してみました。この記事では、基本的な使い方から、動作確認方法、プラグインを入れると遅くなるか?などの導入の感想をメモしておきます。購入を迷っている方はご参考に。SEO」は、読み込み遅延させている画像をGoogleのロボットに認識させる、AFFINGER5専用のプラグインです。LazyLoad(レイジーロード)についてLazyLoad(レイジーロード)は、画像などの読み込み遅延のことです。AFFINGER5の場合、管理画面で「画像表示をスクロールでフェードインする」を設定していると、LazyLoadが有効になり、ページを表示した段階では画像を読み込ません。スクロールして、ユーザーの見えるエリアに画像が入ったときに、初めて読み込みが始まります。画像の読み込みを後回しにするため、ページの表示速度を高速化させます。LazyLoadのデメリットLazyLoadはページの表示速度を高速化する一方で、検索エンジンは画像を認識しないため、SEOに不利です。SEOは、LazyLoadによってGoogleロボットに認識されない画像を、認識できるようにしてくれます。画像などの重いデータの読み込みを遅延(ページの表示速度を高速化)させつつ、Googleのロボットに認識させる、SEOに効くプラグインなのです。SEOの使い方は、公式販売ページにある通りですが、一応説明しておきます。SEOは、ver20180613より前のバージョンには対応していません。アップグレードしましょう。SEOを有効化させてください。プラグインを有効化したら、AFFINGER5管理>その他>演出>遅延読み込み(サイト全体)で設定をします。「遅延読み込みする」と「画像とiframeを遅延読み込みする」にチェックを入れて保存してください。「iframe」は、YoutubeやGoogleマップなどに使われます。これらもページ表示速度を遅延させるので、iframeの遅延読み込みにもチェックすることをおすすめします。SEOを導入したら、正しく作動しているか?確認しましょう。chromeの「デベロッパーツール」を使います。SEOを導入したサイトの、適当なページで右クリックし、「検証」の項目をクリックします。ページ上の通常の画像コードの下に、さらに<noscript>タグで囲まれた画像のコードが追加されているはずです。SEOが正しく動作(Googleロボットに認識)してます。Insights」でテストしてみました。SEO導入前のスマートフォンのスコアは77でした。SEO導入前のパソコンのスコアは87でした。SEO導入後のスマートフォンのスコアは76になりました。SEO導入後のパソコンのスコアは85になりました。SEO導入後に、ほんの少しスコアが下がりましたが、僅差なので気にするほどではありません。今までLazyLoadを使っていて、SEO的に不利だということは知っていました。言って、全サイトの、全部の画像に、手動で<noscript>タグを追加するのはかなり面倒。構造化データを追加する手もありますが、これもまた面倒なので、後回しにしていました。この面倒な作業をボタン1つでやってくれます。全部手動で<noscript>タグを追加すると何時間、下手したら何日も掛かるところを、5分ほどの作業で終了。これで5,000円は安いです。サイトに投資できる人にはおすすめのプラグインです。SEO」は、読み込み遅延させている画像をGoogleのロボットに認識させる、AFFINGER5専用のプラグインです。プラグインの使い方は、インストールして有効させ、管理画面で「遅延読み込みする」と「画像とiframeを遅延読み込みする」にチェックを入れて保存するだけです。全部手動で<noscript>タグを追加すれば不要なプラグインですが、そんなの時間のムダ。SEO」なら5分で終了。SEO」をおすすめします。SEO」が、バーション20181225より、自動で画像の構造化データを作成してくれるようになりました。...続きを見る参考サイトこの記事の作成にあたり、以下のサイトを参考にしました。Optimizer」を使い、次世代画像フォーマット「WebP(ウェッピー)」に変換する方法を解説します。WordPressAdSenseの「ページビュー」と「表示回数」の違い2019/4/3AdSenseのレポートでよく見る「ページビュー」と「表示回数」の意味の違いを解説します。Form7」を利用せずに、Googleが提供する「Googleフォーム」を使ったお問い合わせフォームの作り方をご紹介します。プラグインBOKUこのサイトのほか、いろんなブログをWordPressで作っている男。テーマはAFFINGER5を愛用。BOKU関連記事AFFINGER52019/8/9AFFINGE5おすすめヘッダーカードのキャッチコピー表示方法AFFINGER5(WING)のver20190801βより、おすすめヘッダーカードにキャッチコピーを表示できるようになりました。キャッチコピーはどうすれば表示されるのか?設定方法を解説します。AFFINGER52019/8/9AFFINGER5ヘッダー用メニュー(横列)のタイトル属性の設定法AFFINGER5(WING)のver20190801βより、ヘッダー用メニュー(横列)が設定できるようになりました。ヘッダー用メニュー(横列)では、タイトル属性でサブテキストも表示できますが、このタイトル属性が表示されないことがあります。AFFINGER52019/5/17AFFINGER5に「この記事は約何分で読めます」を表示する方法WordPressテーマ「AFFINGER5(WING)」の記事上に、自動的に「この記事は約何分で読めます」と表示させるカスタマイズをご紹介します。AMP2019/3/17AFFINGER5のAMPにスティッキー広告(追尾広告)を表示させる方法WordPressテーマ「AFFINGER5(WING)」のAMPページにスティッキー広告を表示させる方法を解説。AFFINGER52019/3/14AFFINGER5の404ページのカスタマイズ方法とサンプルWordPressテーマ「AFFINGER5(WING)」では、ウィジェットから404ページをカスタマイズ可能です。AMP2019/3/17AFFINGER5(WING)のAMPページカスタマイズまとめWordPressテーマ「AFFINGER5(WING)」のAMPページのカスタマイズ例をまとめました。AMPは機能に制限がありますが、カスタマイズをすれば少しはマシになります。