Deb Dey — October 30, 2017 — October 30, 2017
As a web designer, your primary approach to website design is to get its key elements in place: the layout, color, graphics, and content must be in tandem to create an eye-catching website. All’s good until you start thinking from the viewer’s point of view. Suddenly, the colors look too garish, the layout a bit confusing, and the text a bit unreadable.
Hold it! Did I just imagine the nod on ‘the text, a bit unreadable’? I hope not because honestly, there is just so much scope for improvement where font styles and size is concerned.
Have you ever come across a website with great layout, graphics, and color, but tiny font? Or perhaps a website with too large a font? In both cases, how was the experience as a web user seeking specific information? If I have guessed right, you left the site without bothering to read much beyond the first few lines. If you did not, your web attention span is something to reckon with, and this article clearly isn’t for you. However, if your reaction to tiny/large fonts has confirmed my guess, then read on…
Pexels / Pixabay
Font is Serious Business!
Fonts can make or break a website. As clichéd as that sounds, it’s true because unreadable font can irritate viewers and discourage them from exploring your site even more than unattractive layouts. Web users don’t just sniff around for information; they want to hunt down websites, which will give them the specifics they are looking for. The options are many, consequently leading to limited user attention.
Simple explained…nobody has the time to sit around and decipher the text. It’s either there for everyone to read or not. Both tiny and large fonts can render text unreadable. While tiny text is too much strain on the eye, too large fonts make a site look amateurish. In both cases, users would rather be looking elsewhere.
Defining Font Size
Font sizes can be defined by virtue of being absolute and relative and their length and percentage. User-agents define if font sizes are absolute. The default size is usually x-medium with other familiar sizes being x-small to xx-large. A relative font size means its size in relation to a parent element that would either make it appear small, large or the exact size.
An absolute measurement such as a centimeter or inch defines font length, while an absolute font’s relativity to its parent element is how we define its percentage.
Font Accessibility
When you put up content on your site, it is primarily because you want visitors to read it, and basically just spend enough time on your site to take a positive action. Smaller font sizes work with young readers or exceptionally patient readers. Usually, a medium to large font works with most users.
Pixels, or EMs?
EMs offers good font accessibility. Your fonts become smaller or larger depending on individual user browsers. Use of EMs allows your fonts to assume a relative size depending on the parent element. Note however, while user accessibility is enhanced, your site may not always appear as you may want it to. Since EMs cause your website fonts to scale relative to their default size, your site’s appearance can almost become uncontrollable.
An alternative to EMs is using pixels for font size. Pixels provide standard font properties and hence leave little chance for your website’s appearance to become uncontrollable.
When you review your site one last time before making it live, just make sure you can read what’s on all the pages with ease. Ask the non-designers and/or the non-techs around you to read the website’s content. If they can read it without difficulty, so can your web users.
Digital & Social Articles on Business 2 Community
(84)
