DEV Community

loading...
Cover image for 4 Things you didn't know about text

4 Things you didn't know about text

vponamariov profile image Victor ・2 min read

Hi there! 👋

Text is an essential part of most interfaces. It doesn’t matter if it’s a landing page or a web application.

Here are four things you probably didn’t know about it.

Understanding them might help you to make your texts look nicer and more balanced.

Lest level up your UI skills 💪

Rags

A “rag” in typography is the uneven side of a paragraph where the text is aligned on the other side. So if the text is right-aligned, the rag is on the left side and vice-versa.

A poor rag creates distracting shapes in the white space of the margin.

Compare these two images.

Rags

The left text feels less balanced than the right. To fix rags, you can adjust the text width and hyphenations.

Rivers

Rivers are the white gaps that can appear in the text (especially justified ones) when there is too much space between words on consecutive text lines.

Usually, they appear when you justify your text. So you can easily fix it by aligning the text to the left side.

Rivers

Widows

A widow is a paragraph-ending line that falls at the beginning of the following page or column, separated from the rest of the text.

Widows

One of the possible solutions to avoid widows is to insert an early page break.

Orphans

Orphan is a paragraph-opening line that appears at the bottom of a page, separated from the rest of the text.

Orphans and widows are very similar to each other.

I found controversial definitions and mnemonic rules to remember who is who. One of the funniest was “Widows have a past but no future, while orphans have no past but a future.”

Orphans

But it doesn’t matter much what do you call them. It’d be better if you fix them. Same as for widows, page break can help.

Conclusion

These four problems described above make text un-balanced and look no that good as it could be.

I’m pretty sure it won’t matter that much if you have a widow or rivers in the text on your landing page.

BUT REMEMBER: Interface consists of many things. Everything can look good and bad. Everything can be convenient to work with and not that convenient.

When we see an interface, we experience certain emotions. And if you cared about most things, it’d be a pleasure for the user.

There is a special effect that describes this behavior:

“The aesthetic–usability effect describes a paradox that people perceive more aesthetic designs as much more intuitive than those considered to be less aesthetically pleasing.”

If you want to learn more, follow me on Twitter, I tweet a lot about UI/UX stuff :)

Discussion (2)

pic
Editor guide
Collapse
kostjapalovic profile image
Kostja

Interesting, never thought about a text that much.

Even though I noticed I am annoyed by these things without knowing it.

Thanks a lot!

Collapse
vponamariov profile image
Victor Author

Yeah, that feeling when everything looks okay but you still not satisfied with something and you don't understand what it is.