ブログ初心者がはてなブログで記事を書く前に気をつけるべき11の注意点

このブログをはてなブログで始めてはまだ間もないのですが

はてなブログ自体は以前よりお世話になっていた為、いくつかのブログ運営を通してブログ記事を書く上で注意するべきポイントがいくつかある事に気づきました

ですので今回はそれを皆さんにシェアしたいと思います！

この記事ははてなブログ初心者や後にWordPressに移行するかもしれない可能性ある方に特におススメです

タイトルは32文字以内に

まず記事を書く上で必ずつけるタイトル

このタイトルをつけるって事ですけど

めっちゃくちゃ大事です！ほんとに！

本文と同等かそれ以上に大事

別に趣味でやってるから〜って人はタイトルも好きにつけてもらって構わないと思うんですけど

のちに検索流入を視野に入れていくなら絶対にタイトルにはこだわる必要があります

なんならタイトル一つでアクセスがガラリと変わってしまうって事も容易にありますし

本文が素晴らしいことを書いててもタイトルに意図がないと最初のクリックすら生まれないので

結果的に素晴らしい記事を書いた時間と熱意が全くの無駄になってしまいます

そしてタイトルは見出しにもあるように32文字以内でつける事

これはあらゆるタイトル表示の場面で

33文字以上だとブラウザの表示の関係上、タイトルが途中で切れてしまって肝心のタイトルが見えなくなってしまったりするので

32文字以内に収まるようにタイトルをつける事が必要となります

ですので、必ず文字数を意識しましょう！

タイトルにキーワードを含ませる

さて、32文字以内でタイトルをつける意識を持てたところで

今度は狙ったキーワードを無理なくその中に入れていく事を意識しましょう

例えば今回のタイトルだと

ブログ初心者
はてなブログ
記事
注意点

なんていうキーワードを入れ

『ブログ初心者がはてなブログで記事を書く前に気をつけるべき1１の注意点』

というタイトルにしました

そしてキーワードを入れたら、その上で文章的に変ではないものにしつつ、そのキーワードで検索した方の目に留まるようにしなければなりません

もちろん今回のこのタイトルが100%正解というわけではありませんし

色んな形のタイトルがあるとは思いますが、ぜひ一つの見本として参考にされてください

キーワードの探し方に関しては今後別で記事にしたいと思います

タイトルに数字を入れる

これは人間の心理的なもので

数字が入ったタイトルの方が具体性があって内容が把握できることに意味があります

実際に以上の点を踏まえてタイトルを見比べてみると

『ブログを書くときに注意すべきこと』

とするより

『ブログ初心者がはてなブログで記事を書く前に気をつけるべき11の注意点』

とした方が

見る手側にとったら対象がはっきりとしていて印象に残りやすく

明確に11個の注意点があるのだということが判断できます

漠然としたタイトルよりもターゲットを絞ったタイトルの方がSEOの観点から言ってものちのち結果的により多くの人に読まれることになるでしょう

ただし全ての記事に数字を入れると似たようなタイトルになりがちなのでその点は注意です

カスタムURLを入力する

はてなブログを始めるとダッシュボードの「設定」に

URLをどうするか選択する項目がありますが

こちらはデフォルトの標準でいいでしょう

間違えても日本語タイトルにはしないように！(後述)

ダイアリー風でも問題は無いのですが

SEO的に言っても、記事編集画面右の設定マーク内にあるカスタムURLを入力する事を強くオススメします！

なぜかというと、この記事のURLにもキーワードを入れることでSEOに効果があると言われているからです

ちなみにSEOというのは検索エンジン最適化(Search Engine Optimization)の略で

グーグル・ヤフーなんかの検索画面で検索した時に上位表示されるための対策のことです

もちろん自分の書いた記事が検索で上位表示されるとクリック数が確実に上がりますし、多くの人が見てくれるようになります

せっかく書いた記事をインターネットの氷山の一角に埋もれさせてしまうのはもったいないですからね

少しでもSEOに効果があることはやっておきたいところ。

ですので標準でもなくダイアリー風でもなくカスタムURLにキーワードを入れる事をするべきなんですね

では、日本語タイトルにすれば「日本語のキーワードが入るんじゃ無いか」って話なんですけど

たしかに日本語タイトルにすると一見読者的にはURLが日本語の為、どんな記事なのかわかりやすいようなものなのですが

実はこれが落とし穴で

その記事のリンクを貼り付けたり

グーグルアナリティクスで記事の確認をしたりする時に

ものすごく長い意味不明の文字列が表示されてしまうのです

このように（こちらは今回のタイトルをURLに変換したものです）

http://〜〜〜/entry/%e3%83%96%e3%83%ad%e3%82%b0%e5%88%9d%e5%bf%83%e8%80%85%e3%81%8c%e3%81%af%e3%81%a6%e3%81%aa%e3%83%96%e3%83%ad%e3%82%b0%e3%81%a7%e8%a8%98%e4%ba%8b%e3%82%92%e6%9b%b8%e3%81%8f%e5%89%8d%e3%81%ab%e6%b0%97%e3%82%92%e3%81%a4%e3%81%91%e3%82%8b%e3%81%b9%e3%81%8d11%e3%81%ae%e6%b3%a8%e6%84%8f%e7%82%b9

こうなるとそのURLだけでは正直なんの記事なのか見当もつきません

もちろん僕たちが見る上でも分かりづらい上にSEO的にもURLはすっきりとしてわかりやすい方が良いそうです

URLをクローラーが判断する際に、文字列は英字(かローマ字)とハイフンでシンプルに作られた方が良いと言われていますので

上記のようなURLよりは今回のように

http://〜〜〜/entry/hatenablog-writing-skills

などとした方が良いと言えるので、こちらは手間を惜しまず入力するようにしましょう

のちにWordPressに移動するかもしれないという人にとってもこれは必ずしておくべきポイントと言えます(経験談)

画像はFlickrなどを使用がおススメ

ブログ記事を書く上で適度な画像の使用はすべきです

一つも画像がない記事より、適度に画像があると視覚的にイメージが湧きやすいですし、印象に残りやすくなります

しかしデフォルトで使用可能のはてなフォトライフの使用には注意が必要です

なぜかというとはてなフォトライフで貼り付けた画像の裏側にその意味があります

裏側というのは画像のHTMLの事です

通常画像を貼り付け「みたまま記法」で見る分にはなんの問題もありません

しかしHTML編集画面にし、その画像の情報を見てみると

画像のtitleやalt属性が意図していないものになっているのです

画像のtitleとは

その名の通り画像にタイトルをつける事で、

この画像は〇〇という名前ですよーとブラウザに知らせる役割をします

パソコンでブログ記事を見た際にカーソルを画像の上に置くと現れるあの文字列の事です

あそこが自分で決めたタイトルに変更できます

alt属性というのは

ブラウザの仕様や環境によって画像が表示されない時に画面上に表示する文字列の事です

設定すると、通常画面上に画像が表示される部分に、代わりに文字でこの画像は〇〇という画像ですよーとユーザーとブラウザに伝えてくれます

これがなんでも画像のSEOに効果があると言われています

みなさんは検索時に検索結果に出た画像からサイトにアクセスした経験はお有りでしょうか？

検索結果に出た画像が気になってアクセスするという可能性も考えた時に

この画像の裏側の情報をコントロールすることは非常に重要といえます

ではどのようにすればいいのかという事ですが

ずばりオススメはFlickrを使って画像を貼り付ける事です

もちろんHTML編集から一つ一つのalt属性を変更することも出来るでしょうが大変です

Flickrを使う事によって画像の情報がある程度整った状態で貼り付けられますし

はてなのフォトライフのアップロード容量を気にすることもありません(Proは除き)

それと後にWordPressなどに移動した際に画像の保管場所だけがはてなのサービス上にあるような

記事＝(WordPress)・画像＝(はてな)

という歪な状況もなくなります

Flickrへアップロード前に画像のタイトルをキチンと入力しておけばあとは貼り付けで勝手にalt属性もタイトルと同じに変更されていますので楽です

https://www.flickr.com/

使用の際ははてなブログの記事編集画面右の「追加」ボタンから「Flickr貼り付け」アイコンを追加しておくと貼り付けが楽になりますので追加しておきましょう

Flickr画像をHTNL編集で調整

とはいえFlickrでの画像貼り付けをした後ですが

こちらも少しだけやるべき事があります

それは、画像を貼り付けた後にHTML編集でimgタグ以外の部分を削除する事です

Flickrの画像を貼り付けただけではデフォルトの仕様で画像の上に色々表示されてしまいます

このように

<a data-flickr-embed="true" http://blog.hatena.ne.jp/marukan01/doronkoasobi.hatenadiary.com/edit?entry=8599973812332469701#sourcehref="https://www.flickr.com/photos/154243526@N03/39528620631/" title="writting-note by nakuram, on Flickr"><img src="https://farm5.staticflickr.com/4680/39528620631_ac2921f19a_z.jpg" alt="writting-note" width="640" /></a><script async="" src="https://embedr.flickr.com/assets/client-code.js" charset="utf-8"></script>

画像のみを使用したい時にこの情報は余計なものとなりますので

画像を貼り付けたらHTML編集で

<img〜〜〜>

以外の前後の部分を削除してしまいましょう

<img src="https://farm5.staticflickr.com/4680/39528620631_ac2921f19a_z.jpg" alt="writting-note" width="640" />

これで画像のみが残りalt属性もキチンと設定されています

入力する事は無く必要ない部分の削除だけすれば良いので難しい事はありません

アイキャッチ画像はリサイズ・圧縮しておく

記事を書き投稿するとタイトル横に画像が表示されますアイキャッチ画像ですが

この画像の設定は記事編集画面の右の「編集オプション」→「カスタムURL」の下側から選べると思います

ですがこの選ぶ画像に関しては特に大きさの調整と圧縮をされることをオススメします

記事内の画像は記事ページに行って初めて表示されますが

この記事タイトル横のアイキャッチ画像はトップページにも表示されてしまいます

自分のブログの表示スピードを速くする上でこの一つ一つのサムネイル画像を適切なサイズにリサイズし

ブログの表示スピードを上げる事でユーザーが快適にブログ内を巡回できるようにするべきです

もちろん記事内の一つ一つの画像をリサイズ・圧縮できる時間があるのならした方がいいと思います

ですが最低でもサムネイルに使われる画像だけは適切に(小さく)しておいた方がいいでしょう

圧縮にはこちらのサイトが有名で優秀です

https://tinypng.com/

ドラッグアンドドロップするだけの簡単操作でできます

見出しにh2がない事を知っておく

はてなブログの記事編集画面では見出しをボタン一つでつけれます

これはこれで楽なのですが知っておくべきことがあります

それは見出しがh3タグから付いている事です

どういう事かというと

見出しというものはh1・h2・h3………という風に

hの後に数字が入ったタグというもので構成されています

HTML編集画面を見るとわかると思うのですが

1番大きい見出しをつけてもはてなブログの場合ではh3から始まっています

本来、ブログなどにおいてもこの見出しの階層分けの意識は持っておくべきものなのですが

h1タグというものはブログそのものの大きな見出しを示しているので、普段記事内では使わない方が良いとされており

h2以降のタグを使用する事が望ましいとされている上、読者にとってみやすくなるよう階層のように組み立てる必要があります

しかしはてなブログではh1の次に大きい見出しのh2見出しを使わずにh3から使う仕様なっているんです

これははてなのサービス「はてなダイアリー」の仕様の影響だといわれていますが

ブログの階層的には間が抜けているような状態なわけです

間が抜けているというだけでも気持ち悪いし、SEO的にも良くは無い

ということでHTML編集でh2タグを作るようにしましょう

HTML編集画面で

<h3>と</h3>を　→　<h2>と</h2>に

直しておきましょう

見出しを上手に使う

先程h2タグを意識してつけることをオススメしましたが

適度に見出しを使って読者にポイントを伝える事も大変重要です

見出し分けされていると読みやすがグッと上がりますよね。

それに段落分けされているとそこで一息つけます。

ずーっと同じテンポで羅列された文章は息が詰まってしまいますので

読むのに疲れてしまって最後まで読んでもらえなくなってしまう可能性が高いです

そして見出しをキチンと使って階層的に分けられ、その中に狙ったキーワードが適切に入っている事でSEOにも効果があると言われています

見出しを使ってユーザーにもSEO的にも効果のある方法をとりましょう

文章に間隔をあける

ブログの文章は読みやすい方が良いに決まっています

先程の見出しの事と似ていますが

せっかく書いた文章に改行がなされていなかったら、見る側は疲れてしまう上にその中からポイントが探し出しづらくなってしまいます

例えば

今回はブログの記事の書き方について紹介します。僕は今までいくつかのブログを立ち上げてきましたがどうやらどのブログでも共通して言えることがあります。それは記事の書き方はある書き方の法則に沿って書くべきだという事です。どういうことかというとこれまでのデータからどのように書くかによって読者の滞在時間や離脱率に大きな影響があったということがわかったのです。つまりユーザビリティを上げることがブログ運営にはものすごく大事だという事です。

という文章

読みづらいですよね…

改行や空白がなく、句読点も少ないです。

この記事でもそうですが、文章に適度に改行を入れて見やすくすることが読み手にとっては良いということです

面倒くさがらずに改行しましょう