Yes, a picture says a thousand words. But sometimes, images alone won’t work.\nThis is why typography still proves to be a vital aspect of design despite the focus on more visual content. Remember that the need for visual content does not tell you to stop adding text to your designs – it simply reminds you to do so the most tasteful and stylish way possible.\nOf course, readability should not be sacrificed in the name of design. You can’t add text that people can barely understand, then argue that it’s a piece of art. Sending a message that cannot be deciphered defies the purpose of what you’re doing.\nSo how do you make your text more readable? Here are a few typography tips and tricks to keep in mind:\n
\nI heard someone tell me once that the reason they went into design was to avoid all the numbers involved in other fields. Guess what. Numbers will haunt you, even when you’re designing something.\nNo matter how keen your eyes are to the smallest details, it’s always better to be safe than sorry. Always put the measure in mind when putting text together. No, you don’t have to hunt for your ruler or tape measure. “Measure†is the term used to define the length of a line. If each line of text is longer than usual, readers will automatically have a hard time processing the message being sent across.\nGood measure is usually around 40 to 80 characters per line, including the spaces. If it’s just a single column, then 65 characters would be perfect.\nLooking for a formula you can use? Of course, there’s one. The Robert Bringhurst formula asks you to multiply the size of type by 30. Let’s say you’re using a 20-px type. Multiply it by 30, and your ideal measure would be 600px. With a font size of 20, you’ll still end up with just around 65 characters for a 600-px line.\n<\/p>
\nYou know those spaces between each line of text? That’s what you call leading. Leading<\/a><\/span> has such a huge impact in readability in the sense that some readers may not even attempt to read a block of text if the leading is all wrong.\nA lot of things work together to get the right leading. The type size, typeface, case, weight, and word spacing are just some of the many factors that affect the amount of space in between lines. Generally, setting the leading at 25% bigger than the type size would be most ideal. So let’s say you’re using a 12pt type size. The best leading would, be sized at around 15pt or 16pt.\n<\/p> \nJust because your left margin sets the leftmost boundary does not mean that everything has to be aligned with it. In the case of quotes, a lot of designers make the mistake of aligning the quotation mark with the left margin. When you do this, the text that comes after this quotation mark will therefore be moved to the right, making it seem like the margin is skewed. This disrupts the reader’s rhythm.\nWhen you use a hanging quote, you leave the quotation marks outside the margin. This leaves all text aligned with each other. Now, that definitely makes any block of text easier to read.\n<\/p> \nNope, we’re not talking about wives whose husbands have left this world or children whose parents have died. Widows are short lines or single words awkwardly left hanging at the end of a paragraph. Orphans are pretty much the same, but they are left at the top of a column.\nIt’s a good thing that it’s easy enough to get rid of these widows and orphans. You can try adjusting the type size, leading, word spacing, measure or letter spacing. You can also try squeezing in a manual line break. Try editing the text as well, but only if possible.\n<\/p> \nThere will always be a few key points that you want to emphasize over anything else. It could be a word that you’re trying to define, or a statement that you believe has the most importance in the entire paragraph. This can be done by putting the word, phrase or sentence in italics (the most common form of emphasis used). You may also try putting the words in bold, or by underlining them. Others put the point of emphasis in all caps. Some also highlight the words, or use different colored letters.\nAlthough emphasis is good, too much of it will disrupt the readability of your text. Choose one form of emphasis and stick to it. Putting the word you think is important in caps, in bold, in italics and underlined is overkill.\n<\/p> \nIn the same way that you have to italicize a few words within the body of the text to show emphasis<\/a><\/span>, you also have to show which groups of text take more importance over the others. This is done by using a scale of type sizes.\nEvidently, the title or main heading should be the biggest, followed by the subheading, with the body of the text appearing a little smaller than the previous. When you do this, not only does it make the entire text body look more organized, it also allows your readers to find exactly what they’re looking for and jump to the areas they need more than the others.\n<\/p> \nThe rags are the uneven side of the paragraph, often the right side. Sure, rags are an automatic thing if you align your text to the left. Using justified alignment will not cut it, because the uneven spaces between words makes it very hard to read. The important thing here is for you to make sure that the rags still look organized and clean despite the fact that they are not completely aligned.\nHow do you keep your rags clean? Make sure each line is not too long or short. Make sure those ends are as close to each other as possible. To do this, you may have to do some manual adjustments to your text block.\n<\/p> you use would highly affect the way your text is read. Black print over a white background is evidently very ideal, as this contrast is very easy on the eyes, making everything easier to read. But try pink text over a blue background, and you’ll have readers going dizzy just trying to make sense of everything you’ve written down.\nAlthough this is a standard rule, some designers still forget to think about contrast when laying out their designs. Some may be going after the brands’ colors too much. But at the end of the day, no matter how nicely your chosen contrasts are in general design, remember that they do not always work well in typography.\n<\/p><\/span>3. Use hanging quotes.<\/span><\/h2>
<\/span>4. Beware of widows and orphans.<\/span><\/h2>
<\/span>5. Give emphasis.<\/span><\/h2>
<\/span>6. Use scales to show hierarchy.<\/span><\/h2>
<\/span>7. Keep your rags clean.<\/span><\/h2>
<\/span>8. Easy on the contrast.<\/span><\/h2>The contrast of colors<\/a><\/span>
<\/span>9. Use white space to your advantage.<\/span><\/h2>