Learn by Directing AI
All materials

accessibility-audit.md

Accessibility Audit Report

Subject: Muzej Pomorske Bastine Dubrovnik -- Current Website (2016) Audited by: Adriatic Digital Accessibility Consultancy Standard: WCAG 2.1 Level AA Result: Fail -- 14 of 18 tested criteria not met


Executive Summary

The current website of the Dubrovnik Maritime Heritage Museum fails to meet WCAG 2.1 Level AA standards on 14 of 18 tested success criteria. The site is effectively unusable for visitors who rely on screen readers, keyboard navigation, or other assistive technology. A full rebuild is recommended -- retrofitting the current site would cost more than starting fresh due to the fundamental structural issues.

Key Failures

Images (WCAG 1.1.1 -- Non-text Content): 89% of images on the site have no alt text. Collection artifact images, navigation icons, and decorative images are all missing alternative text. Screen readers announce these as "image" with no description.

Heading Hierarchy (WCAG 1.3.1 -- Info and Relationships): The site uses heading elements for visual styling rather than document structure. Pages skip from h1 to h4, use multiple h1 elements, and have no logical heading hierarchy. Screen reader users cannot navigate by heading.

Color Contrast (WCAG 1.4.3 -- Contrast): The navigation menu uses light gray text (#999999) on a white background, producing a contrast ratio of 2.1:1. The minimum for normal text is 4.5:1. Body text contrast is adequate (12.6:1) but link text in the footer fails at 2.8:1.

Keyboard Navigation (WCAG 2.1.1 -- Keyboard): The site cannot be navigated by keyboard alone. The main navigation menu requires mouse hover to open dropdowns. No skip links are present. Interactive elements (gallery lightbox, search filters) are not reachable via tab.

Focus Indicators (WCAG 2.4.7 -- Focus Visible): The CSS includes outline: none on all focused elements, removing the default browser focus indicator. No custom focus indicator is provided. Keyboard users cannot see which element is currently focused.

ARIA Landmarks (WCAG 1.3.1): No ARIA landmark roles are used. The page has no <main>, <nav>, <header>, or <footer> elements. The entire page is a sequence of <div> elements with no semantic structure.

Form Labels (WCAG 1.3.1, 4.1.2): The search form uses a placeholder as its only label. The contact form has visual labels positioned near inputs but no programmatic association (no <label> elements or aria-label attributes).

Responsive Design: While not a WCAG criterion, the site uses a fixed 960px layout that does not adapt to mobile viewports. Content is cut off on screens narrower than 960px. Touch targets are too small for reliable mobile interaction.

Recommendation

A full rebuild is recommended. The current site's structural issues -- lack of semantic HTML, missing ARIA, fixed-width layout, removed focus indicators -- cannot be fixed incrementally without rewriting the HTML and CSS. A new build should use semantic HTML5 elements, implement ARIA landmarks, ensure WCAG AA color contrast throughout, provide visible focus indicators, support keyboard-only navigation, and include responsive design for mobile visitors.