2 pages tested against WCAG 2.2 level AA on 2026-11-09, using a real browser (Chromium) with automated rules, measured keyboard and layout behaviour, and an AI review of the evidence. This report lists findings with evidence and fixes. It is not a certification of compliance.
Summary
Class
Critical
Serious
Moderate
Minor
Total
Findings (detected by rules and measurements)
5
13
11
0
29
Likely issues to verify (AI review of the evidence)
3
10
6
1
20
Advisory notes
3
How to read this report. A finding was detected by a rule or a direct browser measurement and can be reproduced from the evidence shown. A likely issue was identified by an AI reviewer reading the page's structure and screenshots; each one carries its evidence and a confidence label, and should be verified by the person fixing it. Advisory notes are not failures. Severity follows the effect on users: critical blocks a task, serious makes it hard, moderate causes friction, minor is a polish item.
To pass, fix one of: Element does not have an alt attribute aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute Element's default semantics were not overridden with role="none" or role="presentation"
To pass, fix one of: Element does not have an implicit (wrapped) <label> Element does not have an explicit <label> aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute Element's default semantics were not overridden with role="none" or role="presentation"
To pass, fix one of: Element has insufficient color contrast of 3.88 (foreground color: #41545d, background color: #a9b8bf, font size: 9.8pt (13px), font weight: bold). Expected contrast ratio of 4.5:1
Evidence
2 elements affected:
tr[height="25px"]:nth-child(2) > td[bgcolor="#A9B8BF"][width="150px"] > font[color="#41545D"][size="2"] > b
<b>Free Penguins</b>
tr[height="25px"]:nth-child(7) > td[bgcolor="#A9B8BF"][width="150px"] > font[color="#41545D"][size="2"] > b
To pass, fix one of: Element is in tab order and does not have accessible text Fix any of the following: Element does not have text that is visible to screen readers aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute
To pass, fix one of: Target has insufficient size (94px by 20px, should be at least 24px by 24px) Target has insufficient space to its closest neighbors. Safe clickable space has a diameter of 16px instead of at least 24px.
Evidence
2 elements affected:
.inaccessible > .report[href$="home.html"]
<a href="./reports/home.html" class="report"><span class="hidden">Inaccessible Home Page </span> Report</a>
.accessible > .report[href$="home.html"]
<a href="../after/reports/home.html" class="report"><span class="hidden">Accessible Home Page </span> Report</a>
Selecting another option with the keyboard requested https://www.w3.org/WAI/demos/bad/offsite.html without any submit button being pressed; keyboard users stepping through the options trigger it by accident.
Fix: Act on a submit button instead, or warn before the control that it will change the page.
10 table(s) are used for layout without role="presentation", so screen readers announce table structure (1.3.1) and the reading order follows the cells rather than the visual layout (1.3.2).
Fix: Use CSS for layout; if a layout table must stay, add role="presentation".
Fix: Use <button> for actions; keep <a> for navigation.
Likely issues to verify
critical The artichoke hotline telephone number is an image of text whose alt text (1234 56789) is not the number shown; a screen-reader user gets a wrong number.
The artichoke hotline telephone number is an image of text whose alt text (1234 56789) is not the number shown; a screen-reader user gets a wrong number.
Evidence
alt='1234 56789' while the image shows the hotline number in stylised text
telefon_white_bg.gif
Fix: Replace the image with real text, or set alt to the exact number shown.
critical The main navigation links (Home, News, Tickets, Survey) remove focus as soon as they receive it (onfocus=blur) and use javascript: URLs, so keyboard users can neither see focus on them nor reliably activate them; the Tab trace skips them entirely (14 stops, none on the nav).
The main navigation links (Home, News, Tickets, Survey) remove focus as soon as they receive it (onfocus=blur) and use javascript: URLs, so keyboard users can neither see focus on them nor reliably activate them; the Tab trace skips them entirely (14 stops, none on the nav).
Evidence
onfocus=blur(); and javascript:location.href= hrefs
a[onfocus="blur();"] on the four image navigation links
Fix: Remove onfocus=blur(); use real hrefs; add visible :focus styles.
serious The site logo is a link to the home page, but its alt text is a 300-character visual description of the artwork instead of the link's purpose.
The site logo is a link to the home page, but its alt text is a 300-character visual description of the artwork instead of the link's purpose.
Evidence
alt="Red dot with a white letter 'C' that symbolizes a moon crescent as well as the sun. This logo is followed by a black banner..."
top_logo.gif
Fix: alt="CityLights home" (or "CityLights: your access to the city").
serious Visible headings (Welcome to CityLights, Elsewhere on the Web, Free Penguins, More City Parks, the three news titles) are styled text, not heading elements, so there is no heading structure to navigate.
Visible headings (Welcome to CityLights, Elsewhere on the Web, Free Penguins, More City Parks, the three news titles) are styled text, not heading elements, so there is no heading structure to navigate.
Evidence
the demo page has no h1-h6 of its own; headings are styled paragraphs and table cells
p 24px 'Welcome to CityLights'; p 20px 'Elsewhere on the Web'; td 'Free Penguins', 'More City Parks'
Fix: Use h1 for 'Welcome to CityLights' and h2/h3 for the section and teaser titles; style with CSS.
serious Links read 'Click here' and 'Read More...' with no indication of the destination; two 'Read More...' links go to different pages, and the three 'MORE' arrow links have empty alt so they have no name at all.
Links read 'Click here' and 'Read More...' with no indication of the destination; two 'Read More...' links go to different pages, and the three 'MORE' arrow links have empty alt so they have no name at all.
Evidence
same link text, different targets; generic text
'Click here' x2 -> ../offsite.html; 'Read More...' -> tickets.html and survey.html; 'MORE' image links with alt=''
Fix: Make link text describe the target ('Read more about Free Penguins'), or add visually hidden text.
serious The QUICKMENU select navigates away as soon as a value is chosen, which keyboard users trigger by arrowing through options, and it has no accessible label.
The QUICKMENU select navigates away as soon as a value is chosen, which keyboard users trigger by arrowing through options, and it has no accessible label.
Evidence
QUICKMENU ----> navigates on change; no Go button; no label
select[onchange="location.href = this.value;"] with no label
Fix: Add a label and a Go button; navigate on submit, not on change.
moderate The 'Elsewhere on the Web' items are a visual list made of bullet images and text, not list markup, so assistive technology cannot announce it as a list of two items.
The 'Elsewhere on the Web' items are a visual list made of bullet images and text, not list markup, so assistive technology cannot announce it as a list of two items.
Evidence
two items presented with bullet images and line breaks, no ul/li
moderate The layout is nested tables; the DOM order (quick menu, spacer cells, logo, then content) does not match the visual reading order, so a linear reading is confusing.
The layout is nested tables; the DOM order (quick menu, spacer cells, logo, then content) does not match the visual reading order, so a linear reading is confusing.
Evidence
reading order: 'QUICKMENU' select cell (x=0,y=200) and empty spacer cells precede the logo (250,210), the traffic line and the main content
nested layout tables
Fix: Replace layout tables with CSS layout in reading order: header, navigation, main content, sidebar.
moderate Several in-text links are shown by colour alone with no underline or other cue, so people who cannot perceive the colour difference cannot find them.
Several in-text links are shown by colour alone with no underline or other cue, so people who cannot perceive the colour difference cannot find them.
Evidence
teaser links in grey boxes distinguished by colour only
in-text links: 14 of 46 not underlined (structure.linksNotUnderlined)
Fix: Underline links in running text or add a non-colour cue; keep a 3:1 contrast with surrounding text.
moderate The page itself offers no skip link or landmarks, so keyboard and screen-reader users must pass the quick menu and all navigation on every page.
To pass, fix one of: Element does not have an alt attribute aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute Element's default semantics were not overridden with role="none" or role="presentation"
To pass, fix one of: Element does not have an implicit (wrapped) <label> Element does not have an explicit <label> aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute Element has no placeholder attribute Element's default semantics were not overridden with role="none" or role="presentation"
To pass, fix one of: Element does not have an implicit (wrapped) <label> Element does not have an explicit <label> aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute Element's default semantics were not overridden with role="none" or role="presentation"
To pass, fix one of: Element is in tab order and does not have accessible text Fix any of the following: Element does not have text that is visible to screen readers aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute
To pass, fix one of: Target has insufficient size (94px by 20px, should be at least 24px by 24px) Target has insufficient space to its closest neighbors. Safe clickable space has a diameter of 16px instead of at least 24px.
Selecting another option with the keyboard requested https://www.w3.org/WAI/demos/bad/offsite.html without any submit button being pressed; keyboard users stepping through the options trigger it by accident.
Fix: Act on a submit button instead, or warn before the control that it will change the page.
23 table(s) are used for layout without role="presentation", so screen readers announce table structure (1.3.1) and the reading order follows the cells rather than the visual layout (1.3.2).
Fix: Use CSS for layout; if a layout table must stay, add role="presentation".
Image navigation links blur on focus and use javascript: URLs.
Evidence
image navigation not in the tab sequence
a[onfocus="blur();"] x4
Fix: Remove onfocus=blur(); real hrefs; :focus styles.
serious The newsletter form gives no instructions: nothing says which fields are required or what format is expected, and the texts 'eMail Address' and 'Retype eMail' appear under the boxes without being associated to them, so a screen-reader user hears unlabelled text fields.
The newsletter form gives no instructions: nothing says which fields are required or what format is expected, and the texts 'eMail Address' and 'Retype eMail' appear under the boxes without being associated to them, so a screen-reader user hears unlabelled text fields.
Evidence
no instructions on which fields are required, what format the e-mail needs, or that the two e-mail fields must match; 'eMail Address' and 'Retype eMail' texts sit below their boxes with no for/id
inputs em, n, ev (text), radios t (Mr./Mrs.), submit
Fix: Use label for= each input, put labels before the fields, mark required fields in text, and say the e-mail must be typed twice.
serious The radio button groups have no fieldset/legend, so the question each group answers is not announced with the buttons, and the six park options are not exposed as one group.
The radio button groups have no fieldset/legend, so the question each group answers is not announced with the buttons, and the six park options are not exposed as one group.
Evidence
the question 'Which is your favorite city park?' is a bold cell, not a legend; six radios share a name but no fieldset
radio groups name=res (6 options) and name=t (2 options); fieldsets: 0
Fix: <fieldset><legend>Which is your favorite city park?</legend> ... </fieldset> and the same for Mr./Mrs.
serious The city select has no label; its only hint is a placeholder option 'select a city ----->' and a bold question in a separate cell, and a list of roughly 200 cities with no grouping.
The city select has no label; its only hint is a placeholder option 'select a city ----->' and a bold question in a separate cell, and a list of roughly 200 cities with no grouping.
Evidence
the question 'Which city do you find is the greenest?' is a bold cell above, not a label
select name=cc; first option 'select a city ----->'; no label; axe select-name
Fix: Add label for= the select; group options with optgroup by region.
serious The quick menu jumps to a new page as soon as a keyboard user arrows to an option, and the city select is a single ungrouped list of about 200 entries, so both are hard or impossible to use by keyboard alone.
The quick menu jumps to a new page as soon as a keyboard user arrows to an option, and the city select is a single ungrouped list of about 200 entries, so both are hard or impossible to use by keyboard alone.
Evidence
navigation on change; very long select
select[onchange="location.href = this.value;"] (QUICKMENU); select name=cc with ~200 ungrouped options
Fix: Navigate on an explicit Go button; group cities with optgroup.
serious The form is laid out with nested tables: the e-mail field names come after the boxes, and the park options read across the two columns (None, Jurassic Park, Central Park, South Park, ...) rather than down, so the sequence read by assistive technology is not the one a sighted user sees.
The form is laid out with nested tables: the e-mail field names come after the boxes, and the park options read across the two columns (None, Jurassic Park, Central Park, South Park, ...) rather than down, so the sequence read by assistive technology is not the one a sighted user sees.
Evidence
reading order of the form does not match the visual order
23 layout tables; 'eMail Address' / 'Retype eMail' texts follow their inputs in DOM order; park options in two columns of a table (DOM order None, Jurassic Park, Central Park, South Park...)
Fix: Drop the layout tables; one label-before-field per line; a single list of options.
serious The page's headings are styled paragraphs, not h1-h3.
moderate The results table's question is not its caption, the row labels 'love it'/'hate it' and column labels are bold cells rather than headers, and empty cells stand for zero, so the relationships between organs and votes are not available to assistive technology.
The results table's question is not its caption, the row labels 'love it'/'hate it' and column labels are bold cells rather than headers, and empty cells stand for zero, so the relationships between organs and votes are not available to assistive technology.
Evidence
question is a bold paragraph, not a caption; empty cells carry no value
results table 'What is your favorite and least favorite organ?'; row labels 'love it' / 'hate it' bold cells; empty cells for zero
Fix: Use caption, th scope=col/row, and put 0 in empty cells.
moderate No skip link or landmarks on the page itself.
3 paragraph(s) have a line height under 1.2 times the font size.
Fix: Set line-height to at least 1.5 for body text.
Method, coverage and limits
Method. Each page was loaded in headless Chromium at 1280 px, 640 px and 320 px. Automated rules: axe-core 4.14 (WCAG 2.0/2.1/2.2 A and AA tags). Measurements: Tab-order trace with computed focus styles, horizontal overflow at 320 px, heading and landmark structure, table and list structure, form labelling, link text, event handlers, document language and title. Interaction probes: drop-down menus compared on hover versus keyboard focus; buttons and pop-up triggers activated with Enter, then checked for focus movement, Tab containment, Escape and a dialog role; where ordered, forms submitted empty to observe how errors are shown and announced. AI review: a reviewer model read the extracted structure (links, images and their alt text, form fields, text blocks with font metrics, reading order, handlers) and the screenshots, and reported likely issues with evidence and a confidence label.
Interaction probes. Page 1: 0 drop-down menus tested for hover-only behaviour, 2 controls activated with Enter (0 opened a pop-up, checked for focus, Escape and role), 0 form(s) submitted empty to observe validation; 1 select, radio or check-box control(s) changed to see whether they submit or navigate. Page 2: 0 drop-down menus tested for hover-only behaviour, 5 controls activated with Enter (0 opened a pop-up, checked for focus, Escape and role), 1 form(s) submitted empty to observe validation (1 navigated to another page on submit: the server handled validation, so the error messages were not observed); 4 select, radio or check-box control(s) changed to see whether they submit or navigate.
Coverage. Automated rules alone find roughly a fifth to a half of real accessibility defects; this audit adds measured keyboard and layout checks and a structured review of the rest. It does not include testing with a screen reader or by people with disabilities, does not test content behind logins or after form submission unless listed above, and reflects the pages as captured on the date shown.
What this report is not. It is not a legal opinion and not a certification that the site conforms to WCAG or to any law. Fixing every item here will remove the defects found; it does not guarantee that no others exist.
Accessibility statement (draft)
[Organisation] is committed to making [site] accessible to everyone. We aim to meet WCAG 2.2 level AA. An audit of [N] pages on 2026-11-09 found [X] issues, which we are fixing; the items still open are listed at [link]. If you have difficulty using any part of this site, contact [email / phone] and we will provide the content in another form. This statement was updated on 2026-11-09.
