Improving Accessibility with Typography
UX Designer | Accessibility | Texas Department of Transportation
Overview
In an engineering-focused organization where data presentation is paramount, typography plays a critical role in ensuring information is conveyed clearly and effectively. Recognizing the need for improved legibility and accessibility, our organization transitioned from the Inter typeface to IBM Plex Sans within our design system.
Challenges with the Previous Typeface
Our previous typeface, Inter, was visually pleasing, but presented challenges in data-intensive contexts:
Character Ambiguity: Characters such as lowercase "l" and uppercase "I” were too similar and caused confusion at times.
Limited Variants: The absence of diverse font weights and condensed options restricted our ability to emphasize critical data points effectively.
These issues hindered our ability to present complex engineering data with the clarity required for precise analysis and decision-making.
Uppercase “i” character
Lowercase “l” character
Why IBM Plex Sans?
IBM Plex Sans was selected for its design principles that align with our needs:
Distinct Character Design: The typeface features clear distinctions between commonly confused characters, reducing the risk of misinterpretation in data presentation.
Versatile Font Family: With four subfamilies—Sans, Serif, Mono, and Sans Condensed—each offering eight weights and two styles (roman and italic), IBM Plex Sans provides the flexibility needed for various data visualization contexts.
Global Language Support: Covering over 100 languages, it ensures consistency across our international documentation and interfaces.
Inter font
IBM Plex Sans font
Inter and IBM Plex Sans font comparison.
Each glyph in the entire Plex family was optimized for on-screen legibility in small sizes.
Implementation Process
Print Materials Update: We initiated the transition by updating our print materials to assess the typeface's performance in static formats. This approach may seem counter intuitive but updating digital systems requires much more effort than printed materials.
Digital Integration: Following successful print implementation, we integrated IBM Plex Sans into our digital design system, ensuring consistency across all platforms.
Internal Testing: Components were tested internally among team members to evaluate legibility and usability, particularly in data-dense scenarios.
Outcomes & Lessons Learned
Enhanced Data Clarity: The adoption of IBM Plex Sans has led to improved readability of numerical and textual data, facilitating more accurate analysis and interpretation.
Consistency Across Mediums: Utilizing a single typeface across print and digital mediums has strengthened our brand identity and reduced cognitive load for users interacting with our data.
Technical Adjustments: During implementation, we identified components with custom CSS that required realignment with our main stylesheets, leading to a more cohesive visual presentation.
Key Takeaway
Typography is a fundamental element in data presentation. Selecting a typeface like IBM Plex Sans, designed with accessibility and clarity in mind, significantly enhances the effectiveness of data communication in engineering contexts.
IBM Plex Sans number samples.
IBM Plex Sans terminal and baseline diagram.
IBM Plex Sans parțial glyph character set.