Norifumi Nakazono's Blog.

【コピペでOK】3分で「ブログの行間を変更」する方法【超簡単】

WORDPRESS

こんにちは、ゾノです。

この記事を書いている僕は、現役でWebデザイナー&マーケターとして活動しつつ、ブログを運営しながら生活しています。今では、外出せずに学べるパソコン教室を運営し、ブログ初心者に特化したブログ指導活動にも取り組んでいます。

先日、下記のツイートをしました。

✅質問:ブログの行間を広めたい
✅悩み:どのサイトを見ても、解決できない
という質問があったのですが、多分どのブログにも答えは書いてあるはず。でも多くの人が解決できない理由は「シンプルじゃないから」だけかもですね
ということで、行間の広め方を解説することにしました

本記事の内容

文字情報にストレスを感じる人は、動画でどうぞ

【コピペでOK】3分で「ブログの行間を変更」する方法【超簡単】

【コピペでOK】3分で「ブログの行間を変更」する方法【超簡単】
ブログの行間隔を一瞬で変える方法を簡単に書きます。
手順は下記のとおりです。

  • 文字サイズ、色、段落の余白、行の高さを決める
    (自動変換ツールを使ってもOK)
  • CSSの1番下に貼り付ける

以上です。

文字サイズ、色、段落の余白、行の高さを決める(自動変換ツールを使ってもOK)

  • line-height → 行の高さ
  • margin → 段落間の余白
  • font-size → 文字の大きさ
  • color → 文字の色

CSSをよく理解していない人は、下記のツールを使ってもオッケイです。
でも最終的には理解したほうがいいと思います。
» [CSS] テキストの文字サイズ・行間確認用

CSSの1番下に貼り付ける

とりあえず、下記のソースコードをCSSの1番下に貼り付ければオッケイです。

下記の、200%をいい感じの間隔になるまで、変更してみてください。

更新:コピペしても変わらない場合

200% → 600%とか、大きい数字に置き換えてやってみてください。

コピペ用ソース

p{
	line-height:200%;
}

これで完了です。

ブログの行間が狭すぎると、読者にストレスを与えます【要改善】

ブログの行間が狭すぎると、読者にストレスを与えます【要改善】
ブログの行間が狭すぎると、言うまでもなく読者にストレスを与えます。

ブログは、教科書 or 辞典ではありません

ブログの行間を詰めて書くスタイルもあるので、完全否定ではないのですが、個人的意見を述べると、行間は広めにとってあげることがおすすめです。

なぜなら、ブログは教科書や辞典ではないからです。
読者が眉間にシワを寄せならが読むブログが好まれるわけがありません。

質問:どっちが見やすいですか?

質問:どっちが見やすいですか?
質問:どっちが見やすいですか?

回答:たぶん、下のはずです

読者にストレスを与えない文章を書くコツ

このコツについては、下記記事でガッチリと解説しているので、詳しく学びたい人は読んでみると参考になると思います。

概要だけ知りたい人は、このポイントだけを把握しておけばオッケイです。

  • 結論から先に述べる
  • 一文を長くせず、改行を多めにする
  • 頻繁に箇条書きを使う
  • 漢字を多く使わずに「、」を多めに使う
  • 毎日ブログを書く

理想の一文の文字数:40〜50文字

【ワンポイント】CSSは上から順番に読み込まれます【アドバイス】

【ワンポイント】CSSは上から順番に読み込まれます【アドバイス】
本記事で、もっとも大事なポイントはCSSについての基礎を知ることです。

大事なことは、下記のとおりです。

  • CSSは下に書いたものが、優先して反映される
  • Macの人は、「Safariで検証」してみればOK

CSSは下に書いたものが、優先して反映される

CSSは、下に記述した内容が優先してWeb上に反映されます。

例えば、こういうことです

p{
	font-size: 16px;
	color:#333333;
	font-weight: bold;
}

p{
	font-size:18px;
	font-weight: bold;
}

上記の場合、フォントサイズは「18px」になるということです。

CSSが反映されない、、、と困っている場合は、大体こういう部分に理由があるので、落ち着いて対処しましょう。

Macの人は、「Safariで検証」してみればOK

ブログ運営をして、いろんなコンテンツを作っている場合にはMacを推奨しています。
たとえば、Safariでこんなことができるからです。

動画解説

僕がMacをおすすめする理由に関しては、下記の記事にて解説しておりますので、パソコンを変えようかなと思っている人は、ぜひ参考にしてみてください。

見やすいブログを、常に追求しよう

ブログの行間などを意識して、常に見やすいブログ運営を意識しましょう。

質問:ブログを書いて、読み返していますか

自分で書いたブログを、何度も何度も読み返していますか。

ちなみに、僕は何度も読み返します。
今日も良いブログを生産したなぁ、、、とビールを飲みつつ、夜を過ごします。

ぶっちゃけ、これくらいブログに愛着がないと、キビシイのかも、、、と最近思うので、みんなもまずは自分のブログのファン第1号になるべきですよ。

ブログに反応がないから辞めたい、、、なんて言葉も聞きますが、シンプルに反応する価値がないブログだから反応がないだけです。

ちょっとキツい発言をしましたが、未来をためを思って発言した愛のムチです。

ともに頑張りましょう、ブログライフ😌

相談やお問い合わせ、ご依頼など

お気軽にメッセージください。
» お問い合わせ

Webマーケティング基礎知識の学習用に、「【入門ガイド】経験ゼロ→お金を生み出すブログを開始する完全マップ」をまとめました。

【入門ガイド】経験ゼロ→お金を生み出すブログを開始する完全マップ

ブログを使ったWeb集客の基本を学習したい方向け。本記事は初心者がブログを開設するために必要な基礎をまとめました。情報が変われば常にアップデートしていきます。これからWebマーケティングをを学びたい人や現在学習中の人は是非ご覧ください。

» 詳細を読む

当ブログと他のサイトの圧倒的な違いは様々な疑問や悩みを解決するために【無料体験レッスン】30分相談会(オンライン開催)に初回限定で参加できることです。

どうしても分からなかったり、1人で悩むことがあればご相談ください。
また質問やメッセージ、相談があればお気軽にお問い合わせください(*´∀`*)
» お問い合わせ

人気記事ブログコンセプトが決まらないから困っていた時期の話【初心者時代】

人気記事【ブログ書くことない】ブログ書き方テンプレートで解決【ひな形】