ブログの読みやすい書き方5つの手順｜相談80件で多かった直す所と例文

書き上げた記事をスマホで開くと、1文ごとの改行で画面が縦に長く伸びていたり、太字とマーカーがあちこちに付いていたりすることがあります。読みにくさの原因になるのは、文の長さ・言葉・見せ方・装飾です。直す順番を決めないまま手を付けると、文を書き換えるたびに改行や装飾も付け直すことになります。

この記事では、書いたブログ記事を読みやすく直す手順を、1文と段落・言葉と表記・箇条書きと表と画像・スマホでの確認・装飾の5つに分けて解説します。株式会社メリルが運営するブログ相談ドットコムの相談のうち、読みやすさに触れた80件を分けた結果も載せました。

記事を読めば、自分の記事をどの順番で直し、どこで確かめればよいかがわかります。記事を見てほしい相談18件のうち11件で、回答は改行や句読点など1文と段落の書き方を指摘していました。

ブログ記事を読みやすく直す5つの手順と、相談80件で多かった指摘

ブログ記事の読みやすさは、書き終えた後に順番を決めて直すと上げられます。文を先に直してから装飾を付けると、文を書き換えたときに装飾を付け直す手間がかかりません。書いた記事を読みやすく直す手順は、以下の5つです。

1. 1文と段落の長さを直す
2. 言葉と表記をそろえる
3. 箇条書き・表・画像で並ぶ情報を見せる
4. スマホで見て崩れる所を直す
5. 装飾は使う所を決めて使いすぎない

ブログ相談ドットコム(株式会社メリル運営)に2021年8月〜2026年9月に公開された相談1,398件を調べました。相談か回答に「読みやすい」「改行」「装飾」「表」「スマホ」などの語が出てくる315件を1件ずつ読み、80件を分けています。80件の内訳は、読みやすさを聞いた相談62件と、記事を見てほしい相談で回答が読みやすさに触れた18件です。

読みやすさを聞いた62件で、相談した人が聞いていたことは以下の表のとおりです。

聞いていたこと	相談の件数
表・箇条書き・画像の操作や表示の不具合	17件
装飾(マーカー・囲み枠・吹き出し・文字色)の操作や表示の不具合	13件
改行・空白行・字下げの操作や表示の不具合	6件
スマホだけで起きる本文の表示の不具合	5件
文章や見せ方の書き方	14件
トップページやサイト全体の見た目	7件
計	62件

書き方の14件の内訳は、文章全体の読みやすさと直し方5件・箇条書きと表と画像3件・装飾3件・スマホでの見え方2件・文と段落の長さ1件です。

62件のうち41件は、表や装飾などの操作と表示の不具合の相談でした。文の書き方の迷いは、記事を見てほしい相談への回答の中に多く出てきます。80件の回答の指摘を、5つの手順のまとまりで数えた結果は以下の表のとおりです。

回答の指摘のまとまり	80件全体	うち読みやすさを聞いた62件	うち記事を見てほしい18件
手順1 1文と段落	16件	5件	11件
手順2 言葉と表記	11件	3件	8件
手順3 箇条書き・表・画像	12件	4件	8件
手順4 スマホでの見え方	13件	9件	4件
手順5 装飾	7件	2件	5件
操作・設定の手順を答えた	46件	46件	0件

1件の相談に複数の指摘があるため、合計は80件を超えます。相談の年は、2021年21件・2022年39件・2023年13件・2024年5件・2025年2件です。回答を書いているのは相談サイトの利用者です。

記事を見てほしい18件のうち14件で、回答は5つの手順のどれかに当たる直し所を挙げていました。8件では、指摘が3つ以上のまとまりにまたがっています。最も多いのは手順1の11件で、スマホでの見え方の指摘は読みやすさを聞いた相談に多く出てきました。

記事を書き始めてから公開するまでの全体の流れは、別の記事で解説しています。

» ブログの書き方5つの手順｜相談98件でわかったつまずく所と直し方

手順1 1文と段落の長さを直す

最初に、1文の長さと段落の区切りを直します。記事を見てほしい相談の回答で、5つの手順のうち最も多く指摘されたのが1文と段落の書き方でした。1文と段落を直すときに行うことは、以下の3つです。

• 長い1文は句点で2つに分ける
• 1文ごとに改行せず話のまとまりで段落にする
• 前置きとくり返しを削る

長い1文は句点で2つに分ける

1文が長くなったら、句点で区切って2つ以上の文に分けます。1文が長いと、主語と述語の関係や前後の語句のつながりが乱れて、読みにくくなりやすいためです。

1文の適当な長さは、一概には決められません。国の文書の書き方をまとめた「公用文作成の考え方」(文化審議会、2022年)は、1文が50〜60字ほどになったら読みにくさを確かめるよう勧めています。

長い1文を分けるときは、以下の順に直します。

1. 「〜が、」や「〜し、」で、文を切らずにつないだ所を探す
2. つないだ所で文を切り、句点を打つ
3. 切った後ろの文に、抜けた主語を書き足す

直す前と直した後の文は、以下の表のとおりです。どちらも説明のために作った例文です。

直す前の例文	直した後の例文
テーマを変えたら表示が崩れたので設定を見直したが、原因がわからずプラグインも止めたものの直らなかった。	テーマを変えたら、表示が崩れました。設定を見直しても、原因はわかりませんでした。プラグインを止めても、表示は直りませんでした。

回答で1文が長すぎると指摘された相談は1件で、読点が足りない・読点の位置を直すよう指摘された相談は7件ありました。7件は、どれも記事を見てほしい相談への回答です。

1文ごとに改行せず話のまとまりで段落にする

改行は1文ごとではなく、話のまとまりが変わる所で入れます。80件の回答で多かった書き方の指摘は改行や空白行が多すぎることで、11件ありました。11件のうち7件は、記事を見てほしい相談への回答です。

1文ごとの改行をやめる理由を聞いた相談には、1文ずつ改行した文章は幼く見えるとの回答がありました。同じ回答は、数文ずつまとめて話の区切りで改行するよう勧めています。段落を分けずに文字の塊になっていると指摘された相談も、2件ありました。

ウェブの文章では、段落の頭を1字下げる代わりに、段落の間を広く空けたり行間にゆとりを持たせたりする工夫が使えます。段落にまとめ直す手順は、以下のとおりです。

1. スマホの幅で記事を表示し、1画面に1文ずつしか並ばない所を探す
2. 同じ話をしている文を、1つの段落にまとめる
3. 話が変わる所で、段落を分ける
4. 1つの段落が長くなったら、理由や例に移る所で分ける

見出しの区切り方を、読みやすさの理由として挙げた回答があった相談も3件ありました。見出しの区切り方は、見出しの付け方の記事で解説しています。

» ブログの見出しの付け方4つの手順｜h2・h3の使い方と相談70件の直し方

前置きとくり返しを削る

本題の前の前置きや、同じ内容のくり返しは削ります。回答で要らない文や前置きを削るよう指摘された相談は5件で、うち4件は記事を見てほしい相談でした。説明の順番を整理するよう指摘された相談も、2件あります。

意味が重なる言い回しや回りくどい言い方は、必要のない言葉を削ると短くなります。短くできる言い回しの例は、以下の表のとおりです。

長い言い回し	短くした言い回し
利用することができる	利用できる
調査を実施した	調査した
まず最初に	最初に
違和感を感じる	違和感を覚える

1本の記事に情報を詰め込みすぎて長いと指摘された相談も、2件ありました。1本の記事に入れる情報の量の決め方は、文字数の記事で解説しています。

» ブログの文字数の決め方4つの手順｜相談114件でわかった目安と記事数の考え方

手順2 言葉と表記をそろえる

1文と段落を直したら、言葉と表記をそろえます。記事を見てほしい18件のうち8件で、回答は言葉づかいや表記を指摘していました。言葉と表記をそろえるときに行うことは、以下の3つです。

• 文末と表記を記事の中でそろえる
• 専門用語と略語は言い換えるか説明を付ける
• 誤字脱字と主語・述語を読み直す

文末と表記を記事の中でそろえる

1本の記事の中では、文末を「です・ます」か「だ・である」のどちらかにそろえます。同じ語尾が何文も続いていないかも、文末を見直すときに確かめます。回答では、同じ語尾が続くと指摘された相談が1件、口調がくだけている・話し言葉が多いと指摘された相談が2件ありました。

同じ言葉の書き方も、記事の中で1つに決めます。全角と半角の使い分けや読点の記号も、1つの記事の中でそろえます。回答で表記や文言がそろっていないと指摘された相談は2件でした。表記のゆれは、以下の順に探して直します。

1. 記事でよく使う言葉を書き出し、書き方を1つに決める(例えば「スマホ」と「スマートフォン」)
2. プレビューの画面でブラウザのページ内検索を使い、決めなかった書き方を探す
3. 見つかった所を、決めた書き方に直す

専門用語と略語は言い換えるか説明を付ける

読者が知らない言葉は、ふだん使う言葉に言い換えるか、初めて出てくる所で説明を付けます。回答で専門用語や略語の説明を求められた相談は6件で、うち4件は記事を見てほしい相談でした。略語を元の言葉を示さずに使っていた記事や、用語の補足が足りない記事が指摘を受けています。

言葉を選ぶときは、以下の順に考えます。

1. 読者がふだん使う言葉に言い換えられるかを考える
2. 言い換えると意味がずれる言葉は、初めて出てくる所で説明を付ける
3. 略語は、初めて出てくる所で元になった言葉を書いてから使う

誤字脱字と主語・述語を読み直す

文章を整えた後は、誤字脱字と文の組み立てを読み直します。誤字脱字や文法の誤りをなくすことは、文章を読みやすく整理するときの基本の1つです。

主語と述語は、どちらが何をしたのかがわかるように対応させます。1文の途中で主語を変えると、何について書いた文なのかがわかりにくくなります。回答で誤字脱字や助詞の誤りを指摘された相談は3件、主語と述語などの文の組み立てを指摘された相談は1件でした。

読み直すときは、以下の順に進めます。

1. プレビューの画面で、記事を頭から1文ずつ読む
2. 主語が抜けた文や、途中で主語が変わる文に印を付ける
3. 誤字脱字と助詞の誤りを直す
4. ほかの人に読んでもらえるなら、読みにくい所を挙げてもらう

書いた本人だけで読まず、人に読んでもらうよう勧めた回答も1件ありました。

手順3 箇条書き・表・画像で並ぶ情報を見せる

文章を整えたら、並べて読ませたい情報を箇条書き・表・画像に分けます。回答で手順3に当たる指摘があった相談は12件でした。読みやすさを聞いた62件では、表・箇条書き・画像の操作や表示の相談が17件と、最も多くありました。箇条書き・表・画像を使うときに行うことは、以下の3つです。

• 3つ以上並べる情報は箇条書きにする
• 項目ごとに比べる情報は表にまとめる
• 画像は文だけで伝わりにくい所に入れる

3つ以上並べる情報は箇条書きにする

1文の中に3つ以上の情報を並べたくなったら、箇条書きに分けます。並ぶ情報が3つ以上のときに箇条書きを使う書き方は「公用文作成の考え方」にも書かれている目安です。

WordPress のブロックエディターで箇条書きを作るときは「リスト」のブロックを使います。順番に意味のない並びは「順序なしリスト」、手順のように順番のある並びは「順序付きリスト」にします。箇条書きを作る手順は、以下のとおりです。

1. ブロックインサーター(+ のボタン)から「リスト」を選ぶ
2. ブロックのツールバーで「順序なしリスト」か「順序付きリスト」を選ぶ
3. 項目の下に細かい項目を入れるときは「リスト項目をインデント」を押す

箇条書きの中身にも、回答で指摘がありました。すでにある箇条書きの中身を整えるよう指摘された相談は2件で、重なる項目をまとめる指摘もありました。項目は短い言葉にして、中身が重なる項目は1つにまとめます。

ブロックの追加や並べ替えなど、編集画面の基本の操作は、別の記事でまとめています。

» ワードプレスの使い方｜ログインから公開までの6つの手順と相談246件のつまずき

項目ごとに比べる情報は表にまとめる

料金や条件など、いくつかの項目で比べる情報は表にまとめます。WordPress の「テーブル」のブロックは、表の形のデータを見せるためのブロックです。ページのレイアウトを組むためには使いません。

表を作るときは、以下の順に進めます。

1. ブロックインサーターから「テーブル」を選び、列と行の数を決める
2. 1行目に項目の名前を入れ、ブロックの設定で「ヘッダーセクション」をオンにする
3. 列の幅を中身に合わせたいときは「表のセル幅を固定」をオフにする
4. 「キャプションを追加」で、何の表かを表の近くに書く

「表のセル幅を固定」は、WordPress 6.6 から初めからオンの設定です。オンのままだと、すべての列が同じ幅になります。読みやすさを聞いた相談にも、表の列の幅がそろいすぎて横に長くなるとの相談がありました。

画像は文だけで伝わりにくい所に入れる

画像は、文だけでは伝わりにくい手順や画面の説明に入れます。回答で画像や図解を入れるよう勧めた相談は6件、画像が多すぎる・意味のない画像を減らすよう指摘した相談は5件ありました。

見出しの下に画像を置くかを聞いた相談には、意味のない画像を並べると見にくくなるとの回答がありました。意味のある画像は役に立つ、とも回答されています。画像の大きさや置く位置を記事の中でそろえるよう勧められた相談も、2件あります。画像を入れる前に確かめることは、以下のとおりです。

• 画像がなくても文だけで伝わる内容ではないか
• 画像の近くに、何の画像かを書いた文があるか
• 同じ記事の中で、画像の大きさと置く位置がそろっているか

手順4 スマホで見て崩れる所を直す

文と見せ方を直した記事は、公開する前にスマホの幅で表示して確かめます。Google の検索は、スマホで表示したときのページの内容を元に、インデックスへの登録と順位付けを行います。読みやすさを聞いた62件では、スマホでの見え方に当たる指摘があった相談が9件ありました。スマホで見て直すときに行うことは、以下の3つです。

• WordPress のプレビューでモバイルの幅を見る
• パソコンの Chrome でスマホの画面を再現する
• スマホで崩れる表・空白・広告を直す

WordPress のプレビューでモバイルの幅を見る

WordPress のブロックエディターでは、編集画面のままスマホの幅で記事を表示できます。WordPress 7.1 では、上のツールバーの「表示」のボタンから「デスクトップ」「タブレット」「モバイル」の幅を選びます。プレビューでスマホの幅を見る手順は、以下のとおりです。

1. 記事の編集画面で、上のツールバーの「表示」を押す
2. 「モバイル」を選び、編集画面の幅をスマホの幅にする
3. 1文ごとの改行・文字の塊・表のはみ出しがないかを、上から読んで見る
4. 「新しいタブでプレビュー」を選び、公開したときの見た目でも確かめる

「タブレット」か「モバイル」を選んだ後は、編集画面の横のつまみを動かして幅を変えられます。決まった3つの幅の間の幅でも、記事の見え方を確かめられます。

パソコンの Chrome でスマホの画面を再現する

公開した記事は、パソコンの Chrome のデベロッパーツール(DevTools)でもスマホの幅で見られます。デベロッパーツールのデバイスモードは、スマホでの見え方をパソコンの上で近い形にまねる機能です。デバイスモードで見る手順は、以下のとおりです。

1. Chrome で公開した記事を開き、デベロッパーツールを開く
2. 上のアクションバーにある「デバイス ツールバーの切り替え」を押す
3. 「サイズ」のリストから機種を選ぶか、幅を数字で入れる
4. 記事を上から読み、崩れる所に印を付ける

デバイスモードは見え方をまねる機能で、スマホで実際にページを動かしているわけではありません。最後は手元のスマホで記事を開き、指で画面を送りながら読みます。

スマホで崩れる表・空白・広告を直す

スマホで見て崩れていたら、崩れ方ごとに直し方を選びます。回答では、スマホで表がはみ出す・文字が小さいと指摘された相談が6件、パソコンで整えた改行や空白がスマホで崩れると指摘された相談が4件ありました。スマホで崩れやすい所と確かめることは、以下の表のとおりです。

崩れ方	確かめること
列の多い表がつぶれる・横にはみ出す	列を減らせないか、表を2つに分けられないか
全角の空白で文字の位置をそろえた所がずれる	空白で位置を作らず、箇条書きや表で並べられないか
スマホでだけ装飾や表が出ない	高速表示の仕組みや最適化のプラグインの設定
最初の画面が広告で埋まる	記事の冒頭に置いた広告の数と位置

回答では、列の多い表を横にスクロールさせる方法や、AMP などの高速表示の仕組みを切る設定が示されていました。スマホのページにも、パソコンのページと同じ本文を載せるのが基本です。ページの上の広告がスマホの画面の大半を占めると、読む人の使い心地が下がります。

記事の冒頭に広告やリンクを詰め込まない書き方は、リード文の記事で解説しています。

» リード文の書き方4つの手順｜ブログ相談29件でわかった直す所と例文

手順5 装飾は使う所を決めて使いすぎない

最後に、太字・マーカー・囲み枠などの装飾を見直します。回答で装飾について指摘された相談は7件で、うち6件は装飾が多すぎてどこが大事かわからない、との指摘でした。装飾を見直すときに行うことは、以下の3つです。

• 装飾の役割を決めて記事の中でそろえる
• 色だけで大事な所を伝えない
• 装飾が出ない・崩れるときはテーマと高速表示の設定を見る

装飾の役割を決めて記事の中でそろえる

装飾は、どの装飾を何に使うかを先に決めてから付けます。役割を決めずに付けると、太字やマーカーが増えて、読者はどこが大事かを見分けにくくなります。

回答では、太字の多さや囲み枠の多さが指摘されていました。内部リンクの文字を太字にすべきかを聞いた相談には、何でも太字にせず、目立たせたい所だけに付けるよう回答されています。強調したい所を枠で囲むときも、囲むものが多くならないようにします。装飾の役割を決めた例は、以下の表のとおりです。

装飾	使う所の例
太字	見出しのすぐ下に置く結論の1文
マーカー	読み落とすと困る数字や条件
囲み枠	本文と分けて読ませたい注意や補足

WordPress のブロックエディターでは、文字を選んで Ctrl + B(Mac は ⌘ + B)を押すと太字になります。色を付けるときは、ブロックのツールバーで縦に3つの点が並ぶボタンの左にあるメニューから「ハイライト」を選びます。

装飾や読みやすさを聞いた相談には、見た目より先に記事の中身を直すよう勧めた回答が3件ありました。文と段落を直してから、装飾を付け足します。

色だけで大事な所を伝えない

大事な所は色だけで示さず、太字や言葉でも示します。色の違いが見分けにくい人や、白黒で表示・印刷する人には、色だけの区別が伝わらないためです。

ウェブのアクセシビリティの国際的な基準(WCAG 2.2)は、色を情報を伝える唯一の手段にしないよう求めています。文字と背景の色の差(コントラスト比)は4.5:1以上、大きな文字は3:1以上が基準です。文字や背景の色を決めるときに確かめることは、以下のとおりです。

• 赤字やマーカーの色だけで、大事な所を示していないか
• 薄い色の背景に薄い色の文字を重ねていないか
• 記事の中で使う色の数が多すぎないか

装飾が出ない・崩れるときはテーマと高速表示の設定を見る

装飾が思ったとおりに出ないときは、書き方ではなくテーマやプラグインの設定を確かめます。読みやすさを聞いた62件のうち、装飾の操作や表示の不具合の相談は13件でした。13件のうち12件では、回答が操作の手順か不具合の原因を答えています。

回答で示されていた原因には、SNS から開いたときに使われる高速表示の仕組み(AMP など)や、囲み枠を消したときの閉じタグの抜けがありました。テーマの文字色の設定が白になっていて、本文の文字が見えなくなっていた相談もあります。装飾が出ないときは、以下の順に確かめます。

1. 編集画面と「新しいタブでプレビュー」の両方で、装飾が出ているかを比べる
2. スマホでだけ出ないときは、高速表示の仕組みや最適化のプラグインを止めて見る
3. 囲み枠を消した後に崩れたときは、ブロックの「HTML として編集」でタグの抜けを見る
4. 直らなければ、テーマやプラグインの提供元に問い合わせる

ブログの読みやすい書き方は1文と段落から直してスマホで確かめましょう

書いたブログ記事を読みやすく直す手順は、以下の5つです。

1. 1文と段落の長さを直す
2. 言葉と表記をそろえる
3. 箇条書き・表・画像で並ぶ情報を見せる
4. スマホで見て崩れる所を直す
5. 装飾は使う所を決めて使いすぎない

ブログ相談ドットコムの相談で記事を見てほしい18件のうち11件は、改行や句読点など1文と段落の指摘を受けていました。読みやすさを聞いた62件のうち41件は、表や装飾の操作と表示の不具合です。文を先に直し、スマホの幅で崩れる所と装飾を確かめる順にすると、手順ごとに直す所を絞り込めます。

まずは公開している記事の編集画面を開き、上のツールバーの「表示」から「モバイル」を選んで、1文ごとの改行がないかを読みましょう。