株式会社ユー・エス・エス/上田写真製版所 ブログ

■デザイン印刷百科

◆「泣き別れ」とは? 文字組の基本と紙・Webの違いを解説!

「泣き別れ」とは? 文字組の基本と紙・Webの違いを解説!
「泣き別れ」とは? 文字組の基本と紙・Webの違いを解説!


みなさん、こんにちは。
東京護国寺の文字校正が得意なデザイン会社、株式会社ユー・エス・エスです。

デザインや編集に関わる仕事を始めると、さまざまな専門用語に出会いますよね。今回は、その中でも「泣き別れ」という文字組に関する重要なポイントを解説します。

「泣き別れ」と聞くと、何か悲しい出来事を想像するかもしれませんが、実は 文字組(文字の並べ方や配置)のルール に関する用語です。特に紙媒体やWebのデザインでは「読みやすさ」を左右する重要なポイントになります。

本記事では、

  • 「泣き別れ」とは何か?
  • 紙媒体とWebでの違い
  • 「泣き別れ」を避けるための工夫
    を具体例を交えながらわかりやすく解説していきます!

1. 「泣き別れ」って何?

「泣き別れ」とは、行の最後で単語が途中で切れてしまうこと を指します。
特に 英単語や数字が途中で切れると、意味が伝わりにくくなったり、読みにくくなったりする ことがあります。

例えば、次の文章を見てみましょう。

泣き別れが起きているケース

→「Relationship」の途中で改行されてしまっています。

泣き別れを回避したケース

→「Relationship」が途中で切れず、自然に読めます。

このように、単語が不自然に分かれてしまうと読みづらくなる ため、デザインやレイアウトを考える際には 「泣き別れ」を防ぐ工夫 が必要になります。

2. なぜ「泣き別れ」が起きるのか?

① 自動改行(折り返し)が原因

文字は限られたスペースに収めるため、自動的に改行されることがあります。特に、長い単語や記号を含むテキストが狭いスペースに配置されると、不自然な位置で途中分断されることがあり、これが「泣き別れ」の原因になります。

具体的な例を見てみましょう。

【紙媒体の場合】

紙面のレイアウトによっては、URLやメールアドレスなどの長い英単語が途中で改行されることがあります。特に、狭いカラムや均等割り付けのデザインでは、単語が意図しない場所で分断され、読みづらくなることがあります。場合によっては、URLの一部が次の行に送られることで誤読や入力ミスを引き起こす可能性もあります。

【Webの場合】

Webでは、閲覧環境(画面サイズやフォント設定)によって自動改行の位置が変わります。そのため、同じ文章でもデバイスやウィンドウサイズによって「泣き別れ」が発生する場合と発生しない場合があります。特に、レスポンシブデザイン※のWebサイトでは、想定外の改行が生じることもあります。

※デバイスの画面サイズに応じてWebサイトの表示を最適化する手法。PCやスマートフォンなど様々な端末で自動的にレイアウトが調整される。

3. 紙媒体とWebでの「泣き別れ」の違い

「泣き別れ」は 紙とWebで発生する状況が異なる ため、それぞれに適した対策が必要です。

紙媒体Web
改行の仕組みレイアウトを固定画面サイズによって変化
調整方法文字間を調整・手動で改行位置を決定CSSなどで制御
対策の難易事前に決められるため調整しやすいユーザーの環境次第で変わるため対策が難しい

4. 「泣き別れ」を防ぐための具体的な工夫

① 文字間(字間)を調整する

紙媒体の場合は、文字間を少し詰めたり広げたりすることで、行末の単語が途中で切れないように調整 します。
もしくは、アプリケーションの設定を変更します。

【例】字間を調整して「泣き別れ」を回避

WordやAdobe InDesignは泣き別れはしません

WordやAdobe InDesignでは、デフォルトで「欧文泣き別れ」がオフになっています。通常使用で、泣き別れを意識せずとも自動的に調整されるので、泣き別れを知らない場合もあるかもしれません。

InDesignで泣き別れをさせる方法

そのため、あえて「欧文泣き別れ」を有効にしたい場合は、設定を変更する必要があります。
たとえば、Adobe InDesignでは、段落スタイルの設定を開き、「欧文泣き別れ」にチェックを入れます。
また、「欧文泣き別れ」箇所にハイフネーションを適用するには、「詳細文字形式」で「言語」を「英語」に変更します。

② 改行ルールを設定する(Web)

Webの場合は、CSSで 自動改行のルール を指定することで「泣き別れ」を防ぐことができます。

【例】CSSの設定

p {
  word-break: keep-all;
  line-height: 1.5;
}

この設定をすると、英単語が途中で切れず、見た目が整う ようになります。

5. まとめ:「泣き別れ」を防ぐことは読みやすさにつながる!

「泣き別れ」は デザインや編集をする上で、とても重要なポイント です。
特に 紙媒体とWebでは発生する条件が異なるため、それぞれに合った対策 をする必要があります。

✅ 今回のポイント

  • 「泣き別れ」とは 行末で単語が途中で切れてしまうこと
  • 読みやすさを考えると できるだけ避けるべき
  • 紙媒体では字間調整、WebではCSSを活用 する
  • 改行位置を意識するだけでも、文章の可読性が向上する

デザインや編集に携わる仕事をするなら、「泣き別れ」の考え方を押さえておくと、より 読みやすい文章やデザインが作れる ようになります!

今後、実際の業務で「泣き別れ」の問題に遭遇したら、ぜひ今回の内容を参考にしてみてくださいね。

pagetop