みなさんこんにちは！デンノウです✋
素人がブログを始めて、なんと五ヶ月が経ちました。
初めのうちは、続くのかどうかすら怪しかったのですが、なんだかんだで続いていて自分でも驚いています。
毎月、このブログで収益があったか、何をしていたかを報告しているので、
今月も五ヶ月目の成果と、何をしていたのかを紹介します。
【目次】
スポンサーリンク
ブログを始めて五ヶ月目の収益について
まず収益についてですが、Google AdSense（以下、アドセンス）による収益は、2桁でした。
先月よりは増益ですが、1桁に近い2桁なので先月とそこまで大差ありません。
原因としては、やはりアクセス数が少ないのが問題でしょうね。
現状、毎日アクセスのある記事が1つだけなので、もっと読まれる記事を増やさないといけません。
アフィリエイトの方も、先月同様成果がありませんでした。
なかなか成果につながるような記事を書けていないので、まあそうなるだろうと予想はついてました。
今月は、以前に書いた記事で紹介しましたが、やる気がでない出来事もあったので、停滞気味です。
やる気に関しては少し回復してきましたが、ブログを始めた当初に比べるとかなり低くなっているので、気持ちを切り替えていかないといけませんね。
以上の結果をまとめると、
収益やメンタルに関して、よくない月でした。
ただ、少し嬉しいこともあったので、この後でお話していきます。
五ヶ月目にしていたこと
さて、五ヶ月目に何をしていたかのお話になります。
CLSと画像読み込みの改善
先月は、Google Search Consoleの「ページエクスペリエンス」について紹介して、
・サイトを見る際の見やすさ
・ページ読み込みのスピード
が、サイトの評価で大切になるということをお話しました。
そこで今月は、そのあたりに影響しそうな、
・CLS
・画像読み込み
の2つをわかる範囲で修正していました。
2021年6月に、はてなブログで変更があり、画像貼り付け時に画像のズレと遅延読み込みの対策が入りました。
そのため、現在ではこれから紹介する修正をしなくてもよくなりました！
CLSの改善方法
CLSとは、Cumulative Layout Shiftの略で、
表示されたWEBページが画像などの読み込みにより、初回読み込み時とコンテンツの位置がズレる現象
をいいます。
画像付きのサイトを開いたときに、読み込みが追い付かなくて、あとから画像が表示されて読んでいた位置がずれることってありますよね？
そのことを評価したのがCLSで、ズレるほどスコアが悪くなります。
この値は、こちらのサイト【PageSpeed Insights】で確認できるので、興味があれば活用してみてください。
ご自身のウェブページURLを入力して、分析ボタンを押すと、そのページの読み込み時間を調べてくれます。
分析後のラボデータ項目右下が、CLSの評価です。
最初に私のサイトを調べたときは、ここの評価がオレンジの四角で、悪くはないけどイマイチって感じだったんですよね。
で、改善するために色々調べてみました。
その時にお世話になったのが、こちらのサイトになります。
参考にしたサイト
結論を言うと、
・大きさ指定していない画像によるズレ
・CSSによるズレ
・Google Adcenceなどの広告読み込みによるレイアウトのズレ
この3つの原因によって、レイアウトがズレ、CLSの評価が悪くなるとわかりました。
そのため、
・過去記事を含めた画像のサイズ指定
・ブログデザインの見直し
・アドセンス広告の見直し
を中心に改善してみました。
下2つの改善については、先月から取り込んでいて、なるべくシンプルなものを導入したり、数を減らす対応をしたら、ある程度改善したので割愛します。
画像サイズの指定についてですが、
はてなブログで画像を貼り付けると、HTML編集画面では、
<img src="画像URL" alt="○○" title="○○" class="○○" itemprop="image" />
こんな感じで表示されると思います。
編集画面を切り替えて、貼り付けた後の画像をクリックすることで、四隅に□が出ます。
これを長押しして動かすことで、以下のようにサイズを指定できます。
<img src="画像URL" alt="○○" title="○○" class="○○" itemprop="image" width="270" />
※この時のwidth値は、勝手に入力されます。今回は270でした。
これで画像指定したように思えるのですが、これだけだと、幅を指定しただけなので、高さも指定しないといけません。
先ほどの□を動かしたときに、数値も一緒に出ると思うので、その値をwidthの後に入力してあげましょう。
<img src="画像URL" alt="○○" title="○○" class="○○" itemprop="image" width="270" height="152" />
これで幅と高さの指定ができました。
これで終わったかのように思えるのですが、まだ問題があります。
スマホで見た場合、サイズが大きすぎると、画像が変な状態で見えてしまいます。
これを解決するために、以下のモノを高さの後に追加しましょう。
<img src="画像URL" alt="○○" title="○○" class="○○" itemprop="image" width="270" height="152" style="width: 100%; max-width: 270px; height: auto;"/>
こうすることで、スマホでも画像が変にならずに表示することができます。
ここで注意したいのが、
max-width: 270px
のpx前にある数値は、widthと同じ値を入力してください。
今回の場合、widthの値が270なので、max-widthも270にしています。
少しでも楽に入力できるように、数値が入っていない以下のモノを、定型文にコピーしておくと便利ですよ。
width="" height="" style="width: 100%; max-width: px; height: auto;"
独学のため、この方法が正しいのかわかりません。
参考にしたサイトもブックマークをしていなかったようで、調べても出てこないんですよね…。
ただ、一応は画像を指定することができたみたいで、
CLSの評価が緑の丸評価になって、改善しました。
この改善だけでもいいのですが、次に紹介する内容も一緒にしてあげると、より見る側とって親切なサイトになるので、よければ参考にしてください。
はてなブログの変更で、画像貼り付け時にサイズ指定されるようになりました！
スポンサーリンク
画像読み込みの改善方法
先ほどのCLSと一緒に改善してあげたいのが、画像の読み込み改善です。
これを改善することで、ページの読み込みの評価がよくなります。
詳細については、素人の私が話すより、わかっている人のお話を聞いてもらった方がいいと思うので、私が参考にした方のサイトを紹介します。
やることは、
loading="lazy" を <img> 内に入れるだけです。
先ほどの例でいくと、
<img src="画像URL" alt="○○" title="○○" class="○○" itemprop="image" />
↓
<img loading="lazy" src="画像URL" alt="○○" title="○○" class="○○" itemprop="image" />
これでOKです。
ただし、これを導入する際に注意したいことがあります。
・画像のサイズ指定なしだとCLSの原因になる
・対応していないブラウザがある
・画像の読み込みが速くなるわけではない
以上3点を意識した上で、活用してください。
Windowsのメモ帳が使える方は、
1：記事をHTML編集に切り替えて、すべてコピー
2：コピーしたものをメモ帳に張り付け
3：キーボードでCtrl＋Hを押して「置換」ページを出す
4：検索する文字列に「<img 」と入力
5：置換後の文字列に「<img loading="lazy"」と入力し、「すべて置換」を1回押す
6：「置換」ページを×で消し、メモ帳の記事をすべてコピー
7：ブログのHTML編集画面に貼り付けたら完成！
以上の操作を行うことで、簡単に修正できるので、よかったら試してみてください。
これで、画像読み込みも改善できましたね。
はてなブログの変更で、画像貼り付け時に遅延読み込みされるようになりました！
改善した結果
前回のブログ全体のデザイン修正や、先ほどの改善をした結果、
ページエクスペリエンスが、画像のようになりました。
先月の時点では0％だった良好URLが、93％まで改善することができました！
100%でないのは、まだ修正できていない記事があるので、その影響だと考えています。
とりあえず、評価がよくなって一安心です。
ただ、ここで紹介した方法は、素人がネットで調べて、独学でやった方法になるので、ほかの人にもきちんと効果が出るかはわかりません。
試される場合は、事前にバックアップを取っておいて、自己責任でお願いします。
ちなみにですが、今回紹介したこと以外にも、以前から、ブログで使用している画像の容量を少なくしたりして軽くしているので、それも含めた評価になっています。
まだされていない方は、そちらも試してみてください。
スポンサーリンク
ドメインパワーについて
そういえば、先月はドメインパワーについても紹介しましたね。
あれからですが、先月時点で5.5だったドメインパワーが、12.3まで増えました。
ドメインパワーの数値反映は少し時間がかかると聞いていたので、「あつ森＋インテリア」のカテゴリ特化が、今になってより表れているのかもしれません。
この影響か、ページエクスペリエンスの改善か、はたまたその両方かわかりませんが、サーチコンソールの合計表示回数と検索クリック数が、わずかながら右肩上がりのグラフになってきました。
ただ、今は雑記スタイルに方向転換したため、そのうち値が下がってしまうかもしれません。
アフィリエイトの勉強
こちらも先月と被りますが、前回紹介したアフィリエイトの本を読んで勉強しています。
といっても、勉強しているだけで、ほとんど実践に移せていないので、成果はありません。
取り扱うジャンルで、見込める収益も変わってくるので、少し心が揺らいでいます。
でも興味がそこまでないものを取り扱っても、たぶん続かないですよね。
いったい何が自分に向いているのか、見極めていかないといけません。
楽天Room始めました
ふと、ツイッターで楽天Roomに目がとまり、気になって調べたら思った以上に簡単にできることがわかったので、私も楽天Roomを始めてみました！
今まで楽天を利用していたのに、なんで気づかなかったんだろうといった気持ちです。
楽天で購入できる商品なら、手軽に紹介することができるので、自分だけのお店が持てたみたいで楽しいです。
以下のバナーから、実際に買ってよかったものや、気になっている商品を紹介しているので、もしよければのぞいてもらえると嬉しいです。
＼楽天ROOMでオススメ品を紹介！／
まとめと今後について
やる気が最底辺な状況になっている、五ヶ月目でした。
収益は変化がありませんでしたが、見えないところのブログ評価は良くなってきている月でしたね。
今後についてですが、
まずはやる気を出すために、環境をととのえつつ、今月やろうと思ってできなかったことをやっていきたいですね。
あとは楽天ROOMも少し力を入れていこうと考えています。
いつも見てくれている方には、本当にありがとうございます。
これからも、頑張っていくので、応援していただけると嬉しいです。