Warrington Web Design logo
How To Improve Website Typography In Under 30 Minutes

How To Improve Website Typography In Under 30 Minutes

In essence, typography is an art and technique to accentuate website content and is essential for user experience. It is an important aspect that builds website quality and increases brand development. 

You can engage content by changing the fonts, size-specific spacing, contrast, and various other techniques. As an art and design of arranging type, it can be tedious and time-consuming. 

However, there are simple typography changes you can make. At Warrington Web Design, we understand how important it is to get your typography right in order to generate leads and conversions on your website. We have come up with the following tips and tricks you can do in order to improve your website’s typography:

Check the text colour

The fundamental features of typography are legibility, readability, and aesthetics. A user can experience a good or upsetting read depending on the text layout, tone, size, and colour of the set text. 

It is essential to avoid too bright colour contrast. Black on yellow/cream or white on the blue text appears to be aesthetically compelling. Make sure to use complementary colours to be pleasing to the eye. As designers focus predominantly on shapes and designs, they may miss out on the text colour contrast. However, the combination of the text colour contrast can make a big difference to your website’s typography. 

The use of large typography or larger text design style gives a great site. You can also add brilliant, high-quality photos to win at creating an excellent website typography. 

Use a larger text size

The more you emphasise a larger text, the better. It provides the advantage of having a fair visual hierarchy. For example, it is difficult to differentiate the letters “b” and “h,” or “5” and “s” in small texts. Thus, shorter texts make it challenging to read and give a legibility problem. The readers should meet WCAG AA standards on a desktop and WCAG AAA on the mobile. 


Optimise your website content with more extensive text. Use bigger typefaces to obtain and attract user preference. You can also design your typography by adding emojis, icons, and effects, etc.

Choose the right fonts.

Typographers who give importance to fonts know that they make the site look attractive. You can choose from many fonts but keep these certain features in mind: readability, compatibility, and creativity. 

Use system fonts to style HTML inputs that explain the brand data in the brand fonts and user’s data in the user’s fonts. In doing so, you will improve the website UX and allow users to feel confident, trust, and own their data. 

Emphasise website typography designs by including buttons, navigation systems, and web menus. In doing so, it will look apt and functional. 

Apply and adjust the spacing

Titles or headings tend to have more whitespace than running text. Applying kerning to the header corrects the off-putting space giving a more engaging look. 

It is imperative to keep the space between two characters consistent with any other pair’s spacing using the same font. The consistency in the characters and word shapes appears aesthetically readable and legible. 

Inconsistency between the characters concerns the true meaning of typography. However, adding a tad bit of space between serial numbers and tracking codes would not affect the readable flow. 

Use an appropriate texture and style. 

Improving website typography depends a lot on texture and style, such as bold and italic typefaces. Using appropriate typefaces helps to differentiate content properly and grab user attention. Nonetheless, it can be a boon and a bane to your content site. Both types may be of the same fonts, but the difference in shapes in many characters affects the set text’s flow. 

Improper use of bold and italic typefaces irritates users and interrupts visual variations. Therefore, sticking to other ways of impact, such as colours and fonts, look more suitable if you cannot use bold and italics. 

Take advantage of the Hyphen.

By definition, the hyphen is a punctuation mark that joins words. And it indeed does a great job in making a connection between two words if used properly. It acts as a bridge between two separate words creating a profound meaning than the separated words. 

Let us look at an example: eye opener vs eye-opener. 

In the above example, the former words are two separate words. In the latter, the hyphen connects two particular words with different meanings. You can see a flow in the text and a satisfying visual experience. It may seem that the hyphen may be a small dash, but it is indeed an eye-opener. 

Use smart quotes

You can be sure to gain good site content using smart quotes. Using specific characters such as inverted commas, a hyphen, or en dash in proper places will give you an advantage. However, be sure to stir away from the straight quotes or “dumb quotes.” 

You can also find fonts with a glyph option different from the double quotes or left-single or right-single quotes. The uses of smart quotes accentuate your text and content. 

Manage paragraph length

The managing of paragraphs is an essential part of the typography technique. Paragraph measure is the favourable line length between texts to encourage readability. It may occur to be of the least importance, but it is just as important as using the right fonts, size, or colour. 

According to research, the preferable paragraph length can be between 45 and 90 characters per line. The space measures should not be too wide or too narrow to improve website typography. The broader the length and the users may lose track of reading. Likewise, a limited paragraph measure irks users and affects readability. 

A prevalent mistake that designers make is making long body text lines and filling the entire content. Increase the space between lines if you increase the font size of the body text. 

The paragraph should follow a vertical space heading and proper indent line to maintain attractive visuals and smooth text flow. 


People may focus on other designs to create good website content, but typography can give a desirable site. Choose the right fonts, size, and colour, and you will be looking at an attractive website. You can achieve splendid website typography in 30 minutes or less by using the mentioned lists of suggestions. 

Well-designed website typography not only boosts visual attraction but increases conversions and branding.



Latest Posts