Skip to main content

Accessible Typography for Web & UI Design Masterclass

Oliver Schöndorfer
Your instructor
Oliver Schöndorfer
Tickets
Get a ticket ↓

Workshop includes:

  • 🔖  Examples to take away
  • 🗣  Interactive sessions
  • 📺  Workshop recordings
  • 🎤  Dedicated Q&A time
  • 🏅  Smashing Certificate

Workshop, 4×2h + Q&A Thu & Fri, Oct 10–18 2024
09:00 – 11:30 AM PT 18:00 – 20:30 CET Check your time zone

How can you best combine sublime typography with web accessibility? This practical and fun workshop gives you clear guidelines for a seemingly too fuzzy area. Learn how to set the text in your design projects beautifully accessible, making it reach and convince more people, while meeting legal requirements.


Here’s What You Should Be Expecting:

  • Interactive live sessions

    4 × 2.5h live sessions

  • Practical insights

    From type choice, to color contrast and dark mode.

  • Cheat sheet and materials

    Color contrast cheat sheet, all slides and materials.

  • Hands-on exercises

    With reviews by your teacher

  • Life-time access

    To all video recordings and examples

  • Dedicated Q&A time

    To ask all your questions

  • Smashing Certificate

    A well-deserved reward for your work


$300.00 $400.00Register for this workshop →4 × 2h live sessions + Q&A. Oct 10–18.
With all video recordings & slides. Get a ticket.

🎪  Save up to 25% on this workshop with a Smashing Membership.


Great typography meets accessibility

Typography is fundamental to web and UI design, but with its many rules and conventions it can often be overwhelming. Web Accessibility is a common requirement, but the guidelines can feel very complicated and fuzzy, when it comes to visual design.

This workshop combines both topics in a way visual designers can understand and apply them. Instead of thinking of it as a hurdle or limitation, learn to see accessibility requirements as another source of inspiration.

  • How to assess if a typeface is accessible.
  • Which WCAG requirements (success criteria) matter for typography and visual design.
  • Which contrast requirements are crucial.
  • What are the best font sizes.
  • The ideal line length, line height and letter spacing.
  • How to deal with light text on dark background.
  • Recommended tools, plugins and resources.
  • Short exercises, letting you apply what you just learned, right away.
  • Get feedback on your own project, if you want to.

You will get answers to questions like:

  • What’s the required minimum font size?
  • Should you mainly use sans-serif fonts?
  • Should you design for AA or AAA?
  • Do all of your links need to be underlined?
  • What’s the difference between active and focus states?
  • Are darkmode or high contrast themes needed?
  • Is it required to have a minimum line-height of 1.5?
  • Are Comic Sans or Open Dsylexic (😱) best for dyslexic readers?


Who is this workshop for?

This workshop is specifically aimed towards visual designers, UI, app, or graphic designers – however you wanna call yourself 😉. It will not be technical, so not about HTML elements or providing alt tags. It also does not focus on the nuances of legal requirements or auditing a website.

It is a deep dive into typography and accessibility, not accessible web design in general. The goal of the workshop is taking the weight out of an often overwhelming and fuzzy topic, and breaking it down into practical, usable steps.

What hardware/software do you need?

  • A free Figma account for doing the exercises
  • A free Stark account to use the plugin.

About Oliver Schöndorfer

Oliver Schöndorfer is a typography expert, freelance UI & app designer, and YouTuber. His channel Pimp my Type and weekly Font Friday Newsletter inspire a global audience to leverage the power of typography.

Time & Schedule

This workshop is split over four days. The workshop sessions will run on the following days:

  • Thu, October 10, 09:00 – 12:00 AM PT (18:00 – 21:00 CET)
  • Fri, October 11, 09:00 – 12:00 AM PT (18:00 – 21:00 CET)
  • Thu, October 17, 09:00 – 12:00 AM PT (18:00 – 21:00 CET)
  • Fri, October 18, 09:00 – 12:00 AM PT (18:00 – 21:00 CET)

You can always re-watch the sessions at a more convenient time and follow the workshop at your own pace.

$300.00 $400.00Register for this workshop →4 × 2h live sessions + Q&A. Oct 10–18.
With all video recordings & slides. Get a ticket.

🎪  Save up to 25% on this workshop with a Smashing Membership.


Day 1 — Choosing Accessible Typefaces

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM

  • Designing for Accessibility
  • Types of visual impairments
  • How reading works
  • Know when to be expressive
  • Exercise #1: Form fonts
  • Choosing an accessible font
  • Fonts for Dyslexia
  • Exercise #2: Body text fonts

11:30 AM – 12:00 PM
Q&A with Oliver on the day’s material. Networking!

Day 2 — Contrast, Size and Spacing

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM

  • Recap and Feedback on your exercises
  • Short overview of the legal landscape
  • WCAG for designers
  • The right text contrast
  • Exercise #3: Text contrast
  • Minimum font size
  • The ideal letter spacing
  • Exercise #4: Text spacing

11:30 AM – 12:00 PM
Q&A with Oliver on the day’s material. Networking!

Day 3 — Accessible Typesetting

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM

  • Recap and Feedback on your exercises
  • The ideal paragraph
  • Exercise #5: Paragraph spacing
  • Typography and UI Components
  • Exercise #6: Styling tags
  • Exercise #7: Styling buttons
  • Recap and Feedback on your exercises

11:30 AM – 12:00 PM
Q&A with Oliver on the day’s material. Networking!

Day 4 — Darkmode & High Contrast

8:45 AM PT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM

  • Typography in Darkmode and High Contrast mode
  • Exercise #8: Darkmode
  • Most important WCAG for design
  • WCAG Quiz
  • Feedback on your projects and exercises
  • Summary and Closing

11:30 AM – 12:00 PM
Q&A with Oliver on the day’s material. Networking!

$300.00 $400.00Register for this workshop →4 × 2h live sessions + Q&A. Oct 10–18.
With all video recordings & slides. Get a ticket.

🎪  Save up to 25% on this workshop with a Smashing Membership.