Built with UD/UDL
Universal Design and Universal Design for Learning principles ensure Praxis works for everyone.
Accessibility Scorecard
Standards compliance verified against W3C WCAG 2.1
Millions of Americans live with some form of disability. The Web Content Accessibility Guidelines (WCAG) provide the international standard for web accessibility. Praxis is designed from the ground up to meet WCAG 2.1 Level AA requirements.
Understanding Universal Design
Design for all, not retrofit for some
Universal Design means creating products and environments usable by all people, to the greatest extent possible, without adaptation or specialized design. When we design for the edges, everyone benefits.
Traditional Retrofit
After-the-fact- Build first, add accessibility later
- Create separate "accessible version"
- Treat accessibility as compliance checkbox
- Bolt-on solutions that feel awkward
- Higher cost, lower quality results
Universal Design
From the start- Accessibility built into the foundation
- One version that works for everyone
- Design decisions consider all users
- Seamless, natural experience
- Lower long-term cost, better outcomes
Universal Design (UD)
Originated in architecture at NC State University in 1997[3]. UD creates spaces and products accessible to people with diverse abilities. Curb cuts help wheelchair users but also benefit parents with strollers, travelers, and delivery workers.
Universal Design for Learning (UDL)
Applies UD principles to education. Developed by CAST.org, UDL provides a research-based framework for creating flexible learning experiences that accommodate individual differences from the start[4].
Proactive, Not Reactive
Traditional accessibility retrofits solutions after problems arise. UD/UDL builds flexibility into the foundation, ensuring no one is excluded in the first place.
Benefits Everyone
Closed captions help deaf users—and people watching in noisy environments. High contrast helps low vision users—and people in bright sunlight. Good design for some is better design for all.
The Three UDL Principles
CAST.org's framework for inclusive education
UDL is built on three core principles based on neuroscience research about how humans learn[4]. These address the "why," "what," and "how" of learning. Praxis implements all three throughout the platform.
1. Multiple Means of Engagement
The "Why" of Learning — Different learners are motivated in different ways. Praxis offers varied entry points: interactive tools for hands-on learners, comprehensive guides for readers, quick quizzes for those who learn through challenge.
2. Multiple Means of Representation
The "What" of Learning — Information should be presented in multiple formats. Praxis uses text, visual cards, interactive examples, color coding, icons, and progressive disclosure to present concepts in ways that work for different minds.
3. Multiple Means of Action & Expression
The "How" of Learning — Learners differ in how they demonstrate knowledge. Praxis lets you analyze prompts, build them step-by-step, match methods to tasks, take quizzes, or simply read—all valid paths to the same destination.
UDL in Practice at Praxis
Concrete implementations of Universal Design for Learning
Multiple Entry Points
Start with tools if you're hands-on. Start with guides if you prefer reading. Start with the quiz if you want to assess first. No single "right" path through the content.
Progressive Complexity
Prompt Basics → CRISP → ReAct → Chain-of-Thought → and more. 22 frameworks, each building on the last, letting you progress at your own pace.
Visual + Text Information
Every methodology shows both visual cards (quick reference) and detailed text explanations. Flip cards reveal additional detail. Icons reinforce meaning.
Interactive Tools
Prompt Analyzer gives instant feedback. Prompt Builder guides construction. Technique Finder helps selection. Learn by doing, not just reading.
Real-World Examples
Every concept includes concrete examples from everyday scenarios. Abstract ideas become tangible through practical application.
Self-Assessment
The 80-question quiz spans 8 levels, helping you identify what you know and what to learn next without external judgment.
Comprehensive Glossary
5,324+ terms defined in plain language. Encounter an unfamiliar word? Look it up instantly. No assumed knowledge required.
Search Everything
Cmd+K search finds any content across the entire site. Can't remember where something is? Search will find it.
WCAG 2.1 Compliance Matrix
Detailed W3C accessibility guidelines implementation
The Web Content Accessibility Guidelines (WCAG) 2.1 is the internationally recognized standard for web accessibility, published by the W3C Web Accessibility Initiative (WAI)[2]. Praxis meets Level AA requirements across all four principles: Perceivable, Operable, Understandable, and Robust (POUR).
1. Perceivable
Information presented in accessible ways. Text alternatives for images (1.1), captions where needed (1.2), adaptable content structure (1.3), distinguishable from background with 4.5:1+ contrast (1.4)[2].
2. Operable
UI components must be operable. Keyboard accessible (2.1), no time limits (2.2), no seizure-inducing content (2.3), navigable with skip links and clear structure (2.4), pointer accessible (2.5)[2].
3. Understandable
Content and operation must be understandable. Readable with lang attribute (3.1), predictable behavior (3.2), input assistance with error identification (3.3)[2].
4. Robust
Content compatible with assistive tech. Valid HTML parsing (4.1.1), name/role/value exposed properly (4.1.2), status messages announced (4.1.3)[2].
WCAG 2.1 Level AA is incorporated by reference into Section 508 of the U.S. Rehabilitation Act[5]. Meeting WCAG AA means Praxis complies with U.S. federal accessibility requirements for electronic and information technology.
Accessibility Features
Specific accommodations built into Praxis
Text Scaling (1x/2x/3x)
Increase text size up to 3x normal without breaking layouts. Stored in localStorage so your preference persists across sessions.
High Contrast Mode
Significantly increases contrast ratios throughout the site. Essential for users with low vision, helpful in bright environments.
Screen Dimming
Adjustable overlay dims screen brightness up to 50%. Reduces eye strain for light-sensitive users or nighttime reading.
Skip Links
Hidden skip link appears on Tab, allowing keyboard users to bypass navigation and jump directly to main content.
Focus Indicators
Clear visible focus outlines on all interactive elements. Know exactly where you are when navigating via keyboard.
ARIA Labels
Screen reader users receive complete information through aria-label, aria-describedby, and proper role attributes.
Semantic HTML
Proper heading hierarchy (h1→h2→h3), landmark regions (main, nav, footer), and semantic elements throughout.
Color Independence
Information never conveyed by color alone. Icons, text, and patterns reinforce meaning for color-blind users.
Click the accessibility icon (person in circle) in the bottom-right corner to open the Accessibility Dashboard. Experiment with text scaling, high contrast, and screen dimming to find what works best for you.
Color Contrast Analysis
Meeting and exceeding WCAG requirements
WCAG AA requires 4.5:1 contrast for normal text and 3:1 for large text. Here's how Praxis performs:
Primary Text
Ratio: 12.6:1 — Dark gray (#111827) on white background. Exceeds AA requirement by 2.8x.
Secondary Text
Ratio: 8.3:1 — Medium gray (#374151) on white. Nearly double the required ratio.
Link Text
Ratio: 5.9:1 — Primary red (#DC3545) on white. Exceeds AA by 31%.
Button Text
Ratio: 4.6:1 — White on primary red buttons. Meets AA for all text sizes.
High Contrast Mode
Ratio: 15%+ increase — When enabled, all contrast ratios increase significantly above baseline.
Dark Mode (Coming)
Dark theme variables defined in CSS. Same contrast standards applied with inverted color scheme.
Keyboard Navigation
Full functionality without a mouse
Every feature in Praxis is accessible via keyboard. Here are the key interactions:
Tab Navigation
Tab / Shift+Tab — Move forward/backward through all interactive elements in logical order.
Activate Elements
Enter / Space — Activate buttons, links, and controls. Both keys work on most interactive elements.
Search Modal
Ctrl+K / Cmd+K — Open search from anywhere. Escape to close. Arrow keys to navigate results.
Accordions
Enter / Space — Expand/collapse accordion sections on methodology pages.
Modal Dialogs
Escape — Close any open modal (search, badge lightbox, accessibility panel).
Skip to Content
First Tab — Reveals skip link to jump past navigation directly to main content.
Screen Reader Compatibility
Ensuring content is fully accessible to assistive technology
Semantic Structure
Proper heading hierarchy (h1→h2→h3) allows screen reader users to navigate by headings. Landmark regions (main, nav, footer) enable jumping between page sections.
ARIA Implementation
Interactive components include aria-label, aria-expanded, aria-controls, and role attributes. Screen readers announce state changes for accordions, modals, and toggles.
Image Alternatives
Decorative images use empty alt or aria-hidden. Meaningful images have descriptive alt text. Canvas elements include fallback content.
Focus Management
When modals open, focus moves to the modal. When closed, focus returns to the trigger. Prevents screen reader users from getting "lost" in the page.
Praxis is tested with VoiceOver (macOS/iOS), NVDA (Windows), and browser reader modes. Testing with multiple assistive technologies ensures broad compatibility. If you encounter issues with your assistive technology, please report them on GitHub.
The 7 Principles of Universal Design
Originated at NC State's Center for Universal Design
The 7 Principles of Universal Design were developed in 1997 by a working group of architects, product designers, engineers, and environmental design researchers at NC State University[3]. Here's how Praxis implements each:
1. Equitable Use
Same content and tools available to all users. No separate "accessible version"—the main site IS the accessible version.
2. Flexibility in Use
Multiple pathways to the same knowledge. Tools, guides, quiz, glossary—choose your preferred learning method.
3. Simple & Intuitive
Clear navigation, consistent patterns, plain language. No prior AI knowledge required to begin learning.
4. Perceptible Information
Information presented in multiple formats (text, visual, interactive). High contrast, scalable text, icons with labels.
5. Tolerance for Error
Interactive tools provide feedback, not judgment. Wrong quiz answers lead to learning, not punishment. Undo available where applicable.
6. Low Physical Effort
No time pressure. No rapid interactions required. Content loads fast. Pages are lightweight and efficient.
7. Size & Space for Use
Generous tap targets on mobile. Readable text sizes. Responsive layouts that adapt from phone to desktop.
UD/UDL Summary
Accessibility at a glance
Experience Accessible AI Learning
Universal Design isn't just about compliance—it's about creating the best possible experience for everyone.
Sources
- IT Accessibility Laws and Policies - Section508.gov
- ICT Testing Baseline Portfolio - U.S. Access Board
- Federal Website Standards - Digital.gov
- Universal Design for Learning - Virginia Tech
Praxis accessibility is verified using axe DevTools, WAVE, and manual testing with screen readers. Design principles follow WCAG guidelines and Universal Design for Learning frameworks.