: How should ascenders and descenders that share the same space be handled? This is the initial registration page for my client's communication app. ( I covered over the logo - note the white

@LarsenBagley460

In typography changing the leading can affect how your viewers read and interpret your piece.

For an example, by lowering the amount of leading between two lines, causing descenders and ascenders to collide, you will have an adverse effect on the overall readability of your text.

As a visual style, tight leading can increase the pace of that the reader the readers your text (in the increase of letters that catch their eyes) and/or invoke a cramped or claustrophobia feel to your overall piece (1), which might not be your desired effect here.

On the other hand, increasing leading may reduce the pace of the reader (2). By introducing more space between each line, you slow the pace of reader by reducing the amount of letters that catch their eye. This can invoke a relaxed sense of feel in text by the reader. However, be careful of the amount of whitespace you leave, as having too much leading may problems with cause continuity (3), as the eyes of the reader need to travel further between each line.



Your best bet to improve the readability of your text would be to do something with consistent leading, like this:

Vote Up Vote Down

@Kristi927

So you have a few options, usually.

At the moment, your problem is that lines 1 and 2 look further apart than lines 2 and 3, even though they're not. It's an optical illusion created by the lack of descenders and ascenders between the first two, but not on the second two.

The solutions fall into two basic categories: avoiding this situation all together, or tackling it head-on. We'll start with some ways of avoiding it.

Option 1: convert to capitals



This one avoids the situation. However, you're probably attached to your lowercase.

(These examples use Franklin Gothic by the way because I don't have Roboto installed).

Option 2: re-arrange line breaks



In this case, I've converted to 2 lines, but you can sometimes re-arrange line breaks in other ways.

Having only two lines is another way of avoiding the problem - there is nothing to compare it against.

Option 3: adjust spacing manually until it looks "visually right"



Here I've greatly reduced the gap between line 1 and 2 so it looks "more even". You can't use a formula for this, just your eyes.

In reality the line gap between the first and second line in this example is much smaller than the line gap between the second and third, but it doesn't look too wrong because of the optical illusion created by the ascenders and descenders in the second one.

It's plausible you could improve on this quick example further - when doing this, try viewing from further back, squinting your eyes, etc, so you're not looking at the words but the letter shapes as if they're blobs.

Bonus option: shift words so the ascendors and descenders don't overlap



You don't appear to have this option with your chosen words, but sometimes you can shift words left or right so the descenders and ascendors don't overlap, as in this example with different words.

By the way, I think your use of the hash symbol # doesn't look right and you'd be better off opting for No. or No - but that's my personal opinion.

Vote Up Vote Down