1. ホーム
  2. css

text-align: justify;」の使用は避けた方が良いですか?

2023-11-12 12:45:06

質問

を使用しない理由はありますか? text-align: justify; ?

可読性を下げたり、問題を起こしたりしませんか?

どのように解決するのですか?

まず、これは純粋にデザインに関連した問題と解決策です。グリッドのデザインは、正当化テキストが必要であるかどうかを指定します。私は、justify align だけではユーザビリティに大きな影響を与えないと思います。テキストを判読できなくするような悪いタイポグラフィがユーザビリティを低下させるのです。とはいえ、しっかりとしたコントラストと、バランスの良いスペーシングのタイポグラフィを心がけましょう。フォントサイズも重要です。

このサイト は、オンラインでテキストを正当化することに成功した試みです。CSSでは、InDesignほど文字や単語の間のスペースを制御できないため、テキストの正当化を行い、単語間のスペースが行間のスペースを上回ったときに発生する空白の「川」を行に流さないようにすることは、かなり難しくなっています。テキストの正当化を難しくするもの:長い単語、十分な単語を保持できない行の幅、テキストと背景色の間のコントラストが高すぎると、川がより広く、より明白に見えます。

タイポグラフィの理想は、目を凝らすと一様にベタ塗りになるような、均一なテキストブロックであることです。したがって、テキストを約 10px に保ち、白地に 60% のグレーで、20 語程度に収まる行がある場合、justify align は醜く見えることはないはずです。しかし、これはユーザビリティを向上させるものではないことに留意してください。小さくて比較的軽いテキストは、多くの人、特に年配の読者を困らせます。

注意すべきは ­ (ソフトハイフン) を使って superawesome のような長い面倒な単語を正しく区切ることで、適切なタイプセット (例: InDesign) を模倣することができます。これを行うのに役立つものがたくさんあります。テキストを隠したり、操作したり、表示したりするロジックは、クライアント側で行うことをお勧めします。 この .

Edit : 以下、他の方の言及の通りです。 cssハイフン は、実現不可能であることを除けば、現在可能です(Chromeでは不可)。さらに css4 ではさらに多くの制御が可能で .