ブログのわかりやすい文章の書き方をゲームに学ぶ！読みやすい改行など

 

 

日々の作業やお勉強、お疲れさまです！

元社畜ゲーマー姉弟のアネオトです。

 

 

 

今回は、ブログの文章がグーーーンと良くなる
ちょっと変わったテクニックをご紹介します。

 

 

しかもそれを学ぶ題材は……任天堂のゲームです！

（成功しているゲームからは学べることがたくさんあります）

 

 

 

 

文章って、いくら内容が良かったとしても
「読みたいな」と思わないかぎり読みませんよね。

 

 

 

読む気がしない、しんどい文章と
ふしぎと楽しく読めちゃう文章ってあるんです。

 

 

「読みたいな」と思わせてからの
「読んでて楽しい」というキモチにさせるコツは
「読みやすい」＆「頭にスルスル入ってくる」
そんな文章にすることです。

 

 

 

ブログにおける上手い文章とは
「脳が疲れずに、欲しい情報が手に入る」
そんな“受け取りやすい”文章です。

 

 

 

その具体的なライティング技術を、
音声動画と記事で解説します～！

 

 

有名ゲームから文章術を学んじゃいましょう！

 

 

 

 

 

読者さんは「目で文章を見て」から
「文章として内容を理解」します。

 

 

「目で見る」の関門をクリアして初めて
しっかり読んでもらうことができます。

 

 

パッと見て「読みやすそう！」と
思ってもらうことがとっても大切です。

 

行間の広さと文字サイズを適切に

 

見た目で読む気が失せるページは
非常にもったいないです！

 

 

最近のブログのテンプレートは
デザインの綺麗なものが多いので、
あまり心配はいらないかと思いますが、
文字がぎゅうぎゅうになっていないか確認しましょう。

 

 

 

 

 

 

 

 

 

 

 

 

漢字よりひらがなを気持ち多めにする

 

記事の文章が漢字だらけだと、
それだけで……

 

 

「読みにくそう、読みたくない」

「とっつきにくい、難しそう」

「頭を使わないと読めなさそう」

「疲れる文章なんだろうな」

 

そんな印象にさせてしまいます。

 

 

 

「こんな疲れる記事を読むんだったら、
検索結果に戻って、もっとラクに
読めそうなページを探そ～っ」

 

と思って離脱してしまうこともあります！

 

 

 

 

１行の中で、ひらがなやカタカナが
７割くらいを占めているのが
理想的なバランスです。

 

 

漢字が少なめの表現を意識することで、
頭に入ってきやすい日本語にもなります～！

 

 

 

 

 

かたまりを意識して、文をスキマでわける

 

人間が文章を読むとき、
視線の動きが大きければ大きいほど
とっても疲れてしまいます！

 

 

 

動かす幅をせまくしてあげれば、
上から下にサーっと目線を流すだけで
文章がラクに読むことができます。

 

 

 

目をなるべく動かさずに読めるように、
適度に改行をして、文章のカタマリを
作ってあげるのがおすすめです！

 

 

icon-pencil おすすめな型はこんな感じ！

タテ：最大４行まで

ヨコ：最大20文字くらいまで

 

 

 

こうすることで自然と、無駄のない
わかりやすい文章にもなりやすいです。

 

 

 

また、この１カタマリを作ったら、
２～４行ほど改行をいれて、
次の１文までのスキマを作ってあげると
ほどよい小休憩になり読みやすいです。

 

 

 

一回で目に入る文字量を
少なくしてあげることがコツです。

 

 

 

ちょうどアネオトが書いている
このブログ記事もこの形式を採用しています！

 

（まあアネオトもときどき２０文字以上に
はみだしていることもありますが、
ガチガチにルールを縛るとやりにくいので、
ゆるく意識して取り入れてみてください～！）

 

 

 

 

 

PCでは改行アリ、スマホでは改行ナシにする方法

 

動画の最後のほうでお話した
CSSの設定方法を解説します。

 

 

 

ワードプレスの管理画面より、
【外観＞カスタマイズ＞追加CSS】
をひらきます。

 

（※お使いのテンプレートによって
表記がことなる場合があります！）

 

 

 

追加CSSの入力欄に、下記を追加してください。

（コピペできます！）

 

@media only screen and (max-width: 719px) {
	.●●● p br,
	.●●● li br { display: none;}
}

 

 

 

さて、この「●●●」部分に入れる英字は、
自分で探す必要があります！＞＜

 

 

 

あなたのブログの記事ページをひらいて、
本文の１行目あたりにカーソルを置き、
右クリック→『検証』（もしくは『要素を調査』）
を選択してみてください。

 

 

 

するとソースが表示されます。

 

 

今カーソルを合わせて選択された文字列<p>の
直前あたりに、こんなタグがあるはずです。

 

 

<div class=”●●●”>

 

 

 

 

この「”　”」で囲まれた中の
●●●にあたる英字を
先ほどのCSSの●●●の部分に
ペーストしてください。

 

 

テンプレートによってこの英字は異なりますが、
だいたいは「entry」や「entry-×××××」
といった名前じゃないかと思います！

 

 

 

これで保存すればCSS側は完了です。

 

 

 

続けて、ワードプレスで記事を書くときの
入力方法もご説明します。

 

 

 

１文（「。」や「！」で終わるまで）
のあとの改行は普通に「Enter」で行います。

 

 

そして、途中改行は
「Shift」＋「Enter」で行ってください。

 

 

 

 

こうすれば、「。」のあとの普通の改行は
スマホ側でもしっかり改行されます。

 

 

そして「Shift」＋「Enter」で改行したところは
スマホ側では改行ナシとなります♪

 

 

 

 

テンプレートによってはわかりにくいと思うので、
わからなかったり、上手くいかなかったりしたら、
お問い合わせフォームからご相談ください！

 

 

 

今回はワードプレスのケースでご説明しましたが、
その他の無料ブログなどをお使いの場合は、
少しやっかいかもしれません……！

 

 

それでもアドバイスはできるかと思うので、
よければお気軽にご相談くださいませ。