はてなブログ2年目。先輩ブロガーを見習って、もうすこし読みやすいブログにしようと奮闘中のジョヴァンナです。
主に、読みやすいorSEOに強い記述の仕方のまとめです。
前半では「基本的なポイント」を紹介し、「具体的なやり方」については末尾に参考URLを載せています。
私のごとき弱小ブロガーの分際で「読まれるブログ術」を語るのはおこがましいんですが…
意外と《基本中の基本》情報が見つからなくて困ったので、ここにまとめておきます。「基本はわかってるよ!」って人には今さらの話かと思います。
キーワード選択、話題選び、文章術などについては一切書いていません。
そんなエントリーです。よろしければ、どうぞ!
[目次]
読みやすい・読まれやすい記事の書き方
1.タイトルのつけ方
SEOを意識して変えてみました。
- キーワード:固有名詞は0~1ケ。なるべく固有名詞を使わずに、皆が知ってそうな言葉だけで短文をつくる。
- 長さ:30文字以内。スマホ表示で2行以内を目安に収める。
- シリーズもの:同じタイトルが続くのはやめました。個別にタイトルをつけて、シリーズの設定はカテゴリを利用することにします。
2.目次を挿入する
はてなブログでは本文に空白[:contents]空白って入れるだけで、自動的に見出しを拾って目次をつくってくれます。
いろいろカスタマイズも見かけるけど、私はこれだけ! 目次に番号をつけたいときは見出しに手作業で入れます。
3.本文は長めに
1000字前後の短めのエントリーが中心
↓
2000~3000字位の長めにしてみました。実感的にも読みごたえという点で、適度な長さはあったほうがいいです。薄い内容を水増しすることはないけれどもね。
4.見出しの工夫
4-1.見出しにキーワードを入れる
見出しの中身って検索エンジンでチェックされてるらしいよ! 知らなかった…。
ってことは、見出しにはなるべくキャッチーなキーワードを使うといいですね。
だからと言って、記事と無関係なキーワードを入れるのは逆効果だからやめときましょう!
4-2.スマホ版の見出しを目立たせる。
大見出し、中見出しにCSSをわりあてました。これで見出しと本文の見分けがつきやすく、読みやすくなりました。
5.文字色は標準に近いものを
- 本文:標準の大きさと色で。
- 強調箇所:太字にするだけ! 字を大きくするのはセンスに自信がなく、やめました。赤い字も色弱の方に見えづらいそうです。
- リンク色:明るいグリーン→青系に変更。青のほうが見やすいはず!
- 注意書きや写真のキャプション:小さい字に。色つきは、PCの背景色を変更したときに見づらいのでやめました。
6.カッコや記号の統一
基本的には全角に統一しました。きまりはないけれど、今後当ブログでは下記のように統一します。
- 「」:会話文、引用文
- ():備考など
- 《》:固有名詞など
- 『』:作品タイトルなど
- 【】:強調するキーワードなど
7.改行は最小限に
改行しまくってスカスカの文面はスマホでは見やすいけれども、PCで見るとちょっと格好悪い!
当ブログでは改行は下記のときだけにしました。
- 段落の前
- 強調したいとき(前後に改行)
- 見出しの前
8.スマホ版・背景の工夫
CSSを使用して目立たせることに。
- グレー背景:引用文
- ブルー背景:強調したい文章
- 四角い枠:注意事項など
9.写真、アイキャッチはどうする?
- 写真中心のエントリー:alt属性ってやつを記入する。
- スクリーンショット:PCで見たときに大きすぎる写真は横幅600pxまで縮小する。
- アイキャッチ:自分で撮った写真は暗い! 著作権フリーの無料配布サイトを利用する。
- 著作権を守ろう:自分で撮った写真と《無断使用OK》のサイトからダウンロードした写真以外の利用は慎重に。マンガを引用する際は最小限に留め、必ず引用元を表示する。
10.カテゴリは1記事につき1つだけにしよう!
カテゴリはひとつの記事にいくつもつけられるので、タグのようにベタベタいくつも貼っちゃってました。
↓
あまりよろしくないという意見を知り、1記事=1カテゴリに変更しました。
現在は、親カテゴリ-子カテゴリ方式を採用してます。(後々パンくずリストにも反映させる予定。)
終わりに
以上、いろいろ試行錯誤して以前よりは見やすくなったんじゃないかなーと自己満足してます。ここに書いたコツをやってみたい方は、下記の参考文献も合わせてご覧ください。
まだ見づらいよ~という方は、ぜひ!アドバイスお願いします。
SEO対策は「10年使える」って本を参考に初歩的なことをやってるだけなので、最新事情はこれから勉強します。
このブログは「稼ぐ」目的じゃないのでゆるーくやってますが、これから制作するお仕事ブログではもうちょいハングリーに結果を求めていくよ!
なにかおもしろいことがわかったら、シェアします。
参考URLはこちら。
1.タイトルのつけ方/2.目次/4-1.見出しにキーワード
SEO対策は下記の書籍を参考にしました。ゆるいイラスト入りの《会話形式》で要点だけがまとめられた本です。
実用書を読むのは楽しくないから、なるべく薄くてすぐ読み終わるやつを選んでます。この本はあっという間に読めました!
「タイトルにみんなが知らない言葉を使わない方がいいよ」って教えてくれたのは、かん吉様のエントリーでした。
『わかったブログ』おもしろいんでKindle買いました。
4-2.スマホ版の見出しCSS
Shun様提供コードをアレンジして使用しました。
はてなブログのスマホデザインを一瞬でおしゃれにカスタマイズする方法 - いつ俺〜いつから俺ができないと錯覚していた?〜
5.文字色について
northgeek様のエントリーを参考に変えてみました。もしかしたら、グレーも見づらいですかねー?
ブログに赤文字を使わないで欲しい3つの理由 - North-Geek
6.カッコや記号の使い分けについて
『きんどるどうでしょう』の記事を参考にしました。
もう迷わない!「」『』()【】の“使いどころ”/テクニカルライターが教える、文章の見た目を良くする技術 - きんどう
8.背景CSS
ゆきひー様提供コードを使用。ブルーの色味はヘッダー使用色を薄めて使っています。
画像でなくcssで背景をつけてブログ記事を一気に読みやすくする方法 - Yukihy Life
9.写真のalt属性を設定する方法
この超便利な拡張機能の製作者は、ぽけっとしすてむ様です。
はてなブログの画像タイトルとaltを編集できる「はてブロimageTitle」というChrome拡張を作った - すなばいじり
10.カテゴリは親子方式で
池田仮名様の方式を利用させていただきます。
カテゴリの整理は記事数が少ないうちにやっておいた方がラクそう!
はてなブログでGoogleにパンくずリストを認識させるカスタマイズ - 太陽がまぶしかったから
なぜ1つに限定すべきなのかは、こちらのエントリーを読んでガッテンしました!
参考にさせていただいたブロガーの皆様、ありがとうございました。
《おしまい》