Demo Mode — read-only previewStart free trial
Issues

Check that a change of context does not occur when this input field receives focus.

Minor3.2.1HTMLCS · htmlcs-unknown-WCAG2AA.Principle3.Guideline3_2.3_2_1.G107Docs
Pages 258on AllyProof
Elements 50
Open 111d 14hsince 4/26/2026
First seen 4/26/2026
Last seen 8/15/2026

Check that a change of context does not occur when this input field receives focus.

Scanner evidence

Engine: htmlcsRule: htmlcs-WCAG2AA.Principle3.Guideline3_2.3_2_1.G107WCAG: 3.2.1
Check that a change of context does not occur when this input field receives focus.

How to fix

Check that a change of context does not occur when this input field receives focus.

Affected pages (258)

Affected elements (50)

https://allyproof.com/pricing11
  1. <button
      class="flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:text-foreground transition-colors"
      aria-label="Switch to dark mode">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="24"
        height="24"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
        class="lucide lucide-moon h-4 w-4"
        aria-hidden="true">
    <path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215

    button.flex.h-8

    on https://allyproof.com/pricing

  2. <button type="button" tabindex="0" data-slot="button" aria-label="Open menu" aria-expanded="false" class="group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 ari

    button.group/button.inline-flex

    on https://allyproof.com/pricing

  3. <button
      type="button"
      role="radio"
      aria-checked="false"
      tabindex="-1"
      class="rounded-full px-4 py-1.5 text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring text-muted-foreground hover:text-foreground">
      Monthly
    </button>

    button.rounded-full.px-4

    on https://allyproof.com/pricing

https://allyproof.com/9
  1. <button
      class="flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:text-foreground transition-colors"
      aria-label="Switch to dark mode">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="24"
        height="24"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
        class="lucide lucide-moon h-4 w-4"
        aria-hidden="true">
    <path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215

    button.flex.h-8

    on https://allyproof.com/

  2. <button type="button" tabindex="0" data-slot="button" aria-label="Open menu" aria-expanded="false" class="group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 ari

    button.group/button.inline-flex

    on https://allyproof.com/

  3. <input
      id="hero-prefill-url"
      type="text"
      inputmode="url"
      autocomplete="url"
      autocapitalize="none"
      spellcheck="false"
      placeholder="yourcompany.com"
      aria-describedby="hero-scorecard-help"
      class="h-11 w-full rounded-lg border border-border bg-background px-4 text-base text-foreground shadow-sm outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-[invalid]:border-destructive"
      name="prefill_url"
      value="">

    #hero-prefill-url

    on https://allyproof.com/

https://allyproof.com/de9
  1. <button
      class="flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:text-foreground transition-colors"
      aria-label="Switch to dark mode">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="24"
        height="24"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
        class="lucide lucide-moon h-4 w-4"
        aria-hidden="true">
    <path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215

    button.flex.h-8

    on https://allyproof.com/de

  2. <button type="button" tabindex="0" data-slot="button" aria-label="Open menu" aria-expanded="false" class="group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 ari

    button.group/button.inline-flex

    on https://allyproof.com/de

  3. <input
      id="hero-prefill-url"
      type="text"
      inputmode="url"
      autocomplete="url"
      autocapitalize="none"
      spellcheck="false"
      placeholder="ihrefirma.de"
      aria-describedby="hero-scorecard-help"
      class="h-11 w-full rounded-lg border border-border bg-background px-4 text-base text-foreground shadow-sm outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-[invalid]:border-destructive"
      name="prefill_url"
      value="">

    #hero-prefill-url

    on https://allyproof.com/de

https://allyproof.com/free-accessibility-test7
  1. <button
      class="flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:text-foreground transition-colors"
      aria-label="Switch to dark mode">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="24"
        height="24"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
        class="lucide lucide-moon h-4 w-4"
        aria-hidden="true">
    <path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215

    button.flex.h-8

    on https://allyproof.com/free-accessibility-test

  2. <button type="button" tabindex="0" data-slot="button" aria-label="Open menu" aria-expanded="false" class="group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 ari

    button.group/button.inline-flex

    on https://allyproof.com/free-accessibility-test

  3. <input
      id="free-test-url"
      type="text"
      inputmode="url"
      autocomplete="url"
      autocapitalize="none"
      spellcheck="false"
      placeholder="yourcompany.com"
      class="h-11 w-full rounded-lg border border-border bg-background px-4 text-base text-foreground shadow-sm outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-[invalid]:border-destructive disabled:opacity-60"
      value="">

    #free-test-url

    on https://allyproof.com/free-accessibility-test

https://allyproof.com/de/kostenloser-barrierefreiheitstest7
  1. <button
      class="flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:text-foreground transition-colors"
      aria-label="Switch to dark mode">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="24"
        height="24"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
        class="lucide lucide-moon h-4 w-4"
        aria-hidden="true">
    <path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215

    button.flex.h-8

    on https://allyproof.com/de/kostenloser-barrierefreiheitstest

  2. <button type="button" tabindex="0" data-slot="button" aria-label="Open menu" aria-expanded="false" class="group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 ari

    button.group/button.inline-flex

    on https://allyproof.com/de/kostenloser-barrierefreiheitstest

  3. <input
      id="free-test-url"
      type="text"
      inputmode="url"
      autocomplete="url"
      autocapitalize="none"
      spellcheck="false"
      placeholder="ihrefirma.de"
      class="h-11 w-full rounded-lg border border-border bg-background px-4 text-base text-foreground shadow-sm outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-[invalid]:border-destructive disabled:opacity-60"
      value="">

    #free-test-url

    on https://allyproof.com/de/kostenloser-barrierefreiheitstest

https://allyproof.com/compare/accessibility-overlays5
  1. <button
      class="flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:text-foreground transition-colors"
      aria-label="Switch to dark mode">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="24"
        height="24"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
        class="lucide lucide-moon h-4 w-4"
        aria-hidden="true">
    <path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215

    button.flex.h-8

    on https://allyproof.com/compare/accessibility-overlays

  2. <button type="button" tabindex="0" data-slot="button" aria-label="Open menu" aria-expanded="false" class="group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 ari

    button.group/button.inline-flex

    on https://allyproof.com/compare/accessibility-overlays

  3. <button type="button" class="hover:text-foreground transition-colors text-left">
      Cookie preferences
    </button>

    button.hover:text-foreground.transition-colors

    on https://allyproof.com/compare/accessibility-overlays

https://allyproof.com/de/preise2
  1. <button
      class="flex h-8 w-8 items-center justify-center rounded-md text-muted-foreground hover:text-foreground transition-colors"
      aria-label="Switch to dark mode">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="24"
        height="24"
        viewBox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
        class="lucide lucide-moon h-4 w-4"
        aria-hidden="true">
    <path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215

    button.flex.h-8

    on https://allyproof.com/de/preise

  2. <button type="button" tabindex="0" data-slot="button" aria-label="Open menu" aria-expanded="false" class="group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 ari

    button.group/button.inline-flex

    on https://allyproof.com/de/preise

AI guidance

Remediation suggestions generated by AI. Review before applying.

No AI suggestion generated yet.

Activity (0)

No activity yet.