Warning: Constant MULTISITE already defined in /home/pbmalartu/public_html/wp-config.php on line 107

Warning: Constant SUBDOMAIN_INSTALL already defined in /home/pbmalartu/public_html/wp-config.php on line 108

Warning: Constant DOMAIN_CURRENT_SITE already defined in /home/pbmalartu/public_html/wp-config.php on line 109

Warning: Constant PATH_CURRENT_SITE already defined in /home/pbmalartu/public_html/wp-config.php on line 110

Warning: Constant SITE_ID_CURRENT_SITE already defined in /home/pbmalartu/public_html/wp-config.php on line 111

Warning: Constant BLOG_ID_CURRENT_SITE already defined in /home/pbmalartu/public_html/wp-config.php on line 112

Warning: The magic method Pressbooks\Book::__wakeup() must have public visibility in /home/pbmalartu/public_html/wp-content/plugins/pressbooks/inc/class-book.php on line 62
Font Size – Accessibility Toolkit – 2nd Edition ="http://www.w3.org/2000/svg" viewBox="0 0 512 512">

Best Practices

Font Size

In this section, we review the two main concerns regarding font size on the web.

What is font size?

Font size is the size of text visible on the screen.

Who are you doing this for?

This work supports students who:

  • Are blind or have low vision, like Diana
  • Have a form of cognitive disability
  • Are deaf or hard of hearing
  • Have a physical disability
Diana has poor vision and needs enlarged text or uses text-to-speech software.

 What do you need to do?

There are two main concerns when working with font sizes:

  1. Ensuring that default font sizes are not too small
  2. Ensuring that text can be expanded to 200% on websites.[1]

Keep in mind these recommendations and guidelines:

  • 12 point for body text. For most documents, body text should be around 12 points. Small fonts may be illegible for some audiences.
  •  9 point for footnotes. If a document contains footnotes or endnotes, the minimum size should be 9 points.
  • 200% zoom. The Web Content Accessibility Guidelines (WCAG 2.0) recommend ensuring that text can be zoomed to 200%. As well, we recommend using liquid layouts[2] that can accommodate 200% text.

Attributions

Diana: Original artwork by Hilda Anggraeni (BCcampus)


  1. "Font Size on the Web," Accessibility and Usability at Penn State, accessed April 17, 2018, http://accessibility.psu.edu/fontsizehtml/.
  2. Liquid layout are layouts that are based on percentages of the current browser window's size. They flex with the size of the window, even if the current viewer changes their browser size as they're viewing the site. Liquid width layouts allow a very efficient use of the space provided by any given web browser window or screen resolution.

License

Icon for the Creative Commons Attribution 4.0 International License

Accessibility Toolkit - 2nd Edition by BCcampus is licensed under a Creative Commons Attribution 4.0 International License, except where otherwise noted.

Share This Book

css.php