Compliance

Accessibility Policy

We are committed to ensuring this portfolio is accessible to all individuals, following WCAG 2.1 level AA guidelines.

1. Keyboard Focus Navigation

All links, input elements, buttons, and dropdown selection boxes support clear keyboard focus loops. Every focusable element gets a high-contrast accent outline, offset from the element so it stays legible against any background:

:focus-visible {
  outline: 3px solid var(--color-accent);
  outline-offset: 4px;
}

/* Form fields also tint their border and use a
   softer outline, since the field already has one. */
.form-control:focus-visible {
  border-color: var(--color-accent);
  outline: 3px solid var(--color-accent-a22);
  outline-offset: 2px;
}

2. Motion & Transitions (prefers-reduced-motion)

For users with motion sensitivities, the portfolio listens to browser preferences. When prefers-reduced-motion is active:

  • Word rotation in the Hero section is paused, locking statically on "complexity".
  • The "From Mess to Map" paradigm displays the disorder list and mapped checklist side-by-side without transition steps.
  • All slide and fade transitions are disabled.

3. Screen Reader & Dynamic Elements

Interactive widgets use semantic HTML markup and dynamic screen reader controls:

  • The mobile navigation overlay uses standard `aria-expanded` and `aria-label` tags.
  • Category selection triggers announce modifications to screen readers via an `aria-live="polite"` notifier region.
  • Fields and options employ explicit label associations for clean dictation navigation.

4. Feedback

If you encounter any navigation barrier, contact hello@iamovaiz.com to coordinate adjustments.