今回は私が１年間はてなブログを続けてみて、やってよかった設定や最初からやっておけばと感じた設定をお伝えします。尚、当ブログは、はてなブログProで運営しています。無料版は違う仕様になっている場合もありますのでご了承下さい。
- おすすめ①写真を圧縮する
- おすすめ②写真の画質を落とす
- おすすめ③文字を大きくする
- おすすめ④自分で自分のブログの読者になる
- おすすめ⑤Aboutページを充実させる
- おすすめ⑥ブクマへのクレーマー対策
- おすすめ⑦文章を枠で囲む
- おすすめ⑧アイキャッチ画像、カスタムＵＲＬ、記事の概要
- 番外編＊ブログ村などランキングサイトのメリット・デメリット
- ブログを楽しむために
おすすめ①写真を圧縮する
アイキャッチ画像など、自分で撮った写真や画像サイトからの写真を多くの方が使用します。そのまま使うと、記事がたまるにつれてサイトが重くなり、読み込み速度が遅延します。せっかく訪れてくれた読者が離れかねず、ＳＥＯ的にもマイナスです。
快適な動作環境を維持するために、写真の圧縮はおすすめです。最初からやっておけば・・・と私は後悔していて今後リライトしながら対応します。圧縮にはこんなサイトもあるので活用してみて下さい。写真をドラッグするだけです。圧縮した写真のファイル名に【min】がつくのでわかりやすいです。
おすすめ②写真の画質を落とす
写真の圧縮と同様に、サイトが重たくならないよう画質を落とす設定も最初にしておけばと思いました。【ダッシュボード】→【利用中のサービス】→【はてなフォトライフ】→一番上のバーの【設定】→【はてなフォトライフの設定画面】になるので、上から三番目の画質を任意の数字に変えます。ちなみに私は６０％にしています。素人目には画質の変化は全くわかりません。
おすすめ③文字を大きくする
Googleが推奨している大きさは１６pxですがはてなブログのテーマはなぜか１５px以下のものが少なくありません。特にスマホ画面の文字はかなり小さい場合があります。
私はパソコン画面を１６px、スマホ画面は１７pxにしています。もっと大きくしている方もいます。文字サイズ変更のやり方を教えてくれるサイトをいくつか参考にしましたが、なぜか当サイトではうまくいかないことが多く、最終的にパソコン画面は下記のコードを【デザイン】→（真ん中の）【カスタマイズ】→【デザインＣＳＳ】に入れました。pxの前の数字を任意で変更できます。
.entry-content p {font-size: 16px;}
スマホはレスポンシブではないので、このコードの前後に＜＞部分を足しました。
【デザイン】→（一番右）【スマートフォン】→【ヘッダ】→【タイトル下】→スマートフォン用にHTMLを設定するにチェックを入れて、下記コードをコピペ。
<style type="text/css">
.entry-content {
font-size:17px;
}
</style>
変更を保存するを忘れずに。その前にプレビューで必ず確認し、ご自身のテーマに合わない場合は、使用しないでください。
オークニさんのサイトを参考にしました。他にもaboutページの編集やアニメーションなども参考にしました。本当にありがとうございます。
「うわっ…はてなブログ、読みにくすぎ…！」最大の原因はコレ - オークニズム
おすすめ④自分で自分のブログの読者になる
えっ？そんなことしているの？と言われそうですが、しています。なぜなら記事を公開した後、読者の方にどのようにアイキャッチ画像や記事の概要が反映されているか確認できるからです。いつも記事を公開した後は、必ずスマホ画面とパソコン画面の両方で、購読中のブログのところを開き、アイキャッチ画像がずれていないか、印象が薄くないかなど確認し必要に応じて変更しています。個人的にはおすすめです。
おすすめ⑤Aboutページを充実させる
数あるブログの中からありがたくも自分のブログに訪れてくれた方に、どういうことを伝えるブログなのか、他のブログとどう違うのか、やはり伝えたいものです。なぜならもう一度戻って読みにきて頂きたいから。
はてなブログはアイコンやＩＤをクリックするとaboutページに飛びます。「私はこんな人です。このブログではこんなことを伝えています」とAboutページで伝えることができます。
【ダッシュボード】→【設定】→【基本設定】にいくと、【aboutページ】→【aboutページの編集】があり、自分で自由に編集できる場所があります。
デフォルトはＨＴＭＬモードになっていますので普通に書くと改行されずに反映されます。<br>＝改行など簡単なタグを使って書いてもいいのですが、おそらく最も簡単な方法は、普段記事を書く時のように【記事を書く】から好きなように書いて、プレビューで確認しＯＫなら、真ん中のＨＴＭＬ編集の画面を全コピー→それをaboutページ編集画面に貼り付けるとあっという間に完成します。
ブログのaboutページを自由に編集できるようにしました（ページタイトルについて追記あり） - はてなブログ開発ブログ
おすすめ⑥ブクマへのクレーマー対策
はてなブログにはとても温かいコミュニティがあり、それが最大の魅力といっても過言ではありません。私自身、はてなブログはとても居心地がよく、これまでたくさんの方の温かい言葉に、勇気づけられてきました。
ただその一方で、誰彼構わずにブックマークのコメント欄に、罵詈雑言を残していく人がいることも事実です。当ブログにはまだ一度もありませんが、私が読書登録している複数の素晴らしいブログにそういうことがありました。それが原因でモチベーションが低下したり、ブログをやめてしまってはとても残念です。
そういう場合は、ブックマークコメント欄の右端にある・・・の部分をクリック、スマホなら押下すると、お気に入りに登録、ユーザーを非表示、通報する、というリストが出てきます。そこでユーザーを非表示にすれば、しばらくすると反映され表示されなくなります。
おすすめ⑦文章を枠で囲む
少し強調したことやまとめたいことを、枠で囲むことができます。下記のコードをＨＴＭＬ編集の任意の場所にコピペし、ここに本文を入れる、というところに文章を入れるだけです。
<div style="border: 2px solid #4169e1; padding: 10px; border-radius: 10px;"> <p>ここに本文を入れる</p> </div>
すると、こんな風になります。
ここに本文を入れる
2pxところは枠線の太さなので、数字を変えればお好みの太さにできます。
#4169e1は色を表すので、お好きな色にコードを使って変更できます。
WEB色見本 原色大辞典 - HTMLカラーコード
border-radius:は角が丸くなります。ここを消すと直角になります。
おすすめ⑧アイキャッチ画像、カスタムＵＲＬ、記事の概要
記事は書いてそのまま公開しているわけではなく、編集オプションからアイキャッチ画像と任意のカスタムＵＲＬを決め、記事の概要をまとめてから公開しています。面倒に思う方もいるかもしれませんが、ここはとても大切な部分なのでやることをおすすめです。
ちなみに、記事を投稿した後にカスタムＵＲＬを変更すると、それまでに読者の方がつけてくれたはてなスターやブックマークが消えてしまいますので注意して下さい。また参考までに、私は画像によく無料画像サイトのpixabayを使っています。画像を検索する際、同じ意味でも英語と日本語では表示される画像が変わるので、試してみて下さい。
番外編＊ブログ村などランキングサイトのメリット・デメリット
はてなブログでは多くの方が、にほんブログ村などのランキングサイトのバナーを貼っています。中には記事を書く楽しみやモチベーションの一つとしている方もいたり、実際にたくさんの読者を獲得していらっしゃる方もいてメリットもあります。
当ブログでも１年間貼っていましたが、全アクセス数の１パーセントにも満たないことがほとんどだったため外すことにしました。
デメリットとしてバナーを貼り付けることでページの読み込み速度が遅くなること、ブログからの離脱率・直帰率・平均滞在時間に悪影響が出てSEO的にマイナスになることが考えられます。ご自身のブログにあった方法で、上手に活用したいですね。
私は一読者として、よくバナーの近くに「押して下さい」とか「応援お願いします」と書かれていると、忘れることなく押しています。バナーをつける方は、一言添えるといいかもしれません。
ブログを楽しむために
私はまだ２年目が始まったばかりですが、長くブログを続けている方に共通していることは、あらゆる数字的なことを超越していて、とにかく書くことを楽しんでいらっしゃる印象を強く受けます。飾らない文章で、ＳＥＯ対策にがんじがめにならずにのびのびと自分のペースで書いていて、「ああ、本当に書くことが楽しいんだろうな」と記事から伝わってきます。だから読者としても読んでいて楽しく感じるのでしょう。私はブログを始めて以来、楽しむために以下のようなことを学びました。
記事にはベストを尽くし、結果は気にしない。一喜一憂すると疲れ果てるから。
自分が心地よく感じるペースを守る。楽しまないと続かないから。
絶対に自分のブログを卑下しない。誰もいい気分にならないから。
読者に心から感謝を！それ以上に大切なことはないから。
今日も最後まで希望発見ブログをお読みいただき、ありがとうございました。
Your spiritual friend, ラニ
