Guide to Creating Dyslexia Friendly Content

Total Page:16

File Type:pdf, Size:1020Kb

Guide to Creating Dyslexia Friendly Content Guide to Creating Dyslexia Friendly Content Fonts, colors and text styling tips that will help make your web text easier to read for Dyslexic users Suitable fonts Sans serif fonts are most suitable to use because their letters are less crowded. Two of the best to use are Arial and Comic Sans, but Verdana, Tahoma, Century Gothic, Trebuchet, Calibri and Open Sans are also suitable alternatives. Font size should be at least 12-14 point as larger text is easier to read. Use bold for emphasis instead of italics and underlining as this can make text appear to run together. Suitable colors Use single color backgrounds for text and avoid distracting images and patterns. Avoid putting black text on white a background if possible as this can dazzle dyslexic readers. Consider using cream or off-white instead. Pastel colors such as peach, orange, yellow or blue are also suitable. Avoid green, red and pink backgrounds for text as these will be difficult for people EQUIPMENT & SUPPLIES with color deficiencies to read. Extra styling tips Text headings should be at least 20% larger than normal text to help make them more distinctive. For web text, ensure hyperlinked text looks different from normal text. Try to break up 'walls' of text with various formatting options, such as different text alignments, indents and lists (e.g. bullet pointing and numbering). Try to avoid multiple columns of text. Use shorter sentences and paragraphs. Information sourced from The British Dyslexia Association, The Dyslexia Association of Ireland and UX Movement.
Recommended publications
  • Supreme Court of the State of New York Appellate Division: Second Judicial Department
    Supreme Court of the State of New York Appellate Division: Second Judicial Department A GLOSSARY OF TERMS FOR FORMATTING COMPUTER-GENERATED BRIEFS, WITH EXAMPLES The rules concerning the formatting of briefs are contained in CPLR 5529 and in § 1250.8 of the Practice Rules of the Appellate Division. Those rules cover technical matters and therefore use certain technical terms which may be unfamiliar to attorneys and litigants. The following glossary is offered as an aid to the understanding of the rules. Typeface: A typeface is a complete set of characters of a particular and consistent design for the composition of text, and is also called a font. Typefaces often come in sets which usually include a bold and an italic version in addition to the basic design. Proportionally Spaced Typeface: Proportionally spaced type is designed so that the amount of horizontal space each letter occupies on a line of text is proportional to the design of each letter, the letter i, for example, being narrower than the letter w. More text of the same type size fits on a horizontal line of proportionally spaced type than a horizontal line of the same length of monospaced type. This sentence is set in Times New Roman, which is a proportionally spaced typeface. Monospaced Typeface: In a monospaced typeface, each letter occupies the same amount of space on a horizontal line of text. This sentence is set in Courier, which is a monospaced typeface. Point Size: A point is a unit of measurement used by printers equal to approximately 1/72 of an inch.
    [Show full text]
  • Cloud Fonts in Microsoft Office
    APRIL 2019 Guide to Cloud Fonts in Microsoft® Office 365® Cloud fonts are available to Office 365 subscribers on all platforms and devices. Documents that use cloud fonts will render correctly in Office 2019. Embed cloud fonts for use with older versions of Office. Reference article from Microsoft: Cloud fonts in Office DESIGN TO PRESENT Terberg Design, LLC Index MICROSOFT OFFICE CLOUD FONTS A B C D E Legend: Good choice for theme body fonts F G H I J Okay choice for theme body fonts Includes serif typefaces, K L M N O non-lining figures, and those missing italic and/or bold styles P R S T U Present with most older versions of Office, embedding not required V W Symbol fonts Language-specific fonts MICROSOFT OFFICE CLOUD FONTS Abadi NEW ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Abadi Extra Light ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Note: No italic or bold styles provided. Agency FB MICROSOFT OFFICE CLOUD FONTS ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Agency FB Bold ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Note: No italic style provided Algerian MICROSOFT OFFICE CLOUD FONTS ABCDEFGHIJKLMNOPQRSTUVWXYZ 01234567890 Note: Uppercase only. No other styles provided. Arial MICROSOFT OFFICE CLOUD FONTS ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Arial Italic ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Arial Bold ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 01234567890 Arial Bold Italic ABCDEFGHIJKLMNOPQRSTUVWXYZ
    [Show full text]
  • 15 the Effect of Font Type on Screen Readability by People with Dyslexia
    The Effect of Font Type on Screen Readability by People with Dyslexia LUZ RELLO and RICARDO BAEZA-YATES, Web Research Group, DTIC, Universitat Pompeu Fabra, Barcelona, Spain Around 10% of the people have dyslexia, a neurological disability that impairs a person’s ability to read and write. There is evidence that the presentation of the text has a significant effect on a text’s accessibility for people with dyslexia. However, to the best of our knowledge, there are no experiments that objectively 15 measure the impact of the typeface (font) on screen reading performance. In this article, we present the first experiment that uses eye-tracking to measure the effect of typeface on reading speed. Using a mixed between-within subject design, 97 subjects (48 with dyslexia) read 12 texts with 12 different fonts. Font types have an impact on readability for people with and without dyslexia. For the tested fonts, sans serif , monospaced, and roman font styles significantly improved the reading performance over serif , proportional, and italic fonts. On the basis of our results, we recommend a set of more accessible fonts for people with and without dyslexia. Categories and Subject Descriptors: H.5.2 [Information Interfaces and Presentation]: User Interfaces— Screen design, style guides; K.4.2 [Computers and Society]: Social Issues—Assistive technologies for per- sons with disabilities General Terms: Design, Experimentation, Human Factors Additional Key Words and Phrases: Dyslexia, learning disability, best practices, web accessibility, typeface, font, readability, legibility, eye-tracking ACM Reference Format: Luz Rello and Ricardo Baeza-Yates. 2016. The effect of font type on screen readability by people with Dyslexia.
    [Show full text]
  • I Hate Comic Sans!
    I HATE COMIC SANS! It’s Overused It’s Badly used It’s not serious typography Used Incorrectly by Hospitals, Businesses, and Banks, etc. ? “A Computer on Every Desk, In every Home, Running Microsoft Software” the Microsoft Mission statement c. 1980 Computers were expensive Marketed mostly to businesses Expensive Dial up internet Off peak use only on AOL (after 6pm-6am) Screen savers were products Microsoft Scenes After Dark (flying toasters) CD-ROM ‘multimedia’ software MS Beethoven, Schubert, Stravinsky, Strauss MS Ultimate Frank Lloyd Wright MS Wine Guide, MS Dogs, MS Complete Gardening Microsoft Home (1993 Consumer Division) •Goal: To create software for Mums, Dads, and kids Product titles: •Microsoft Flight Simulator* •Microsoft Encarta* •Microsoft Scenes* •Microsoft Creative Writer Wall Street Journal: Aug 24, 1995 • Home computers in US home electronic stores for about $1000 •First affordable computers available • with Windows 95 installed • MSN Online network released to compete with America Online (AOL), Compuserve, Genie etc. • First Generation Internet Explorer released in the Plus Pack for Windows 95 ‘Utopia’ Project Lead: Melinda French (future Mrs. BillG) UI used a simple method of Launching Applications Similar to Hypercard stacks of the late 1980s For children and novice users Release: to coincide with Win95 and 1995 Christmas Season Rover talks in Times New Roman 1994 Microsoft Bob DC Comics: DC Comics The Dark Knight Returns Watchmen DC COMICS: WATCHMEN 1986-87 ILLUSTRATOR/LETTERER : DAVE GIBBONS •
    [Show full text]
  • Presentation
    Born Broken: Fonts And Information Loss In Legacy Documents Geoffrey Brown and Kam Woods Indiana University School of Informatics and Computing Key Questions How pervasive are font substitution problems ? What information is available to identify fonts ? How well can we match the fonts required by a document collection ? How can we assist archivists in identifying serious font issues ? Page 8 MCTM Bulletin February 2005 K: I knew what you meant. I was just kidding. I’ll do XüLLbl (W):InputQ:FnOff :"""Y =! Y",Y#:PlotsOff the dishes tonight at dinner. YüL‚(W):Goto:0!Xscl:0!Yscl:Plot1(Scatt T er,L#,L$,&) PlotsOn 1:ZoomStat:StorePic Pic1 Lbl Q:FnOff :""üY :PlotsOff Jennifer felt better so offered the following challenge to Pause :Goto T Kevin. Lbl:0üXscl:0üYscl:Plot1(Scatt S:ClrHome:2!dim(L%er,L):dim(L ,L‚,Ñ)# )!N J: What type of general statement can you make DispPlotsOn "NO. 1:ZoomStat:StorePic OF Pic1 regarding the various polygons and, better yet, what PausePTS.":Output(1,13,N):Pause :Goto T can you say about a figure that looks like this? LblFor(I,1,N):ClrHome S:ClrHome:2üdim(Lƒ):dim(L )üN Disp "NO. "PT. OF NO.","":Output(1,9,I) PTS.":Output(1,13,N):Pause L#(I)!L%(1):L$(I)!L%(2) For(I,1,N):ClrHome Disp L%:Pause :End:Goto T LblDisp "PT.0:Menu(" NO.","":Output(1,9,I) MODELS R""," LINEAR (2)",1,"L(I)üLƒ(1):L‚(I)üLƒ(2) QUADRATIC",2," CUBIC/QUARTIC",3,"Disp Lƒ:Pause :End:Goto LOGARITHMIC",4," T LblEXPONENTIAL",5," 0:Menu(" MODELS POWER",6," RÜ"," LINEAR MAIN (2)",1," MENU",T) QUADRATIC",2," CUBIC/QUARTIC",3," Lbl 1:"aX+b"!Y# Kevin was impressed.
    [Show full text]
  • Choosing Fonts – Quick Tips
    Choosing Fonts – Quick Tips 1. Choose complementary fonts – choose a font that matches the mood of your design. For business cards, it is probably best to choose a classic font. *Note: These fonts are not available in Canva, but are in the Microsoft Office Suite. For some good Canva options, go to this link – https://www.canva.com/learn/canva-for-work-brand-fonts/ Examples: Serif Fonts: Sans Serif Fonts: Times New Roman Helvetica Cambria Arial Georgia Verdana Courier New Calibri Century Schoolbook 2. Establish a visual hierarchy – Use fonts to separate different types of information and guide the reader - Use different fonts, sizes, weights (boldness), and even color - Example: Heading (Helvetica, SZ 22, Bold) Sub-heading (Helvetica, SZ 16, Italics) Body Text (Garamond, SZ 12, Regular) Captions (Garamond, SZ 10, Regular 3. Mix Serifs and Sans Serifs – This is one of the best ways to add visual interest to type. See in the above example how I combined Helvetica, a sans serif font, with Garamond, a serif font. 4. Create Contrast, Not Conflict: Fonts that are too dissimilar may not pair well together. Contrast is good, but fonts need a connecting element. Conflict Contrast 5. Use Fonts from the Same Family: These fonts were created to work together. For example, the fonts in the Arial or Courier families. 6. Limit Your Number of Fonts: No more than 2 or 3 is a good rule – for business cards, choose 2. 7. Trust Your Eye: These are not concrete rules – you will know if a design element works or not! .
    [Show full text]
  • Vision Performance Institute
    Vision Performance Institute Technical Report Individual character legibility James E. Sheedy, OD, PhD Yu-Chi Tai, PhD John Hayes, PhD The purpose of this study was to investigate the factors that influence the legibility of individual characters. Previous work in our lab [2], including the first study in this sequence, has studied the relative legibility of fonts with different anti- aliasing techniques or other presentation medias, such as paper. These studies have tested the relative legibility of a set of characters configured with the tested conditions. However the relative legibility of individual characters within the character set has not been studied. While many factors seem to affect the legibility of a character (e.g., character typeface, character size, image contrast, character rendering, the type of presentation media, the amount of text presented, viewing distance, etc.), it is not clear what makes a character more legible when presenting in one way than in another. In addition, the importance of those different factors to the legibility of one character may not be held when the same set of factors was presented in another character. Some characters may be more legible in one typeface and others more legible in another typeface. What are the character features that affect legibility? For example, some characters have wider openings (e.g., the opening of “c” in Calibri is wider than the character “c” in Helvetica); some letter g’s have double bowls while some have single (e.g., “g” in Batang vs. “g” in Verdana); some have longer ascenders or descenders (e.g., “b” in Constantia vs.
    [Show full text]
  • Free Download Arial Unicode Ms.Ttf
    Free download arial unicode ms.ttf click here to download www.doorway.ru Arial Unicode MS font preview. www.doorway.ru Arial Unicode MS font preview. Download font - MB. At www.doorway.ru, find an amazing collection of thousands of FREE fonts for Windows and Mac. Arial Unicode MS ( downloads) Free For Personal Use. Download arial unicode ms font free at www.doorway.ru, database with web fonts, truetype and opentype fonts for Windows, Linux and. Typographic info for the Arial Unicode MS font family. Purchase & Download Microsoft fonts for personal, professional or business use on. Download the Arial Unicode MS free font. Mac, Linux; ✓ for programs: Microsoft Word, Photoshop, etc; ✓ free download. Arial Unicode www.doorway.ru, MB. Download Unavailable. Arial Create a Logo Using Arial Unicode MS You may need to extract www.doorway.ru files from www.doorway.ru archive file before installing the font. Description: Where can you get the Arial Unicode MS font? Resolution: www.doorway.ru file (the Arial Unicode MS font) needs to be in the PC's. Download Arial Unicode MS Regular For Free, View Sample Text, Rating And More On www.doorway.ru View and Download Arial Unicode MS Version CartoCSS port of Toner. Contribute to stamen/toner-carto development by creating an account on GitHub. toner-carto/fonts/www.doorway.ru Fetching contributors Cannot retrieve contributors at this time. Download History. executable file MB. View Raw. Arial Unicode MS Regular truetype font page. Coolest truetype fonts. Best free fonts download. View font details, character map, custom preview, downloads, file contents Arial Unicode by Agfa Monotype Corporation TTF, 22 MB, Font File, download .
    [Show full text]
  • Style Guide: Best Practices in Formatting
    Style Guide: Best Practices in Formatting According to Colin Wheildon, author of Type & Layout: Are You Communicating or Just Making Pretty Shapes, it’s possible that 75% of your readers attempting to access your content (whether online, in print, or via email) will disregard what you’re saying based solely on the type of font you choose. That’s right—75%! That’s why it’s critically important to choose fonts that are clean and accessible and to choose a layout that is visual but not busy. Don’t try to pack too much into your layout, or else you may run the risk of your message being lost. First, let’s look at the differences between a “serif” and “sans serif” font. Serif fonts are more embellished, with small lines attached to the end of a stroke in a letter or symbol. Popular serif fonts include Times New Roman, Georgia, and Garamond. Many books, newspaper, and magazines use a serif font. In print mediums, serif fonts are often easier to read. Sans serif fonts don’t have the added embellishments. These fonts are often used in advertisements, and are generally easier to read. In print, sans serif fonts are often used as a headline, whereas serif fonts are used for the body text. Popular sans serif fonts include Helvetica, Arial, and Calibri. There are some simple best practices in formatting print, online, and email communications for your organization. These best practices will make your information easier to understand and more accessible to the average reader. When do I use a serif font like Times New Roman or Garamond? For print items, it’s suggested to utilize serif fonts for brochures, donation letters in the mail, etc.
    [Show full text]
  • The Comicsans Pacakge
    The comicsans package∗ Scott Pakin [email protected] December 19, 2013 1 Introduction The comicsans package makes Microsoft's Comic Sans font available to LATEX 2". comicsans supports all of the following: • Roman text, boldface text, SMALL-CAPS TEXT, and—with a little extra effort—italic text • Кирилица (римский шрифт, жирный шрифт, каллиграфический шрифт) • Mathematics using Comic Sans wherever possible: ′ log 2" 1 k y (x) 3 10 3 + k=x pk1 Comic Sans is a TrueType (TTF) font. As such, it works particularly well with pdfLATEX, which natively supports TrueType fonts. Some TEX distribu- tions also support dynamic conversion of TTF to PK (a bitmapped font format long used by TEX) so TEX backends other than pdfTEX can (indirectly) utilize TrueType fonts, as well. 2 Installation The following is a brief summary of the comicsans installation procedure: 1. Acquire and install the Comic Sans TrueType (.ttf) files. 2. [Optional] Generate the italic and/or Cyrillic variants of Comic Sans 3. Install the comicsans font files and refresh the TEX filename database. ∗This document corresponds to comicsans v1.0g, dated 2013/12/19. 1 4. Point the TEX backends to the comicsans files. Details are presented in Sections 2.1–2.4. 2.1 Acquire and install the TrueType files comicsans requires the Comic Sans and Comic Sans Bold TrueType files (comic.ttf and comicbd.ttf). You may already have these installed. (On Windows, look in C:\WINDOWS\Fonts for Comic Sans MS (True- Type) and Comic Sans MS Bold (TrueType).) If not, see if a package called msttcorefonts is available for your operating system or operating-system distribution.
    [Show full text]
  • Typography Height
    THIS MONTH POInts OF VIEW a Serif Sans serif b Ascender Serif Typography Height Typography is the art and technique of arranging type. Like a Serif Descender person’s speaking style and skill, the quality of our treatment of Figure 1 | Typefaces. (a) The anatomy of letterform for serif (Garamond) letters on a page can influence how people respond to our mes- and sans serif (Univers) type both set at 58 point. (b) Four of the most sage. It is an essential act of encoding and interpretation, linking readily available fonts. what we say to what people see. Typography has been known to affect perception of credibility. line and paragraph settings (Fig. 2b). The relative scale of white In one study, identical job resumes printed using different type- space in Figure 2b makes the hierarchy of the content apparent. faces were sent out for review. Resumes with typefaces deemed Differentially aligning the paragraph text and bulleted list, when appropriate for a given industry resulted in applicants being con- allowed, differentiates the content. sidered more knowledgeable, mature, experienced, professional, To achieve meaningfully spaced text, use the ‘space before’ and believable and trustworthy than when less appropriate typefaces ‘space after’ settings instead of extra carriage returns. Find the were used1. In this case, picking the right typeface can help some- settings under Font menu > Paragraphs (PowerPoint) or Format one’s chances of landing a job. menu > Paragraphs (Word). The paragraph text in Figure 2b is set The term typeface is frequently conflated with font; Arial is a with 5 point space after it; the bulleted list has 3 point space after ‘typeface’ that may include roman, bold and italic ‘fonts’.
    [Show full text]
  • Fonts Installed with Each Windows OS
    FONTS INSTALLED WITH EACH WINDOWS OPERATING SYSTEM WINDOWS95 WINDOWS98 WINDOWS2000 WINDOWSXP WINDOWSVista WINDOWS7 Fonts New Fonts New Fonts New Fonts New Fonts New Fonts Arial Abadi MT Condensed Light Comic Sans MS Estrangelo Edessa Cambria Gabriola Arial Bold Aharoni Bold Comic Sans MS Bold Franklin Gothic Medium Calibri Segoe Print Arial Bold Italic Arial Black Georgia Franklin Gothic Med. Italic Candara Segoe Print Bold Georgia Bold Arial Italic Book Antiqua Gautami Consolas Segoe Script Georgia Bold Italic Courier Calisto MT Kartika Constantina Segoe Script Bold Georgia Italic Courier New Century Gothic Impact Latha Corbel Segoe UI Light Courier New Bold Century Gothic Bold Mangal Lucida Console Nyala Segoe UI Semibold Courier New Bold Italic Century Gothic Bold Italic Microsoft Sans Serif Lucida Sans Demibold Segoe UI Segoe UI Symbol Courier New Italic Century Gothic Italic Palatino Linotype Lucida Sans Demibold Italic Modern Comic San MS Palatino Linotype Bold Lucida Sans Unicode MS Sans Serif Comic San MS Bold Palatino Linotype Bld Italic Modern MS Serif Copperplate Gothic Bold Palatino Linotype Italic Mv Boli Roman Small Fonts Copperplate Gothic Light Plantagenet Cherokee Script Symbol Impact Raavi NOTE: Trebuchet MS The new Vista fonts are the Times New Roman Lucida Console Trebuchet MS Bold Script newer cleartype format Times New Roman Bold Lucida Handwriting Italic Trebuchet MS Bold Italic Shruti designed for the new Vista Times New Roman Italic Lucida Sans Italic Trebuchet MS Italic Sylfaen display technology. Microsoft Times
    [Show full text]