行間とは？

文章の行と行の間の空き。

Line Spacing

文章の行と行の間の空き。

まず、短く答えると

行間の意味

詰まりすぎると読みにくく、空きすぎると文章のつながりを追いにくくなります。CSSのline-heightは一行の高さを指定し、その結果として行間を調整します。

Webサイトやアプリの見た目、情報の並び方、利用者の操作を考える場面で登場します。

見た目の好みだけでなく、迷わず使えるか、スマートフォンでも読みやすいかという視点で確認します。

長い説明文を読みやすくするため、本文のline-heightを1.7にして確認します。

覚え方のコツ

役割

文章の行と行の間の空き。

理解の深さ

まずは「何をするものか」と具体例を結び付けて覚えれば十分です。

確認の視点

見た目の好みだけでなく、迷わず使えるか、スマートフォンでも読みやすいかという視点で確認します。

混同しないために

「行間」は文章の行と行の間の空きものです。一方、「タイポグラフィ」は文字を読みやすく美しく見せる設計ものです。役割を分けて考えると、二つのつながりを理解しやすくなります。

きれいに見えることだけを目的にせず、読みやすさ、操作のしやすさ、さまざまな利用環境を一緒に考えることが大切です。

よくある疑問

A文章の行と行の間の空き。

A「タイポグラフィ」、「Webフォント」、「CSS」と一緒に覚えると、役割や使われる場面の違いが分かりやすくなります。

AIに相談してみる

［　］の部分を自分の状況に合わせて書き換えてください。

以下の文章表示を、書体・文字サイズ・一行の長さと合わせて確認し、読みやすい行間を提案してください。本文と見出しを分け、文字を拡大した場合も考慮してください。 変更理由も短く示し、情報が足りない場合は先に質問してください。

表示する文章・書体・HTML・CSS：
［ここに貼り付け］

秘密情報は入力しないでください

ほかの言葉も調べてみませんか？