About

About This Template

This accessible Jekyll template was created to demonstrate best practices for web accessibility in accordance with:

  • WCAG 2.1 Level AA (Web Content Accessibility Guidelines)
  • Section 508 standards
  • Title II of the Americans with Disabilities Act (ADA)

Design Principles

Our template follows these core accessibility principles:

  1. Perceivable: Information and user interface components must be presentable to users in ways they can perceive
    • All images have alternative text
    • Color is not used as the only visual means of conveying information
    • Text has sufficient contrast against backgrounds (minimum 4.5:1 ratio)
  2. Operable: User interface components and navigation must be operable
    • All functionality is available via keyboard
    • Users have enough time to read and use content
    • Content does not cause seizures or physical reactions
    • Users can easily navigate and find content
  3. Understandable: Information and operation of the user interface must be understandable
    • Text is readable and understandable
    • Web pages appear and operate in predictable ways
    • Users are helped to avoid and correct mistakes
  4. Robust: Content must be robust enough to be interpreted by a wide variety of user agents, including assistive technologies
    • Compatible with current and future user tools
    • Proper HTML5 semantic structure
    • Valid HTML and CSS

Technical Implementation

This template includes:

  • Semantic HTML5 structure
  • ARIA landmarks and labels
  • Keyboard navigation support
  • Skip navigation links
  • Proper heading hierarchy
  • Focus indicators
  • Responsive design
  • High contrast mode support
  • Reduced motion support
  • Print stylesheet

Contact

If you have questions or suggestions for improving accessibility, please open an issue on GitHub.

Resources

Learn more about web accessibility: