同じスペースを共有するアセンダーとディセンダーをどのように処理する必要がありますか?


16

これは、クライアントのコミュニケーションアプリの最初の登録ページです。(私はロゴを覆いました-白い箱に注意してください-彼のプライバシーのために)

「y」が下降し、「h」が同じスペースに上昇するのは好きではありません。2本の線が少しtoo屈になります。助言がありますか?

(アプリのフォントはrobotoです。ここでは、Roboto Boldを使用しています。)

http://d.pr/i/g08p http://d.pr/i/ouTE

他のデザインコメントは歓迎します-あなたが自分で振る舞う限り:)


1
私はそれを気にしません。おそらく、最初の2行の間の行間隔を狭くして、視覚的に一貫性を高めることができます。とは言うものの、そのタイプはフォームフィールドでは本当に大きいようです。
DA01

小さなキャップを試してみてください?
ローレン-レインステート-モニカ-イプサム

@ DA01-「フォームフィールドのタイプは本当に大きいようです」-「電話番号を入力してください」またはボックスに入力した電話番号を参照していますか?「Enter your ...」については、矢印やその他の視覚的な決まり文句を使用して、大胆でエッジの効いた何かが欲しかったのですが…。
user12985


「電話を入力してください」というテキストについて言及していました。私はそれがエッジの効いたものであると思うが、それはフィールドの単なるラベルでもあるので、とても奇妙であるように思える。それは私に叫んでいます。
DA01

回答:


15

そのため、通常、いくつかのオプションがあります。

現時点では、1行目と2行目は2行目と3行目よりも遠く離れているように見えます。これは、最初の2つの間にディセンダーとアセンダーがないことによって作成された錯視ですが、2番目の2つにはありません。

ソリューションは2つの基本的なカテゴリに分類されます。この状況をすべて回避するか、正面から取り組むことです。それを回避するいくつかの方法から始めましょう。

オプション1:大文字に変換

これは状況を回避します。ただし、おそらく小文字に接続されています。

(これらの例では、Robotoがインストールされていないため、フランクリンゴシックを使用しています)。

オプション2:改行の再配置

この場合、2行に変換しましたが、他の方法で改行を再配置することもできます。

問題を回避するもう1つの方法は、2行しかないことです-比較するものは何もありません。

オプション3:「視覚的に正しい」ようになるまで間隔を手動で調整する

ここでは、1行目と2行目のギャップを大幅に削減し、「より均等」に見えるようにしました。このために式を使用することはできません。目だけです。

実際には、この例の1行目と2行目の行間は2行目と3行目の行間よりもはるかに小さくなっていますが、2行目のアセンダーとディセンダーによって作成された錯視のために見た目はそれほど悪くありません。

この簡単な例をさらに改善することができます。これを行うときは、後ろから見たり、目を細めたりしてみてください。そうすれば、言葉ではなく文字の形がまるで塊のように見えます。

ボーナスオプション:アセンダーとディセンダーが重ならないように単語をシフトします

選択した単語にはこのオプションがないように見えますが、別の単語の例のように、子孫とアセンダが重ならないように単語を左右にシフトできる場合があります。

ちなみに、ハッシュ記号#の使用は正しく見えないため、NoまたはN oを選択した方が良いと思いますが、それは私の個人的な意見です。


Enter(Circle / Logo)それからYour Phone Numberが好きです。別のオプションは、あまり多くを述べないことです。つまり、フォームフィールドから、電話番号を期待していることはかなり明白です。
ライアン

6

タイポグラフィでは、先頭を変更すると、視聴者が作品を読んで解釈する方法に影響を与える可能性があります。

たとえば、2行間の行送りの量を減らして、ディセンダーとアセンダーを衝突させると、テキストの全体的な読みやすさに悪影響を及ぼします。

視覚的なスタイルとして、タイトのペースを上げることができ有数の読者ことを、読者はあなたの全体的な作品におよび/または窮屈または閉所恐怖症の感触のinvoke(彼らの目をキャッチ文字の増加)、テキスト(1) 、これはないかもしれませんここであなたの希望する効果になります。

一方、リーディングを増やすと、リーダーのペースが遅くなる可能性があります(2)。各行の間隔を広げることで、目を引く文字の量を減らすことで読者のペースを遅くします。これにより、読者はリラックスしたテキスト感覚を感じることができます。ただし、余白の量に注意してください。リーダーの目が各行の間をさらに移動する必要があるため、先行が多すぎると原因の連続性に問題が生じる可能性があります(3)

ダットフォックス

テキストの読みやすさを改善する最善の方法は、次のような一貫したリーディングで何かをすることです。

オーバーレイを使用したモックアップ

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.