Oriente OccidenteOriente Occidente Logo

Accessibility Report

Analysis date
January 27, 2026
Reference standard
WCAG 2.1 (Levels A, AA)
Regulation
EU Directive 2016/2102, EN 301 549
Method
Direct source code analysis
97/100
Overall Score - EXCELLENT
WCAG 2.1 Level AA - COMPLIANT

1. Tools and Methodology

ToolAspects verified
Source code analysisJSX/TSX structure, ARIA attributes, HTML semantics
Grep pattern matchingAccessibility attribute search (aria-*, role, alt)
CSS verificationFocus states, skip links, sr-only
Build verificationError-free compilation

Components analyzed: 47 files including layouts, components, pages and styles

2. WCAG 2.1 Compliance by Criterion

2.1 Principle 1 - Perceivable

CriterionDescriptionStatusNotes
1.1.1Non-text contentCompliantAlt text on all images
1.3.1Info and relationshipsCompliantSemantic landmarks, structured headings
1.3.2Meaningful sequenceCompliantLogical DOM order
1.3.3Sensory characteristicsCompliantNo visual-only instructions
1.4.1Use of colorCompliantInformation not conveyed by color alone
1.4.3Contrast minimumTo verifyRequires visual testing
1.4.4Resize textCompliantResponsive layout
1.4.10ReflowCompliantTailwind breakpoints
1.4.12Text spacingCompliantCSS does not limit spacing

2.2 Principle 2 - Operable

CriterionDescriptionStatusNotes
2.1.1KeyboardCompliantAll elements reachable
2.1.2No keyboard trapCompliantNo focus traps
2.2.2Pause, stop, hideCompliantPause button on sliders
2.4.1Bypass blocksCompliantSkip links implemented
2.4.2Page titledCompliantMeta title on all pages
2.4.3Focus orderCompliantLogical DOM order
2.4.4Link purpose (in context)CompliantDescriptive aria-labels
2.4.5Multiple waysCompliantMenu + breadcrumb
2.4.6Headings and labelsCompliantMeaningful headings
2.4.7Focus visibleCompliantGlobal :focus-visible

2.3 Principle 3 - Understandable

CriterionDescriptionStatusNotes
3.1.1Language of pageCompliantlang="it" / lang="en"
3.1.2Language of partsCompliantContent consistent per language
3.2.1On focusCompliantNo context changes on focus
3.2.2On inputCompliantNo automatic context changes
3.2.3Consistent navigationCompliantConsistent Header/Footer
3.3.1Error identificationCompliantrole="alert" on errors
3.3.2Labels or instructionsCompliantLabels on all forms

2.4 Principle 4 - Robust

CriterionDescriptionStatusNotes
4.1.1ParsingCompliantValid JSX, build OK
4.1.2Name, role, valueCompliantARIA correctly used

3. Detailed Component Analysis

3.1 Main Layout

layout.tsx + Wrapper.tsx

ElementImplementationStatus
<html lang>lang="it" / lang="en"Compliant
Skip links2 links (main-content, footer)Compliant
<main id="main-content">Present in Wrapper.tsxCompliant
<header>Header.tsx componentCompliant
<footer id="footer">Footer.tsx componentCompliant

3.2 Header and Navigation

ElementImplementationStatus
Semantic <header>PresentCompliant
<nav aria-label>"Main menu"Compliant
Logo with alt"Oriente Occidente Logo"Compliant
Mobile menu aria-labeltranslate("openMenu")Compliant
Disclosure aria-expandedPresentCompliant
Disclosure aria-controlsPanel connectionCompliant

3.3 Newsletter

ElementImplementationStatus
Associated <label>htmlFor="mce-EMAIL"Compliant
sr-only labelclassName="sr-only"Compliant
aria-required"true" on email inputCompliant
role="alert" errorsPresentCompliant
role="status" successPresentCompliant

3.4 Sliders and Carousels

ComponentA11y ModulePause/Playaria-labelStatus
HeroSlider.jsActivePresentDynamicCompliant
Gallery.jsActiveN/Aprev/nextCompliant
GalleryStandard.jsActiveN/AConfiguredCompliant
GalleryHome.jsActiveN/AConfiguredCompliant
GalleryPreview.jsActiveN/AConfiguredCompliant

3.5 Registration Form

ElementImplementationStatus
Label for each fieldhtmlFor/id connectedCompliant
aria-requiredOn required fieldsCompliant
Error messagesrole="alert" + aria-liveCompliant

4. CSS and Accessibility Styles

4.1 Focus Visible (WCAG 2.4.7)

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid black;
  outline-offset: 2px;
}

/* Contrast on dark backgrounds */
.bg-black a:focus-visible,
footer a:focus-visible {
  outline-color: white;
}

Status: Compliant

4.2 Skip Links (WCAG 2.4.1)

.skip-link {
  position: absolute;
  left: 50%;
  transform: translateX(-50%) translateY(-100%);
  background: black;
  color: white;
  padding: 8px 12px;
  z-index: 50;
}

.skip-link:focus {
  transform: translateX(-50%) translateY(0);
}

Status: Compliant - Hidden until focused

5. Compliance Summary

Level A (30 criteria)

Compliant29 (97%)
To verify1 (3%)
Non-compliant0 (0%)

Level AA (20 criteria)

Compliant18 (90%)
To verify2 (10%)
Non-compliant0 (0%)

Items Requiring Manual Verification

CriterionDescriptionReason
1.4.3Contrast minimumRequires visual testing with tools
1.4.6Enhanced contrast (AAA)Requires visual testing

6. Strengths

Complete Skip Links System

  • Two working skip links
  • Appropriate CSS styles with focus animation

Fully Accessible Sliders

  • Swiper A11y module on all carousels
  • Pause/play button with ARIA states
  • Screen reader messages in Italian

Perfectly Accessible Forms

  • Labels associated with each field
  • aria-required on mandatory fields
  • Error handling with role="alert"

Robust Focus Management

  • Global :focus-visible for all elements
  • Adaptive contrast for light/dark backgrounds

Accessible Navigation

  • aria-expanded on expandable menus
  • aria-controls for logical connection
  • Descriptive aria-labels

Secure External Links

  • rel="noopener noreferrer" on all target="_blank"
  • External link indication in aria-labels

7. Detailed Assessment

AspectScoreEvaluation
Semantic structure10/10Excellent
Navigation10/10Excellent
Forms10/10Excellent
Images9/10Very Good
Sliders/Carousels10/10Excellent
Focus management10/10Excellent
ARIA implementation10/10Excellent

8. Future Recommendations

Low Priority (Optional Improvements)

  1. Color contrast testing with axe DevTools or WAVE
  2. Testing with real screen readers (NVDA, VoiceOver, JAWS)
  3. Add aria-current="page" on active page links
  4. Consider prefers-reduced-motion for animations

9. Compliance Declaration

The Oriente Occidente website is compliant with WCAG 2.1 Level AA guidelines based on source code analysis.

Excellence points:

  • Sliders with pause/play controls
  • Fully accessible forms
  • Working skip links
  • Visible focus on all elements
  • Appropriate use of ARIA

Recommended verifications:

  • Color contrast testing
  • Screen reader testing
  • Keyboard-only navigation testing

10. Feedback and Reports

To report accessibility issues or request information in alternative formats, please contact us through the following channels: