Fonts test

From SiteRay wiki

Jump to: navigation, search
SiteRay Test
First appeared:Sitescore 1.0
Applies to:All versions
Type:Individual test
Scored:Always

What does it do?

Tests the use of fonts on this website.

Why is it important?

This test ensures that fonts are suitable for the web (i.e. that most people can see them consistently), that they are flexible in size (highly recommended for accessibility) and that links vary in appearance when hovered over or selected (best usability/accessibility practice).

Example results

How is it measured?

The test looks at the use of styles in the site and calculates how much of each page uses each font and size. It also looks at how different types of link differentiate themselves on each page.

Fonts which may cause problems are highlighted (it is not usually a problem, as long as alternative fonts are specified). Where no alternative is provided, a penalty is incurred. Font sizes are broken down into fixed and flexible sizes. Flexible sizes can be modified by the user (i.e. the visually impaired can enlarge the text), and are considered best practice for web design. Fixed font sizes are penalised. Particularly small font sizes are also detected and penalised.

Finally, the distinctiveness of any links is looked at. Ideally, links should be look distinct when they are:

  • Hovered over
  • Visited (i.e. you’ve been to this page before)
  • Active/Focused (i.e. you’ve selected using the keyword, not the mouse)

These are considered important accessibility and usability aids, and Sitescore will penalise sites that don't make full use of these features.

Note that sites which don't use CSS will receive the lowest score of 1 automatically (virtually no sites do this).

Technical explanation

Sitescore parses the complete CSS of each page, and virtually renders each page in order to determine the fonts, sizes and link styles used throughout. The parser supports CSS2. Fonts are only measured when they are applied, so styles which are not used are ignored.

Common problems

Some websites use font sizes of 0px or 1px (effectively invisible, or the size of a single pixel). Sitescore detects these as intentional layout hacks and does not penalise such regions as small text.

If your website does not use CSS at all, this test will be unable to give much useful feedback. The vast majority of websites now use CSS for at least some of their website.

The CSS parser may not parse CSS in exactly the same way as your selected browser (bear in mind that all browsers parse CSS differently, and Sitescore can best be thought of as another browser, more similar to Firefox than Internet Explorer). This is usually of no consequence to this test, unless your CSS is non-compliant or broken in some way. For example, some CSS authors use deliberately broken CSS to trick certain browsers into ignoring their code, whilst others will see it. In these instances, the behaviour of Sitescore is relatively unpredictable. It should be noted that such tricks are considered bad practice, as they may break in new or unknown browsers. In practice the effect on text is minimal.

How to improve this score

  • Ensure your website is using CSS (see the CSS usage test) and that the fonts you are using all have web friendly equivalents.
  • Wherever possible, use flexible font sizes, and check that your website is designed to handle them. Increasingly web browsers are forcing websites to use these, even if they’re turned off (e.g. Firefox). The result is if you don’t support them, your website make look horrendous with larger text, potentially becoming even unusable. Depending on your website design, and how tightly controlled your layout is, addressing this issue may require significant work, or a total redesign.
  • Making the three main link states distinct will improve the accessibility and usability of your website. In general this is very easy to do, and requires only modest changes to your stylesheet(s).

How to use this test effectively

This test can help tell you how well built a website is, and is particularly illuminating as most of these aspects are not obvious to non-web professionals. New websites should score very highly for this test, as long as they follow best web practices.

Further reading

See all SiteRay tests.
Personal tools