wizardloop.github.io/src/pages/accessibility.astro at main · WizardLoop/wizardloop.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
---
import Base from '../layouts/Base.astro';
---

<Base
  title="Accessibility"
  description="How I make my website more accessible, my WCAG 2.2 AA technical target, known testing limitations and how to report a barrier."
>
  <section class="wrap prose-page">
    <header class="page-intro">
      <p class="eyebrow">A SITE YOU CAN USE YOUR WAY</p>
      <h1>
        Creativity should
        <br />
        stay accessible.
      </h1>
      <p>
        I'm working toward a site that is comfortable to read, navigate and use
        across different devices and access needs.
      </p>
      <p>
        Reviewed <time datetime="2026-10-28">28 October 2026</time>.
      </p>
    </header>
    <div class="prose">
      <h2>Technical target</h2>
      <p>
        The technical target is{' '}
        <a href="https://www.w3.org/WAI/standards-guidelines/wcag/">
          WCAG 2.2 Level AA
        </a>
        . Applicable Israeli obligations, including Israeli Standard 5568 and
        the service-accessibility regulations, require assessment in the context
        of the actual service. The official{' '}
        <a href="https://www.gov.il/en/pages/internet_accessibility_regulations">
          internet accessibility provisions
        </a>{' '}
        provide relevant background.
      </p>
      <p>
        This statement describes the measures and limits of this build. It is
        not a certification of complete conformance or legal compliance.
      </p>

      <h2>Features included</h2>
      <ul>
        <li>Semantic page sections, headings and a Skip to content link.</li>
        <li>
          Keyboard-operable navigation, links and controls with visible focus
          indicators.
        </li>
        <li>
          A mobile menu with focus management, Escape to close and focus
          returned to its trigger.
        </li>
        <li>
          Light and dark themes, responsive layouts and text that supports
          browser zoom.
        </li>
        <li>
          Reduced-motion support and a visible header control to pause repeated
          animation.
        </li>
        <li>
          Text alternatives for meaningful images and hidden decorative
          illustrations.
        </li>
        <li>
          Appropriate language and direction handling, including Hebrew content
          where it appears.
        </li>
      </ul>

      <h2>Using the keyboard and motion controls</h2>
      <p>
        Use Tab and Shift+Tab to move between controls. Activate links with
        Enter and buttons with Enter or Space. Press Escape to close the mobile
        navigation. The first keyboard link skips directly to the main content.
      </p>
      <p>
        The header's motion control pauses the site's repeated animation. Your
        operating system's reduced-motion preference is respected. Local artwork
        has still previews when motion is paused or playback is unavailable.
      </p>

      <h2>Known limitations</h2>
      <p>
        Telegram and GitHub open as separate websites. Their accessibility and
        media playback are outside this website's control. You can choose email
        instead of Telegram for direct contact.
      </p>
      <p>
        A complete human screen-reader audit has not been performed. Automated
        accessibility checks and browser tests help find issues, but they do not
        establish that every interaction meets every requirement. No unmeasured
        accessibility score or legal compliance claim is made here.
      </p>
      <p>
        The contact page provides direct Telegram and email links without a form
        or verification challenge. If one channel is difficult to use, choose
        the other and describe your preferred way to receive a response.
      </p>

      <h2>Report an accessibility barrier</h2>
      <p>
        Email <a href="mailto:wizard@wizardloop.com">wizard@wizardloop.com</a>{' '}
        or <a href="https://t.me/wizardloop">contact me on Telegram</a>. Include
        the page address, what you were trying to do and what prevented it.
        Browser or assistive-technology details are helpful if you are
        comfortable sharing them; they are not required.
      </p>
      <p>
        I will use the report to investigate and improve the experience. This
        statement will be updated as testing and fixes progress.
      </p>
    </div>
  </section>
</Base>