広告

広告

ラベル ブログ作成術 の投稿を表示しています。 すべての投稿を表示
ラベル ブログ作成術 の投稿を表示しています。 すべての投稿を表示

2026年6月23日火曜日

【本当にコピペでOK】Bloggerの記事にCSSを使って見出しや色々なデザインを楽しもう!

「Blogger」使用者に向けた記事です


今回は、私のブログでも使っており、そのままBloggerの記事作成画面の「HTMLビュー」にコピペすれば使える、CSSを使用したデザインをまとめます。


ちょっとだけ解説すると、Google社が提供している「Blogger」というブログサービスでは、「HTMLビュー」を使うとHTML編集をしてブログを作成することができるのですが、これがまあ癖が強いんですね。。

そもそも、近年あまりやらないであろう、styleを用いてCSSをHTMLの中に直接書き込む方式のうえに、表記方法の癖が強めだったり、「一般的なCSSデザインをコピペ→styleを用いた書き換えをする」だけではデザイン崩れしたりする印象。


ネットで少し調べた感じ、ブログ全体に適用するCSSは外部から持ってこれるようですが、1つ1つの記事に外部CSSを適用する方法がわからず。。


ということで、Bloggerで記事を書くときに色々なデザインを入れたい方のために、私自身が使っている&これから使おうと思っている、Blogger仕様のデザインのコードを載せてみます。

そのままコピペOKです!


なお、フォントは基本的にBloggerの作成ビューでも選べる「Verdana」を使用しておりますので、変更したい場合は自由に変更してください。



見出し

まずは、見出しです。

こちらは、HTMLとCSSがよくわかっていない頃に適当に作り、ずっとめちゃくちゃなコードのまま使用してきたのですが、今回なんとか人様に見せられる(?)コードに整えました。


コード↓

<div id="title" style="border-bottom: 0.2em solid rgb(250, 200, 200); border-left: 0.5em solid rgb(254, 200, 155); box-sizing: border-box; color: orange; font-family: verdana; margin: 2em 0em; padding-bottom: 0.1em; padding-left: 0.4em;">

  <span style="color: #666666; font-family: verdana; font-size: 26px;">見出し</span>

</div>


小見出し

私のブログで最もよく使っている、さりげないドットの小見出しです。

というか、この記事でも他の箇所で使ってしまっているのでわかりにくいですね笑

こちらも、長年めちゃくちゃなコードだったのを整えてみました。


コード↓

<div id="title2" style="border-bottom: 0.2em dotted rgb(250, 200, 200); box-sizing: boder-box; margin: 1.5em 0em; padding-bottom: 0.1em;">

  <span style="color: #666666; font-family: verdana; font-size: 20px;">小見出し</span>

</div>


文字に下線を引く

実物はこんな感じ↓

あいうえおかきくけこあいうえおかきくけこ


コード(下線を引きたい場所に挿入)↓

<span style="background: linear-gradient(transparent 70%, rgb(248, 220, 220) 30%);">下線を引きたい箇所の文章やワード</span>


割と基本そのままといった感じです。下線の太さや色は自由に変えてみてください。

また、1行まるまる線を引く場合など、すでに<span>タグで囲ってある場合は、""内にbackground: linear-gradient(transparent 70%, rgb(248, 220, 220) 30%);だけ付け足すようにしてください。


引用デザイン(影付き)

こちらの記事で悪戦苦闘しながら作り上げた代物です。

有名なサルワカくんのデザイン&CSSを参考にしつつ、魔改造しました。

前回の記事からさらに、背景色に影をつけています↓

CSS Block Quotation Example

ここに引用する文を書きます。

引用元


コード↓

<blockquote style="-webkit-text-size-adjust: 100%; background: 0% 0% repeat rgb(240, 249, 255); border-left: 8px solid lightblue; box-shadow: rgb(200, 200, 200) 4px 4px 4px; box-sizing: border-box; font-style: italic; margin: 0px auto; overflow-wrap: anywhere; padding: 10px 3%; text-align: left; text-size-adjust: 100%; width: 97%;">

  <div style="align-items: flex-start; display: flex; gap: 6%;">

    <div><h2><span face="sans-serif" style="box-sizing: border-box; color: lightblue; display: inline-block; font-size: 90px; line-height: 1; margin-left: -1%; margin-right: 1%; margin-top: -5px; padding-left: 0px; padding-right: 1%;">“</span></h2></div>

    <div style="color: #555555; font-family: verdana; margin-top: 10px; padding-right: 2%; position: relative;">

        <p><span style="line-height: 1.7; margin: 10px 0px;">

             CSS Block Quotation Example</span></p>

        <p><span style="line-height: 1.7; margin: 10px 0px;">

             ここに引用する文を書きます。</span></p></div>

    </div>

    <cite style="color: #666666; display: block; font-family: verdana; font-size: 0.9em; line-height: 1.4; margin: 10px; padding: 0px 5%; text-align: right;">

      <p>引用元</p>

    </cite>

</blockquote>


見ての通り、Blogger特有の癖の強い書き方に仕上がったかなと思います笑

VSCodeなどで作成する場合と違って、コードのレイアウトが見づらくてすみません。


まだまだ改善点はあると思うのですが、ひとまず見れるレベルには仕上がったかなと思ってます。

オリジナルでは::beforeを用いて引用マークを表現していましたが、こちらでは<h2>タグで代用しました。


また、スマホで見ている方がもしいらっしゃったら、左側はスペースが空いているのに右が詰まっているのが気になったかもしれません。

これは、私のブログ全体で左のみにスペースが設定されてしまっているためです。。

皆様がコピペして使う分には問題ないはず。

私自身は自分で使うときはmarginを調整します。


2026年6月15日月曜日

【研究】Bloggerで「引用デザインCSS」を無理やり作る方法【コピペOK】

何年間もBloggerを使ってブログを書いているのですが、いまだにBloggerのHTMLビューのみを使用し、別のCSSファイルを使用せずに色々なデザインを変更する方法がいまいちわかっていません。

(styleを用いてCSSをHTMLに埋め込む方式。ただし、少し表記の癖が強い?イメージ)


…ただ、最近HTML & CSSを勉強する中で、もしかしたらこんな感じにしたらいいんじゃない??というのが徐々にわかってきたので、


今回は

Bloggerだけで引用デザインを作る

ということをやってみたいと思います。


Bloggerを使っている方のみに向けた記事です。



サルワカくんという方のこちらのサイトに載っているCSSデザインを参考にします。

ブログをやっている人はご利用くださいと書いてあるのでありがたく使わせていただきます。


さて、今回は、1個目のデザインである、最もシンプルな 薄いグレーの背景の左上あたりに引用マーク、真ん中に本文を表示する形式 を参考にしてみます。


最初に、サイトに載っている以下のhtml、CSSをコピペしてみます↓(そのままコピペしてしまってすみません)


🔹html

<blockquote>
        <p>CSS Block Quotation Examples</p>
        <p>ここに引用する文を書きます。</p>
</blockquote>


🔹css

blockquote { position: relative; padding: 30px 15px 8px 15px; box-sizing: border-box; font-style: italic; background: #efefef; color: #555; } blockquote:before{ display: inline-block; position: absolute; top: 5px; left: 3px; content: "“"; font-family: sans-serif; color: #cfcfcf; font-size: 90px; line-height: 1; } blockquote p { padding: 0; margin: 10px 0; line-height: 1.7; } blockquote cite { display: block; text-align: right; color: #888888; font-size: 0.9em; }



これらをBloggerの「HTMLビュー」を開いた状態でコピペし、見ながら改変していくことでBloggerバージョンの引用マークを作っていきました。



一旦、完成版をお見せしますね↓

CSS Block Quotation Example

ここに引用する文を書きます。

引用元


PCでもスマホでもそれなりの見え方にはなっているんじゃないでしょうか。


コードはこんな感じ↓コピペOK!

 VSCodeとかと違って綺麗にコーディングするのが難しいのであまり整ってないかもです。


<blockquote style="-webkit-text-size-adjust: 100%; background: 0% 0% repeat rgb(240, 249, 255); border-left: 8px solid lightblue; box-sizing: border-box; font-style: italic; margin: 0px auto; overflow-wrap: anywhere; padding: 10px 3%; text-align: left; text-size-adjust: 100%; width: 97%;">

  <div style="align-items: flex-start; display: flex; gap: 6%;">

    <div><h2><span face="sans-serif" style="box-sizing: border-box; color: lightblue; display: inline-block; font-size: 90px; line-height: 1; margin-left: -1%; margin-right: 1%; margin-top: -5px; padding-left: 0px; padding-right: 1%;">“</span></h2></div>

    <div style="color: #555555; font-family: verdana; margin-top: 10px; padding-right: 2%; position: relative;">

        <p><span style="line-height: 1.7; margin: 10px 0px;">

             CSS Block Quotation Example</span></p>

        <p><span style="line-height: 1.7; margin: 10px 0px;">

             ここに引用する文を書きます。</span></p></div>

    </div>

    <cite style="display: block; font-family: verdana; font-size: 0.9em; line-height: 1.4; margin: 10px; color: #666666; padding: 0px 5%; text-align: right;">

      <p>引用元</p>

    </cite>

</blockquote>



ちょっと色々あり、完成形の見た目もコードも原型がかなりなくなってしまいました笑


特に大幅な変更点としては、引用マークを上部に表示すると下の要素との間隔調整が難しいので、引用マークを左に寄せてしまいました

(それに伴い、paddingとかmarginをパーセンテージとかピクセルで超細かく設定してるのは適当に消していただいても)


他に、背景色、左側の線も勝手に変えました。。

参考元のCSSの通り「背景色グレー、左側の線なし」にしたい方はそこだけ編集して使ってみてください。

この2点は割とコード編集しやすいかと思います。





ここからは、どういう過程で作っていったか少し語ってみます。


まず、過去の自分のBloggerの記事とかを見ていて気づいたこととして、Bloggerでは

<タグ名 style=“cssの内容”>

みたいな書き方をしておけばCSSが使えるっぽいんですよね。

そして、めちゃくちゃ<span>タグを使いがち。


ということで、<blockquote style=“”></blockquote>という形で大まかな設定をしました。

本文部分は<p><span style=“”></span></p>が基本ですね。


なお、背景色が"background: 0% 0% repeat rgb(240, 249, 255);"になっているのは、自動でBlogger仕様に表記が変更されてしまうためです


唯一パッと見でやり方がわからなかったのが一番重要な引用マークの入れ方

blockquote:beforeの部分をどう再現するのかよくわからなかったので、

ひとまず、<h2>タグを使って代用しました。


ということで、最初に完成したコードはこんな感じでした↓


<blockquote style="position: relative;">

  <blockquote style="padding: 30px 15px 8px;">

  <blockquote style="box-sizing: border-box;">

  <blockquote style="font-style: italic;">

  <blockquote style="background: 0% 0% repeat rgb(239, 239, 239);">

  <blockquote style="color: #555555;">

    <h2><span style="display: inline-block;">

        <span style="position: absolute;">

        <span style="left: 3px; top: 5px;">

        <span style="color: #cfcfcf;">

        <span face="sans-serif">

        <span style="font-size: 90px;">

        <span style="line-height: 1;">

          “

        </span></span></span></span></span></span></span></h2>

    <br />

        <p><span style="padding: 0px;">

           <span style="margin: 10px 0px;">

           <span style="line-height: 1.7;">

             CSS Block Quotation Examples

           </span></span></span></p>

        <p><span style="padding: 0px;">

           <span style="margin: 10px 0px;">

           <span style="line-height: 1.7;">

             ここに引用する文を書きます。

           </span></span></span></p>

  <cite>

      <cite style="display: block;">

      <cite style="text-align: right;">

      <cite style="color: #888888;">

      <cite style="font-size: 0.9em;">

      <p>引用元</p>

      </cite></cite></cite></cite><cite>

</cite></cite>

    </blockquote></blockquote></blockquote></blockquote></blockquote>

</blockquote>


元々のコードをBlogger仕様にしただけといった感じです。

これ、Bloggerを使用している方はよければコピペして作ってみた上でスマホで確認してください。

PCだとそれっぽいはずなのにスマホでまともに見えない!!

どうも、このままだと横幅がめちゃくちゃ狭く設定されてしまうんですね。



ということで、親要素のところに色々追加しまくり、ついでにサイズや色も変更し、最初に載せたようなコードにしました。


あと、ワンポイントとしては、overflow-wrap: anywhere; を設定したことです。

改行を制御するCSSですね。

変なところで改行されてしまうパターンも生じるかとは思いますが、それよりも改行がしっかりできた方が見やすいかと思いこうしました。

もし気になるようでしたら改行ルールを加えてみてください。


何はともあれ、これで安心してブログで引用ができるようになった気がします。



2022年10月7日金曜日

【体験談】Google Adsense広告制限日記

「Google Adsense広告制限日記」

ふと思いついてこのタイトルを検索してみたのですが、さすがに同じタイトルで書いてる人はいませんでした笑

恐らく、複数回広告を制限された人は1回のみの人より少ない&心に余裕が生まれる(?)のでわざわざ記事に書かないのでしょう。

制限されたというブログ記事をいくつか見ましたが、ほぼほぼ単発の報告でした(言い方やばい)


これを書き始めた時点で2回目の広告制限を体験したので、日付をまとめていきます。(2023年現在3回経験)

またあったら書き足していきます。

解決方法は詳しくは書きません。

ただ、他の広告を制限されてしまった方が、こんな感じでどーんと構えている人間もいるんだなあと思って安心してくだされば幸いです。


他の方があまり書いてない話としては、

1度の無効クリックが原因で断続的に何度も広告制限された話

どんな時に広告制限されやすいか、現在のところの個人的結論

■広告制限解除🔓の前兆(現在のところの個人的結論)

みたいな話はしてみます。


ブログ開設は2018年3月、収益化は同年9月くらいです。

その後4年近く何もなかったのに、なぜか1年強のうちに3回も制限されました。


①基準が厳しくなった

②PVが少ない頃はリスクも低かった

③広告の表示方法が変わって収益も上がるけどリスクも上がった


このあたりが理由として考えられると思ってます。


◆1回目(2022.03.07~2022.03.22)

日付は1、2日ズレているかもしれません。期間は見ての通り約2週間でした。

初めて見たときは焦りましたね。ええ。

制限時の1日の広告表示回数は0~20回ほどになりました(それまでは1000回以上)

因果関係はほぼほぼないと思いますが、若干いつもよりPVも少なかったです。

原因は無効なトラフィックでした。

一応ヘルプから飛んで報告するだけしました。(※この時は報告の仕方よくわかってなかった)

制限をかけられ始めた日のクリック回数は10回ほどだったと思うのですが、後からGoogle Adsenseのレポートを見ると1回になってました。

ちなみに、普段、1日のクリック回数が1~4のことが多い弱小ブログなので、少し多かったですね。

(後からGoogle Analyticsで ユーザー>地域>Google Adsense、市区町村 から見たら、ある都市で3月6日にアドセンスのページ表示回数6回に対して10回クリックされてました

そして、

実際の広告表示が復活&レポートやパフォーマンスのところにある広告表示回数の値が増える

⇒警告が消える

という順にもとに戻っていくことが多いようですね。

このときは、復活後1日くらいして警告が消えました。


◆2回目(2022.08.13~2022.9.29、その後断続的に2月頃まで)

 一応、約1ヶ月半。警告は10月5日に消えたので、そこまで数えると2ヶ月弱と言っていいくらいの感じです。

これまた1日に10回ほどクリックがあり、制限されるぞ~と思っていたらされました。

後からみたら有効なクリック回数は3回になってました。

原因はやはり無効なトラフィックでした。

こちらはスクショしました↓


ちなみに、10回クリックというのはアドセンスの方のレポートに出ていた最大回数であり、アナリティクスの方を見るともっとやばいことになっていました。

ある8月12日に都市でアドセンスのページ表示回数7回に対して30回クリックがありました

…これはやられましたね。


すぐに無効なクリックの報告をしました(この時も書き方がよくわかっておらず)


広告制限中は1日に0回〜30回ほど広告が表示されていたのですが、それによって収益が(1円とかですが)発生した日があったので、もしかしたらまずい?と思い、アドセンスで自動広告をオフに。


そして、9月6日頃に、やっとちゃんと検索して、ちゃんとした無効なクリックの報告方法を調べました。

ポイントとしては、簡単にいうと、入力ミスをしないこと、無効なトラフィックに関しては具体的に報告することだと思いますね。(詳しくは他の方々が色々書いてます)


私は、なんと、1回色々入力ミスをしたまま出してしまい、その日のうちにもう1回修正バージョンを提出し直しました(これ絶対良くないのでおすすめしません。最初に出す時から内容確認しよう)

やっちゃったなあ、9月末までに収益回復しなかったらその時は色々考えようかなあ、と思いながらとりあえずブログ執筆だけ続けました。


で、9/17の午前中に見たら、PVに対して2/3くらいの回数、広告が表示されるようになっていました。

警告は消えていませんでしたが、我慢できず自動広告を復活。

そうしたら(それが原因かはわかりませんが)9月20日から再び制限が。。

今度は自動広告onのまま放置していたら9月29日に復活し、警告は10月5日に消えました。

広告の表示回数が復活してから警告が消えるまで、じわじわ収益が回復していったのですが、警告がまだ残っていることと関係があったのか偶然なのかは謎。

結局、自動広告はオフにしなくていいのかもしれません。まあとにかく、変なタイミングでオンにするのだけはよくないと思います。


そして、その後、もう日付を書くのも面倒なので書きませんが、おそらく8/12のクリックが原因で、さらに2回くらい、半月とか1か月とかの単位で広告制限されました(秋から冬にかけて)

なぜそう判断したかというと、ポリシーセンターに制限開始日が8/12と書いてあったり、はたまた毎日1日ずつ開始日がずれて表示されていったり、制限開始直前に無効なクリックが特に見受けられなかったりしたからです。

毎日制限開始日が変化するってどういうことじゃ。

まあ、もう何もしようがないので放置しました。そうしたらそのたびしばらくして復活しました。


...と、ここまで軽い感じで書いてきましたが、この頃は毎回、もう解除されないんじゃないかとマジで不安でした。

でもまあ、アカウントが存続している限りは希望ありますよ。本当に。


この頃、広告制限から復活する直前の1日から数日くらい、海外からのアクセスが増える傾向があることに気づきました。

(まあ、私だけかもですが)

ただし、Google AdsenseやGoogle Analyticsには反映されません

Bloggerの管理画面で見るとわかります。(ということは、使ってるブログによってはそもそも見ることができないかもですね。ブログ管理画面でアクセス元の国を確認できる人はしてみてください)

ちなみに、普段から海外のbotっぽいアクセスはあるのですが、大体短時間に大量に来るんですよ。

この場合はそうではなく、1日とか時間をかけて少しずつアクセスされる感じでした。

あと、この時はオランダからのアクセスでした。



◆3回目(2023.05.30~2023.7.03)

 またまた日付は大体です。1か月ちょい。

この時、しばらく(3ヶ月くらい)広告制限が解除されていたのと、制限開始日がちゃんと新しくなっていたので、やっと前回の長い制限から解除されたことを確信し、逆に安心しました()


また安定の無効なクリックが原因。

ここまでの経験でなんとなくわかってきたのですが、クリックの絶対数がごく少ない場合には、(広告制限的に)1アクセスにつき4クリックまではセーフ、5か6あたりからアウトっぽいですね(市区町村ごとのアクセスを見てわかった)。確証はないですが。

あ、セーフだからって限界を狙ってクリックしちゃダメですよ。


もう慣れていたので、さっさと無効なクリックの報告をして放置。


今回は割と長らくシンガポールからのアクセスが増えてから解除されました。が、これについては制限解除と関係あるのか非常に謎。直前にはやっぱりオランダからのアクセスが増えた気がします(記憶がおぼろげ)

今回の制限解除タイミングに関しては、Google Analyticsの方で大きな変更があったので、その準備が落ち着いたタイミングで解除されたとかもあると思います。

(そう、個人的には、こっちの対応とか以上に普通に担当の方々の都合で解除までの期間が決まってると勝手に思ってます)


そして解除後、今までにない変化がありました。

Google Adsenseのトップページに表示されているページ CTRが減ったんです

制限されまくっていた1年間、ページ CTRが2%とか、ひどいと3%以上だったりしたのですが(だからといって収益はそんなに増えない、実質無効なクリック多数)、

解除後、1%弱に落ち着きました。

クリックとして判定する基準が厳しくなったのか何なのかわかりませんが、とにかく減りました。というか昔の水準に戻りました。


というわけで、GoogleAdsenseトップに表示されているページCTR(パフォーマンスという項目の中にあります、表示してない人がしてみてください)がやたら高い場合は広告制限になりやすいんじゃないかと踏んでます。

まあ、高いからと言って変えられることは広告の位置の変更くらいなんですけども。(あとプラグインの導入)

原因としては広告の量、位置、何らかのシステム上の都合(?)とか考えられると思うのですが、何にしろ、大まかな目安になると思います。


とにかく、ページCTRが減って今までよりは安心して過ごせるようになりました。





ということでまた何かあれば追加していきます。

2021年11月14日日曜日

ゲームブログをやっている私の記事数ごとのPV・収益をまとめる

完全メモ用記事。読んでくださった方にはゆっくりのんびり運営している感じが伝われば。


 まずはブログ開設が2018年3月11日。

当初は何を書くかあまり決まっていなかったのですが、最初の頃に公開したゲーム関連記事のうち2つが初期のPVのほとんどを占めていたということで、そこからゲームについてよく書くようになりました。

今後は音楽の話とかももっと書くかもしれないのですが、とりあえずゲームブログということにしておきます。

記事の公開数を10ごとに区切ってその時のPVについて書いていきます。


10記事

今は非公開になっている記事を含めると、10記事目を投稿したのは2018年7月5日。

いや、かかりすぎでしょ、って感じですね笑

普通ならここで更新が途絶えるところですね。、

大学に入ったばかりで、バイトとかもしてなかったのになんか忙しい感じになってたんですよええ。

6月のPVが21、7月のPVが49で、ちょうどこの頃、あれ、増えてきた…?という感じでした。

1日のPVは0〜2という感じ。

累計は100くらい。

最初の月(3月)のPVが38ってなってるんですけど、それは自分のを追跡してしまっていたんですよね…。(今ではそもそも自分で見ません)

ということで、3月のPVを5未満とするとちょうど100くらいになると思います。

始めたばかりの頃のPVは使っているサービスによっても変わると思います。

私が使っている  Blogger  というサービスは、日本人で利用している人も少なく、ブログをやっている人同士で繋がる機能もないのでとにかく最初は発見されづらいです。

代わりに数字自体はかなり信用できると思います。

(今回書いている数字はブログ編集画面そのものに表示されるものです。アドセンスやアナリティクスの方の画面と比較すると、botで1割くらい水増しされていると思われます)


20記事

ここで収益化審査に出して無事に通り、Google Adsenseを始めました。(もっと少ない時にも3回くらい出して跳ね返されてます。特に最初、始めて10日で出したのはやばい)

20記事になったとき審査に出して、待っている間にもう1記事書いたのを覚えています。(現在非公開のものを含めてます)

ってことで日付を遡ると、収益審査に通ったのが2018年9月11日。20記事書いたのは8/31だと思われます。あれですね、夏休みということで書くペースが上がってました。

衝撃が強かったのでよく覚えているのですが、この頃、PVが0の日は少なくなってきたくらいの感じだったのに、いきなりPV50行った日がありました。

明らかにbotっぽい感じでした。

ということで、数字的には累計PVは200以上になっていましたが、実際の数字はあまり変わらず。ただ、botに見つかったということは、以前より見つかりやすくなったということだと思います。


50記事

ここらへんまでくるともうよくわからないので、現在公開している記事のみカウントしてみました。

50記事目の公開は2019年4月6日。なんだかんだそこそこのペースで書いてました。

2018年後半から2019年最初にかけて大学が割と忙しかったり、バイトを始めたりした割に安定していっぱい書いてたな…という。

このときの累計収益は約360円。

収益化当初(2018年9月)の、広告がクリックされた月は収益2桁、されなかったら1桁という状況を微妙に脱し始めていました。

累計PVは2300くらい?で、1か月のPVが400くらいになってきていました。


75記事

一気に100記事に行こうかと思ったのですが、あまりにもそこで一気にPVが増えるので自分でもあれ?となったのでここで区切ります。

今公開している中だと75記事目は2020年5月6日。

0~50記事が1年ちょい、50記事~75記事も1年ちょいということですね。

2019年の1年がリアルが充実していてあまり書いてなかったのが大きいかも笑

まあ大したことはしてないのですが、バイトを色々したり、今までに行ったことないところに遊びに行ったり。

累計PVは25000以上になりまして、自粛の唯一の利益というべきか、2020年1月から5月にかけては一気に月間PVが伸びてました。(2000台から5000台まで)

そしてそれ以前に、初期の少なかった状態から決定的に増え始めたのは2019年6月~7月でした。

収益に関しては、2019年6月頃に一度謎にほぼ0になったのですが、その後復活して安定して3桁に、累計で3000円弱まで行きました。


100記事

記念すべき100記事目。

色々非公開にしたりして、結構90~98くらいで行き来していたのを覚えています。

ちなみに、非公開にする理由としては、あまりにもその記事だけ見る人がいないというのが主です。まあ今もPVが2くらいの自分が好きに書いただけの記事を一部公開しているのですが。

一応、今公開している中で100記事目なのは2021年2月4日のもの。(ブログを読み返していたら、その時の公開非公開の状態では100記事目の公開は1/29だったようです)

2020年になって自粛生活を送るようになって書くペースが復活したのですが、これまた後半4か月近く空白期間が発生して結局ゆっくりになりました笑。その割に年間記事数多いのは事実ですが。

その頃こんなことしてたな~というのがなくもないのですが、やっぱりブログ関係なく空白期間すぎる笑

そんなこんなでこのとき累計PV約65000。月間PVは7000くらいだったみたいです。

ひと月の収益が500円を超えることが多くなって、合計では6000円を超えました。


125記事

なんとなく25ずつ刻んでおります。

2021年10月5日。また微妙に書くペース上がった感じがしますね。

累計PVは13万以上、ついに1記事の平均PVが1000を超えました。まあそういいつつ、1000行ってるのは20記事くらいで残りは少なめなのですが。でもPVが凄く少ない記事でも自分が好きなものは好きなので…という感じ笑

自分の中で、記事書きすぎてもあれだけど、累計PVの1000分の1まではガンガン書いていこうということに決めました(?)あ、でももう追い付かないかも…?

あとはついにひと月のPV1万を達成しました。

収益はたまにひと月で1000円を超えるようになって、累計13000円を超えました。(PVと収益の比がどうこうという話もありますが、私はあまり気にしないことにしてます。というか私のジャンルだと結構適正説があったり…?)

そして、多分これの少し後だと思うのですが、ついにGoogle Adsenseの「関連コンテンツ」が解禁されました。一通りGoogleさんに認められたと思っていいのかしら(正確なタイミングは不明、サイトを見てみたらできるようになってました)

(※追記 現在では関連コンテンツは廃止されています)

ちなみに、関係ないのですが、125記事達成少し前の9月にYouTube Premiumに入りました。

本当は6月に3か月お試し無料プランに入っていて、そのまま有料に移行したという感じですが、なんとなくプレミアム代と収益があまり変わらないので自分の中で続けてもいいだろうという判断をしました。

「YouTube Premium代を稼ぐためのブログ」みたいなとこ、あります笑


150記事

2022年8月10日。また何か非公開にするかもしれないのでなんともですが。

149から150までが恐ろしく長かったです。それほど忙しかったわけではないのですが、精神的余裕があまりなく…。

6月、7月は収益が下がる傾向がある気がします。

が、ひと月の収益が1000円を超えることが増えました。最高では1500円以上、累計では20000円以上になりました。(正確に計算してないのでもうちょい多いはず)

累計PVは23万以上、ひと月のPVはあまり上がらなくなりましたが1万~1.25万をうろうろしています。

1万PVを超えている記事が5つもあるのでそれに支えられている面が大きいですが。

今後は最低限の現状維持を目標に、書けるときに記事を書いていこうと思います。


175記事

2023年6月4日。

だいぶかかりました。就活してました。

何度となく無効なトラフィックで広告停止されてますが何とかやってます。

PVはあまり変わってないですが、蓄積で累計35万PV行きました。

1万PV超えてる記事はなんと8個に増えました。

2020年6月28日日曜日

ブログのアクセス数をそれなりに増やすのに必要なこと(ブログとYouTubeを比較しつつ)

特に誰から反応があるわけでもないこのブログですが、何やかんや2年続いてます。

2ヶ月くらい更新しない時もあれば更新しまくる時もあります。
(毎日更新しろというのをよく見かけますが、私は毎日更新しなくていいと思っています。続けられるなら。)

2018年3月に開設、2020年6月現在PVは累計34000ほどです。

一番最初の月は1ヶ月に10とかでしたが、今は1ヶ月に数千ほどPVがあります。


ほとんどアクセスされないブログから、超人気ブログまでを並べてみるとこれくらいが中堅なのかなと思ったり。

人気の記事はほとんどゲーム関連です。
(こういう「アクセス数 増やす」みたいな記事はたくさんあるので多分伸びないです。なのでレイアウトも内容の分かりやすさも気にせずメモ的に書いてます)

YouTubeのゲーム実況の方が人気な時代ではありますが、私のようなまとめ方をしていると実況よりブログの方が発信しやすい気がしてブログで書いています。


私の場合、自分の人気の記事は、大体それらしい言葉で検索すると上位に表示されるものが多いです。
ちょっとコアな内容の方が、他サイトと競合することも少なく、0から始めても見てくれる人多いんじゃないかと思います。

(自分のコアな趣味とかハウツーを探したけどネットであまり見つからなかったものとか、そういうものを探して書いてみると良いかもしれません。)


あとは、ブログのいいところは、(記事の内容にもよりますが)長く見てもらえることです。
YouTubeだと、公開直後はおすすめに表示されやすく無名でもちょいちょい再生されたりしますが、時間が経つほど今現在有名なものが有利になって他の数多くの動画は埋もれていく印象があります。


逆にブログは公開直後からアクセスされることはあまりありません。
時事ネタだとまた別ですけど。

その代わり、内容がしっかりしていると段々検索順位が上がってくる印象があります。


昔Yahoo!ブログ(現在サービス終了)をやっていた時は、更新した日だけアクセス数が増えてそうじゃない日は全然アクセスされないじゃないか…と思っていたのですが、
あれは今思えばブログをやっている人同士が繋がれるように(?)ランダムでおすすめ的な感じで表示されたり、サービス全体での最新の記事が表示されたりするところからアクセスされていたんじゃないかと。

私が今使っているbloggerだと、そもそも日本人ユーザーも少ないしそういう機能が一切存在しないので変なことを気にせずにブログをやれる気がします。

書きたいし見てもらいたいけど人と繋がりたくはない方におすすめです笑

そしてその結果、シンプルに検索だけのアクセスだと、公開から時間が経ってからの方がアクセスが増えてくるということを初めて知りました。

これって何の意味があるかというと、気長にやれるところじゃないかなと思います。

毎日投稿しないと見てもらえない、とかそういうことを考えなくてよくなります。

忙しくて投稿できない時にアクセス数が増えてくることもあります。
そういう時なんか特に心に不思議な余裕が生まれてくる気がして快適に運営できます。


おまけ:

私は人とネット上で繋がるのがめちゃくちゃ苦手です。

特にTwitterとか、フォローするという行為が苦痛だったりします。

有名になりたくてフォロバ目的でフォローしまくってる人とかいると思うんですけど、私には絶対無理だなあ…と思ってしまいます。

そんなわけでブログが自分の帰る場所になってる感があります。
bloggerなら初期投資0で収益化も一応できますし。

あ、あとついでに、ネット上でブログ、サイトで稼ぐというのを調べると「まずは100記事書け」って出てきがちなんですけど、現実的にいうと50くらいからある程度変わってくる気がします。
そして、収益化自体は無名でも20記事くらいから可能です。
つまり意外と先の見えない作業でもないよ〜という話でした。

2020年5月7日木曜日

完全無料でゆるく快適にGoogle Adsenseで稼ぐ方法 (Blogger使用)


このブログを始めた頃、「ブログ 稼ぐ」などと検索して、
あまりにも本気すぎるというか、「ブログで稼ぐ」こと自体がメインテーマだったり、メルマガなどへの誘導があったりするサイトをいろいろ発見して、
「そういうの求めてるわけじゃない…」となったのを覚えています。

というわけでゆるい感じで書いていきます。

(最初に書いておきますが、私のブログpvは月数千、収益は月数百円くらいです。確定していない収益をはっきり書いてはいけないらしいのでぼかしています。
それで生活したいわけじゃなければ別にゆるくてよくない?という記事です。
ゆるい代わりに今まで運営してきて思ったことすべてが詰まっていると思ってください。まあまあ長いです)


 アドセンスとは(導入)

まとめサイトとかに貼ってある広告は大体「アドセンス」と呼ばれるものです。
主に閲覧者にクリックされることで、サイト運営者に報酬が入ります。

多くのサイトではグーグル社の Google Adsense が使われています。
実はほかにもアドセンスはあるのですが、私自身利用しているのがGoogleのものなので今回はGoogle Adsenseについて話していきます。

(Google Adsense日本語ページ→https://www.google.com/intl/ja_jp/adsense/start/



・Google Adsense を無料でブログに貼るほぼ唯一・最短の方法


2020年現在の話です。
昔だともっと楽だったようです。


無料ブログだとブログを運営している会社が広告をはっているというのもあるのか、基本的に自分で広告をはって収益を得ることができません。
(アフィリエイトやGoogle以外のアドセンスだと違ったりしますが)

その中で唯一完全無料でGoogle Adsenseを利用できるのがこのBloggerのブログです。

それはGoogle自体がブログを運営しているからのようです。
(さらにいうと、無料ブログとしては珍しく、デフォルトで運営会社がはっている広告がありません)

また、独自ドメインを購入している場合と比べるといろいろ制限もあるのでそこは(気になる方は)リサーチしておきましょう。

というわけで、Bloggerでブログを作ってAdSenseを使うことに決めたら何をするか…というのをさーっと書いていきます。




①ブログの記事をいくつか書く



まず、Bloggerに慣れます。
Bloggerはテンプレートとかいろいろな表示方法とかが若干特殊かもしれません。
(実際、日本人で使っている人は少ない印象です)

簡単でもいいのでいくつか記事を書いてみます。

そうすると、編集画面に、「収益」の項目が出てくるようになります↓
(一番最初は表示されていません)




私の場合、記憶が定かでないのですが4つめくらいまでに出てきたと思います。

この時点ではまだ実際に収益化できる可能性はほぼないですが、
Bloggerの編集画面から飛んでアドセンスアカウントを開設、サイトを紐づけすることが可能になります。




②ブログ記事数を20まで増やす

どのサイトを見ても書いてあったのでここ2年くらいは落ち着いていると思います。

1000字以上の記事を20以上書くと、PVにかかわらず収益化できる可能性が高いらしいです。
(あと、ブログ運営半年っていうのも一つの目安としてあるみたいです。
気長にやりましょう)

私の場合、審査に出した時が公開数20、通った時が21でした。
(ブログ開設が2018年3月、審査通過が9月でした。一部現在では非公開の記事もあるので今見ても数が合致しないかもしれません)

そして、1000字以上に関しては、すべての記事が確実に1000字超えている必要はなさそうです。(体感なので保証はしません)

私の場合、文字数は最初の記事(はじめましてという題でした)が100字程度でめちゃめちゃ短くて、あとは500字~4000字くらいだったと思います。

始めたばかりだと1000字って長くない?と思ってしまうのですが、いつの間にか慣れますね(文章うまくなってないけど)




③審査

先ほどの「収益」のところを選択すると、アドセンスのページに飛ぶことができます。
ここから審査を申し込みます。

私はなんと記事数が少ない時から無駄に4回くらい審査に出したのですが、確か最大2週間以上かかったように思います。
(むやみに審査に申請するのはおすすめしません)

自分が利用しているGmailに、審査に通ったかどうかというメールが届きます

確認できただけで私の場合2018年8月10日と8月24日に落ちているメールが届いてました。
(10日はサイト審査不能が理由(多分何らかの事故だったんでしょう)、24日には不十分なコンテンツが理由(当時記事数16くらい?)でした)


そして9月11日、ついに審査に通りました

というわけで両パターンのメールについて。(今も一緒かはわかりません。2018年当時のものです)

審査合格 ⇒ タイトル:「お客様のサイトがAdsenseに接続されました
       本文:大きな字で「おめでとうございます!」+その他もろもろ
審査不合格 ⇒ タイトル:「Google Adsense アカウントのステータス」
        本文:大きな字で「Adsenseのお申込み状況」&不承認理由

審査不合格の原因はたくさんあるみたいです。
(この記事参照:https://tabinvest.net/google-adsense-examination/#Google



④広告配信開始




自分で1つずつ広告を貼ることも可能ではありますが、まずは簡単な「自動広告」をお勧めします。
イトのすべてのページに同じように広告を貼ることができます(一部のページで除外することもできます)

ちなみに、「残高」が初めて1000円を超えると、
登録した住所に確認用のはがきが届きます。
(届くまで2週間から4週間かかるそうです)
(いつそれが起こったか公表するのはリスクがあるのでおすすめしません)

そこに書かれているPINコードを入力します。

また、同時に銀行口座を設定することが可能になります。

口座を設定すると、1円から99円のデポジットが銀行に振り込まれるので、
その金額を入力することで収益の受け取りが可能になります。
(8000円以上になると実際に振り込まれます。)




快適に運営するために

私が今までやってきたいろいろです。


・広告を配置する位置や種類について



自動広告を配置すると、広告のフォーマットとして、ページ内広告関連コンテンツアンカーモバイル全画面というのをそれぞれ配置するか選べます。
(追記:2022年に関連コンテンツは廃止されました)

ここで、私は、自分自身がアンカー広告(スマホでページの下のほうにずっと出ているやつ)、モバイル全画面(ページ読み込み中に全面表示されるやつ)は、操作しづらくなるな~と思っているので表示していません。

また、関連コンテンツは、記事一覧のうちの一つと見せかけて実は広告…みたいなタイプの広告です。
最低限のトラフィック量とページ数が必要らしいのですが、私は現在使えてないようです。
(追記:解禁されたけどその後廃止されたので特に意味なかった)

こちら(https://fukuro-press.com/adsense-qua-for-matched-content/)によると、1日のアクセス数が200以上、記事数100以上はないとダメそうです。

1日のアクセス数もそうですし、ついでに月間1万PVっていうのに関しても、今のこのブログの倍より少し多いくらいですかね。

頑張って目指さなくてもいいんじゃないでしょうかね(あくまでゆるくやる)

というわけでわざわざ表示しているのはページ内広告のみということになります。

また、投稿とリスティングの間に表示されるインフィード広告、記事やコンテンツ内に表示される記事内広告というのもあり、自動でも手動でも配置できる広告です。

(頑張って書いたけど正直よくわかってない)



・特定の広告をブロックすることも可能



アドセンスの管理画面には、なんと(?)「ブロックのコントロール」という項目が存在します。
デフォルトでは、そこをクリックすると「広告レビューセンター」が出てきますので、個別の広告をokかブロックか決めることができます

また、普段どんな広告が表示されているのかをそこで見ることができて面白いです(?)


ただ、毎回それをやっていると面倒なので、「ブロックのコントロール」のうち、「すべてのサイト」や自分の登録サイトのURLの項目をクリックしましょう

そこで、例えば「一般カテゴリを管理」をクリックすると、
特定のカテゴリの広告をブロックすることができます。


ここで、各カテゴリの広告インプレッション率と収益率を確認することもできます。

私の場合、広告インプレッション率ではアート・エンターテインメント、収益率ではパソコン、家庭用電化製品がトップになってました
(細かく数字をいうのは規約に違反しそうなのでやめておきます)




・趣味でやるのであれば収益の上下を気にしすぎない


1年弱前、PVは順調に増え続けているのになぜか収益が異様に減った時がありました。

気にしていなかったので調べなかったのですが、どうやら、Googleの何らかのアップデート直後など、収益が減るときがあるようです。
そのあとちゃんと増えたので気にしないほうがいいです。
(バグってるとか、サイトが規約違反の警告を受けたとか、そういう明確な問題がある場合は気にしたほうがいいです。)





おまけ


・ブログを楽しく細長く続けるために(実質、Bloggerいいですよという話)




趣味でやるなら「更新を義務と思わないこと」ではないでしょうか。

気が向いたら更新すればいいか…と思っていたら気づいたら2年が過ぎていました。
最大で2か月ほど更新しないときもありました。

それでも続けてきたのは、継続的にアクセスがあったおかげかもしれません。


今の時代でも変わらないブログのよいところは、

①内容をあとから簡単に変更できること
②更新直後だけアクセスが多くなるわけではないところ

だと思っています。

昔やっていた某ブログサービスだと、更新直後だけ何かのページに表示されるのか必ず数アクセスされて、更新しない日だと訪問者ゼロということも多かったです。

そして、やってる意味あるのかな…?となってやめました。
(②、他社サービスだと微妙ですね。あれ
あと、時事ネタでバズったときとかも例外です)

その点(変に比べたいわけではないのですが…)Bloggerだと、同じサービスでブログを運営している人が流入してきてアクセスというのはまずないと思います。

そういうのを表示するところがそもそもないですから。

ということで、別に人が来なくていいからひっそり書く、というのをあえてやることもできますし、
何もなかったところからbotのアクセスが来て、何かの検索に引っかかってアクセス数が段々増えていくのを楽しむこともできます。


あと、Bloggerの特徴としては、記事を書いているときはブログ自体はとは全く違う画面で落ち着いて編集できるというのがあります。
(もちろんプレビューも見れます)


そして、メインの編集画面で簡単に記事ごとのアクセス数を見ることができるのも特徴です。
(自分のアクセスを追跡しないように設定していない場合、自分のアクセスが含まれます。また、botのアクセスも含みます。)

最大で3000アクセスを超えている記事もありますし、一桁のもあります。
でも、なんとなく、いい意味でどちらも変わらない目で見ることができているんじゃないかなーと思うわけです。

新着記事

すみすみ ステージ240 攻略 (エリア12) すごい旗を立ててクリア

  エリア12では 缶入りクッキー 🍪が登場。 今回はその最終ステージ、ステージ240の攻略を書いていきます。 私自身はエリア12はすべて旗を立ててクリア済みなので、 すごい旗を立ててクリア を目指してみました。(ビッグスイーツが2つになる) ということで...

Topics