Accessibility Scan Report

Title: Barcelona.cat Issue: #62 Date: 3/11/2026, 12:59:07 AM Duration: 7.4m URLs: 100 / 100

Summary

Total Issues

3043

Across 43 unique rules

By Severity

Critical
Serious
Moderate
Minor

By Role

UX Designer
Visual Designer
Content Author
Front-End Developer

Issues

🎯 Priority: Pages with Most Errors

Focus your efforts on these pages to make the biggest impact. Click any error count to filter the rule list below.

Page axe UniqueALFA UniqueEqual Access UniqueAccessLint UniqueQualWeb Unique Total Unique
View Page https://www.barcelona.cat/en/what-to-do-in-bcn/festes-majors 00 0 78
View Page https://www.barcelona.cat/en/what-to-do-in-bcn/summer/outdoor-films 00 0 78
View Page https://www.barcelona.cat/en/what-to-do-in-bcn/montjuic-park/activities/list 00 0 78
View Page https://www.barcelona.cat/ca/que-pots-fer-a-bcn/llistat 00 0 78
View Page Implica't | Barcelona.cat | Ajuntament de Barcelona 00 0 70
View Page Treball i empresa | Barcelona.cat | Ajuntament de Barcelona 00 0 68
View Page Què es pot fer a Barcelona | Barcelona.cat | Ajuntament de Barcelona 00 0 56
View Page El portal web oficial de Barcelona | Ajuntament de Barcelona 00 0 53
View Page El portal web oficial de Barcelona | Ajuntament de Barcelona 00 0 53
View Page The official Barcelona website | Barcelona City Council 00 0 53

🔧 Priority: Most Common Issues (axe)

24 rules
1814 Moderate axe region:
89 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
All page content should be contained by landmarks
Mode: light
<a href="#carousel-capcalera" class="visually-hidden focusable to-main-content" tabindex="1"> Vés al contingut </a>
XPath: .focusable
Example 2 View on Page
All page content should be contained by landmarks
Mode: light
<li>
XPath: #ajuntament--prefooter > .container > ul > li:nth-child(1)
Example 3 View on Page
All page content should be contained by landmarks
Mode: light
<h2>Adreces</h2>
XPath: li:nth-child(2) > h2
Example 4 View on Page
All page content should be contained by landmarks
Mode: light
<p>
XPath: li:nth-child(2) > .llistat > li > p
Example 5 View on Page
All page content should be contained by landmarks
Mode: light
<h2>Contacte</h2>
XPath: li:nth-child(3) > h2
265 Serious axe tabindex:
89 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: ⚠️ Yes (Task-Blocking)

Affected Pages

Examples

Example 1 View on Page
Elements should not have tabindex greater than zero
Mode: light
<a href="#carousel-capcalera" class="visually-hidden focusable to-main-content" tabindex="1"> Vés al contingut </a>
XPath: .focusable
Example 2 View on Page
Elements should not have tabindex greater than zero
Mode: light
<a href="#main-content" class="visually-hidden focusable to-main-content" tabindex="1"> Skip to main content </a>
XPath: .focusable
Example 3 View on Page
Elements should not have tabindex greater than zero
Mode: light
<a href="#main-content" class="visually-hidden focusable to-main-content" tabindex="1"> Skip to main content </a>
XPath: .focusable
Example 4 View on Page
Elements should not have tabindex greater than zero
Mode: light
<a href="#main-content" class="visually-hidden focusable to-main-content" tabindex="1"> Skip to main content </a>
XPath: .focusable
Example 5 View on Page
Elements should not have tabindex greater than zero
Mode: light
<a href="#carousel-capcalera" class="visually-hidden focusable to-main-content" tabindex="1"> Vés al contingut </a>
XPath: .focusable
89 Moderate axe landmark-no-duplicate-banner:
89 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Document should not have more than one banner landmark
Mode: light
<header id="brand" alias="barcelonacat" brand="barcelonacat_2025-12..." class="v2025 bcnbrand-legac..." data-lwid="19e3126d-e1c9-4f40-9..." data-plausible="bcn0657" data-matomo="beOBY9ep" data-avisos="auto" data-web-cerca="https%3A%2F%2Fwww.ba..." data-web-nom="Barcelona" data-cercador="false">
XPath: #brand
Example 2 View on Page
Document should not have more than one banner landmark
Mode: light
<header id="brand" alias="barcelonacat" brand="barcelonacat_2025-12..." class="v2025 bcnbrand-legac..." data-lwid="19e3126d-e1c9-4f40-9..." data-plausible="bcn0657" data-matomo="beOBY9ep" data-avisos="auto" data-web-cerca="https%3A%2F%2Fwww.ba..." data-web-nom="Barcelona" data-cercador="false">
XPath: #brand
Example 3 View on Page
Document should not have more than one banner landmark
Mode: light
<header id="brand" alias="barcelonacat" brand="barcelonacat_2025-12..." class="v2025 bcnbrand-legac..." data-lwid="19e3126d-e1c9-4f40-9..." data-plausible="bcn0657" data-matomo="beOBY9ep" data-avisos="auto" data-web-cerca="https%3A%2F%2Fwww.ba..." data-web-nom="Barcelona" data-cercador="false">
XPath: #brand
Example 4 View on Page
Document should not have more than one banner landmark
Mode: light
<header id="brand" alias="barcelonacat" brand="barcelonacat_2025-12..." class="v2025 bcnbrand-legac..." data-lwid="19e3126d-e1c9-4f40-9..." data-plausible="bcn0657" data-matomo="beOBY9ep" data-avisos="auto" data-web-cerca="https%3A%2F%2Fwww.ba..." data-web-nom="Barcelona" data-cercador="false">
XPath: #brand
Example 5 View on Page
Document should not have more than one banner landmark
Mode: light
<header id="brand" alias="barcelonacat" brand="barcelonacat_2025-12..." class="v2025 bcnbrand-legac..." data-lwid="19e3126d-e1c9-4f40-9..." data-plausible="bcn0657" data-matomo="beOBY9ep" data-avisos="auto" data-web-cerca="https%3A%2F%2Fwww.ba..." data-web-nom="Barcelona" data-cercador="false">
XPath: #brand
76 Serious axe color-contrast:
19 pages affected

Examples

Example 1 View on Page
Elements must meet minimum color contrast ratio thresholds
Mode: light
<a target="_blank" href="../ca/">Plànol</a>
XPath: #iframe-planol
Example 2 View on Page
Elements must meet minimum color contrast ratio thresholds
Mode: light
<a target="_blank" href="../ca/">Plànol</a>
XPath: #iframe-planol
Example 3 View on Page
Elements must meet minimum color contrast ratio thresholds
Mode: light
<a target="_blank" href="../en/">Barcelona map</a>
XPath: #planol-screen > iframe
Example 4 View on Page
Elements must meet minimum color contrast ratio thresholds
Mode: light
<a target="_blank" href="../es/">Plano</a>
XPath: #planol-screen > iframe
Example 5 View on Page
Elements must meet minimum color contrast ratio thresholds
Mode: light
<p>Informa’t i participa en les iniciatives i entitats que contribueixen a construir una economia social i solidària a Barcelona. Estigues al dia de tota l’actualitat!</p>
XPath: .item-destacat.img_petita.col-md-3:nth-child(6) > .box-destacat > .content-box > .box-info > p
69 Critical axe image-alt:
69 pages affected

Rule Information

Engine: axe

Roles: Content Author

Blocking: ⚠️ Yes (Task-Blocking)

Affected Pages

Examples

Example 1 View on Page
Images must have alternative text
Mode: light
<img src="/images/icons/marker.svg" class="img-marker">
XPath: iframe[height="410px"]
Example 2 View on Page
Images must have alternative text
Mode: light
<img src="/themes/barcelonacat_theme/images/menu/fletxa_1.png">
XPath: .menu-0 > .icona > img
Example 3 View on Page
Images must have alternative text
Mode: light
<img src="/themes/barcelonacat_theme/images/menu/fletxa_3.png">
XPath: .menu-2 > .icona > img
Example 4 View on Page
Images must have alternative text
Mode: light
<img src="/themes/barcelonacat_theme/images/menu/fletxa_3.png">
XPath: .menu-2 > .icona > img
Example 5 View on Page
Images must have alternative text
Mode: light
<img src="/images/icons/marker.svg" class="img-marker">
XPath: iframe[height="410px"]
20 Moderate axe aria-required-children:
20 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Certain ARIA roles must contain particular children
Mode: light
<div role="menu" class="container list-pano-rollover">
XPath: .list-pano-rollover
Example 2 View on Page
Certain ARIA roles must contain particular children
Mode: light
<div role="menu" class="container list-pano-rollover">
XPath: .list-pano-rollover
Example 3 View on Page
Certain ARIA roles must contain particular children
Mode: light
<div role="menu" class="container list-pano-rollover">
XPath: .list-pano-rollover
Example 4 View on Page
Certain ARIA roles must contain particular children
Mode: light
<div role="menu" class="container list-pano-rollover">
XPath: .list-pano-rollover
Example 5 View on Page
Certain ARIA roles must contain particular children
Mode: light
<div role="menu" class="container list-pano-rollover">
XPath: .list-pano-rollover
14 Moderate axe aria-allowed-role:
8 pages affected

Examples

Example 1 View on Page
ARIA role should be appropriate for the element
Mode: light
<ul class="banners-paginats-list slick-initialized slick-slider" role="region" aria-label="carousel">
XPath: .banners-paginats-list
Example 2 View on Page
ARIA role should be appropriate for the element
Mode: light
<form class="d-flex justify-content-md-between align-items-md-center ajuntament-actualitat-filtres" role="region" aria-label="News list dates and number of results per page control" aria-controls="ajuntament-actualitat-noticies">
XPath: .justify-content-md-between
Example 3 View on Page
ARIA role should be appropriate for the element
Mode: light
<h3 class="sr-only" role="status">Showing <span>10</span> results.</h3>
XPath: h3
Example 4 View on Page
ARIA role should be appropriate for the element
Mode: light
<legend aria-expanded="false" role="button" tabindex="0" class="ajuntament-maps-legend">Districts <span aria-hidden="true" title="Desplegar districtes" class="icobcn-fletxa-baix2-l"></span> </legend>
XPath: fieldset:nth-child(1) > legend
Example 5 View on Page
ARIA role should be appropriate for the element
Mode: light
<legend aria-expanded="false" role="button" tabindex="0" class="ajuntament-maps-legend">Categories <span aria-hidden="true" title="Desplegar grup" class="icobcn-fletxa-baix2-l"></span> </legend>
XPath: fieldset:nth-child(2) > legend
12 Moderate axe landmark-unique:
4 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Landmarks should have a unique role or role/label/title (i.e. accessible name) combination
Mode: light
<div class="llistat-bg-promos slick-initialized slick-slider slick-dotted" role="region" aria-label="carousel">
XPath: .llistat-bg-promos
Example 2 View on Page
Landmarks should have a unique role or role/label/title (i.e. accessible name) combination
Mode: light
<main id="main-content" role="main">
XPath: #main-content
Example 3 View on Page
Landmarks should have a unique role or role/label/title (i.e. accessible name) combination
Mode: light
<nav class="js-main-search">
XPath: #iframe-planol
Example 4 View on Page
Landmarks should have a unique role or role/label/title (i.e. accessible name) combination
Mode: light
<div class="llistat-bg-promos slick-initialized slick-slider slick-dotted" role="region" aria-label="carousel">
XPath: .llistat-bg-promos
Example 5 View on Page
Landmarks should have a unique role or role/label/title (i.e. accessible name) combination
Mode: light
<main id="main-content" role="main">
XPath: #main-content
11 Moderate axe landmark-one-main:
11 pages affected

Examples

Example 1 View on Page
Document should have one main landmark
Mode: light
<html lang="es" dir="ltr" prefix="og: https://ogp.me/ns#">
XPath: html
Example 2 View on Page
Document should have one main landmark
Mode: light
<html lang="ca" dir="ltr" prefix="og: https://ogp.me/ns#">
XPath: html
Example 3 View on Page
Document should have one main landmark
Mode: light
<html lang="ca" dir="ltr" prefix="og: https://ogp.me/ns#">
XPath: html
Example 4 View on Page
Document should have one main landmark
Mode: light
<html lang="es" dir="ltr" prefix="og: https://ogp.me/ns#">
XPath: html
Example 5 View on Page
Document should have one main landmark
Mode: light
<html lang="en" dir="ltr" prefix="og: https://ogp.me/ns#">
XPath: html
11 Moderate axe page-has-heading-one:
11 pages affected

Examples

Example 1 View on Page
Page should contain a level-one heading
Mode: light
<html lang="es" dir="ltr" prefix="og: https://ogp.me/ns#">
XPath: html
Example 2 View on Page
Page should contain a level-one heading
Mode: light
<html lang="ca" dir="ltr" prefix="og: https://ogp.me/ns#">
XPath: html
Example 3 View on Page
Page should contain a level-one heading
Mode: light
<html lang="ca" dir="ltr" prefix="og: https://ogp.me/ns#">
XPath: html
Example 4 View on Page
Page should contain a level-one heading
Mode: light
<html lang="es" dir="ltr" prefix="og: https://ogp.me/ns#">
XPath: html
Example 5 View on Page
Page should contain a level-one heading
Mode: light
<html lang="en" dir="ltr" prefix="og: https://ogp.me/ns#">
XPath: html
10 Serious axe frame-title:
6 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer, Content Author

Blocking: No

Examples

Example 1 View on Page
Frames must have an accessible name
Mode: light
<iframe frameborder="0" height="88px" src="https://ajuntament.barcelona.cat/widgets/temps/v3/?lang=ca" width="142px" id="i-temps"></iframe>
XPath: #i-temps
Example 2 View on Page
Frames must have an accessible name
Mode: light
<iframe frameborder="0" height="410px" src="https://com-shi-va.barcelona.cat/ca/api/widget/route" width="100%"></iframe>
XPath: iframe[height="410px"]
Example 3 View on Page
Frames must have an accessible name
Mode: light
<iframe frameborder="0" height="88px" src="https://ajuntament.barcelona.cat/widgets/temps/v3/?lang=ca" width="142px" id="i-temps"></iframe>
XPath: #i-temps
Example 4 View on Page
Frames must have an accessible name
Mode: light
<iframe frameborder="0" height="410px" src="https://com-shi-va.barcelona.cat/ca/api/widget/route" width="100%"></iframe>
XPath: iframe[height="410px"]
Example 5 View on Page
Frames must have an accessible name
Mode: light
<iframe frameborder="0" height="88px" src="https://ajuntament.barcelona.cat/widgets/temps/v3/?lang=en" width="142px" id="i-temps"></iframe>
XPath: #i-temps
4 Moderate axe aria-progressbar-name:
4 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
ARIA progressbar nodes must have an accessible name
Mode: light
<div id="progressbar-carousel-capcalera" class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="25" style="background-size: 25% 100%;"> <span class="slider__label sr-only">25% completed</span> </div>
XPath: #progressbar-carousel-capcalera
Example 2 View on Page
ARIA progressbar nodes must have an accessible name
Mode: light
<div id="progressbar-carousel-capcalera" class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="25" style="background-size: 25% 100%;"> <span class="slider__label sr-only">25% completed</span> </div>
XPath: #progressbar-carousel-capcalera
Example 3 View on Page
ARIA progressbar nodes must have an accessible name
Mode: light
<div id="progressbar-carousel-capcalera" class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="25" style="background-size: 25% 100%;"> <span class="slider__label sr-only">25% completed</span> </div>
XPath: #progressbar-carousel-capcalera
Example 4 View on Page
ARIA progressbar nodes must have an accessible name
Mode: light
<div id="progressbar-carousel-capcalera" class="progress" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="25" style="background-size: 25% 100%;"> <span class="slider__label sr-only">25% completed</span> </div>
XPath: #progressbar-carousel-capcalera
4 Moderate axe aria-prohibited-attr:
4 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Elements must only use permitted ARIA attributes
Mode: light
<span tabindex="0" class="qualitat-aire-anterior bcn-disabled" aria-label="Anterior"> <i aria-hidden="true" title="Anterior" class="bcn-disabled"></i> </span>
XPath: #qualitat-aire-i
Example 2 View on Page
Elements must only use permitted ARIA attributes
Mode: light
<span tabindex="0" class="qualitat-aire-anterior bcn-disabled" aria-label="Anterior"> <i aria-hidden="true" title="Anterior" class="bcn-disabled"></i> </span>
XPath: #qualitat-aire-i
Example 3 View on Page
Elements must only use permitted ARIA attributes
Mode: light
<span tabindex="0" class="qualitat-aire-anterior bcn-disabled" aria-label="Previous"> <i aria-hidden="true" title="Previous" class="bcn-disabled"></i> </span>
XPath: #qualitat-aire-i
Example 4 View on Page
Elements must only use permitted ARIA attributes
Mode: light
<span tabindex="0" class="qualitat-aire-anterior bcn-disabled" aria-label="Previo"> <i aria-hidden="true" title="Previo" class="bcn-disabled"></i> </span>
XPath: #qualitat-aire-i
4 Critical axe button-name:
4 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer, Content Author

Blocking: ⚠️ Yes (Task-Blocking)

Affected Pages

Examples

Example 1 View on Page
Buttons must have discernible text
Mode: light
<button class="geoLocation"></button>
XPath: #iframe-planol
Example 2 View on Page
Buttons must have discernible text
Mode: light
<button class="geoLocation"></button>
XPath: #iframe-planol
Example 3 View on Page
Buttons must have discernible text
Mode: light
<button class="geoLocation"></button>
XPath: #planol-screen > iframe
Example 4 View on Page
Buttons must have discernible text
Mode: light
<button class="geoLocation"></button>
XPath: #planol-screen > iframe
4 Moderate axe html-lang-valid:
4 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
<html> element must have a valid value for the lang attribute
Mode: light
<html lang="cat" class=" js no-touch geolocation borderimage borderradius textshadow opacity cssgradients svg svgclippaths">
XPath: #iframe-planol
Example 2 View on Page
<html> element must have a valid value for the lang attribute
Mode: light
<html lang="cat" class=" js no-touch geolocation borderimage borderradius textshadow opacity cssgradients svg svgclippaths">
XPath: #iframe-planol
Example 3 View on Page
<html> element must have a valid value for the lang attribute
Mode: light
<html lang="cat" class=" js no-touch geolocation borderimage borderradius textshadow opacity cssgradients svg svgclippaths">
XPath: #planol-screen > iframe
Example 4 View on Page
<html> element must have a valid value for the lang attribute
Mode: light
<html lang="cat" class=" js no-touch geolocation borderimage borderradius textshadow opacity cssgradients svg svgclippaths">
XPath: #planol-screen > iframe
4 Serious axe listitem:
1 pages affected

Rule Information

Engine: axe

Roles: Content Author, Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
<li> elements must be contained in a <ul> or <ol>
Mode: light
<li class="banner-item box-banner" style="width: 100%; display: inline-block;">
XPath: .slick-current > div > .banner-item.box-banner
Example 2 View on Page
<li> elements must be contained in a <ul> or <ol>
Mode: light
<li class="banner-item box-banner" style="width: 100%; display: inline-block;">
XPath: div[data-slick-index="1"] > div > .banner-item.box-banner
Example 3 View on Page
<li> elements must be contained in a <ul> or <ol>
Mode: light
<li class="banner-item box-banner" style="width: 100%; display: inline-block;">
XPath: div[data-slick-index="2"] > div > .banner-item.box-banner
Example 4 View on Page
<li> elements must be contained in a <ul> or <ol>
Mode: light
<li class="banner-item box-banner" style="width: 100%; display: inline-block;">
XPath: div[data-slick-index="3"] > div > .banner-item.box-banner
2 Moderate axe image-redundant-alt:
2 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
Alternative text of images should not be repeated as text
Mode: light
<img loading="lazy" src="/sites/default/files/styles/distribuidora_banner_paginat/public/vedebcn_250x250.jpg?itok=sI_-hMsI" width="250" height="250" alt="ve de barcelona">
XPath: img[alt="ve de barcelona"]
Example 2 View on Page
Alternative text of images should not be repeated as text
Mode: light
<img src="img/districte_1.jpg" alt="Ciutat Vella">
XPath: #fembarri
2 Moderate axe aria-command-name:
2 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
ARIA commands must have an accessible name
Mode: light
<div class="title" tabindex="-1" role="button"></div>
XPath: #fembarri
Example 2 View on Page
ARIA commands must have an accessible name
Mode: light
<div title="" role="button" tabindex="0" style="width: 31.7193px; height: 32px; overflow: hidden; position: absolute; cursor: pointer; touch-action: none; left: -78px; top: 24px; z-index: 0;">
XPath: iframe[frameborder="0"]
2 Moderate axe empty-table-header:
1 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
Table header text should not be empty
Mode: light
<th scope="col"></th>
XPath: th:nth-child(1)
Example 2 View on Page
Table header text should not be empty
Mode: light
<th scope="col"></th>
XPath: th:nth-child(4)
1 Critical axe area-alt:
1 pages affected

Rule Information

Engine: axe

Roles: Content Author, UX Designer

Blocking: ⚠️ Yes (Task-Blocking)

Examples

Example 1 View on Page
Active <area> elements must have alternative text
Mode: light
<area shape="poly" alt="" coords="1157,999, 1166,1000,..." href="#" districte="1">
XPath: #fembarri
1 Serious axe list:
1 pages affected

Rule Information

Engine: axe

Roles: Content Author, Front-End Developer

Blocking: No

Examples

Example 1 View on Page
<ul> and <ol> must only directly contain <li>, <script> or <template> elements
Mode: light
<ul class="districtes_menu">
XPath: #fembarri
1 Moderate axe empty-heading:
1 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
Headings should not be empty
Mode: light
<h3 dir="ltr">&nbsp;</h3>
XPath: h3:nth-child(3)
1 Serious axe aria-hidden-focus:
1 pages affected

Rule Information

Engine: axe

Roles: Front-End Developer

Blocking: ⚠️ Yes (Task-Blocking)

Affected Pages

Examples

Example 1 View on Page
ARIA hidden element must not be focusable or contain focusable elements
Mode: light
<div aria-hidden="true" id="ajuntament-maps" data-lat="41.3850640" data-lon="2.1734030" data-zoom="13" aria-live="polite" role="region" aria-label="Map of entities">
XPath: #ajuntament-maps

🔧 Priority: Most Common Issues (AccessLint)

19 rules
102 Moderate accesslint text-alternatives/img-alt:
17 pages affected

Examples

Example 1 View on Page
Image element missing alt attribute.
Mode: light
<img src="/themes/barcelonacat_theme/images/menu/fletxa_1.png">
XPath: li:nth-of-type(1) > div:nth-of-type(1) > img
Example 2 View on Page
Image element missing alt attribute.
Mode: light
<img src="/themes/barcelonacat_theme/images/menu/fletxa_2.png">
XPath: li:nth-of-type(2) > div:nth-of-type(1) > img
Example 3 View on Page
Image element missing alt attribute.
Mode: light
<img src="/themes/barcelonacat_theme/images/menu/fletxa_3.png">
XPath: li:nth-of-type(3) > div:nth-of-type(1) > img
Example 4 View on Page
Image element missing alt attribute.
Mode: light
<img src="/themes/barcelonacat_theme/images/menu/fletxa_4.png">
XPath: li:nth-of-type(4) > div:nth-of-type(1) > img
Example 5 View on Page
Image element missing alt attribute.
Mode: light
<img src="/themes/barcelonacat_theme/images/menu/fletxa_5.png">
XPath: li:nth-of-type(5) > div:nth-of-type(1) > img
83 Moderate accesslint navigable/document-title:
83 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Document <title> element is empty.
Mode: light
<html>
XPath: html
Example 2 View on Page
Document <title> element is empty.
Mode: light
<html>
XPath: html
Example 3 View on Page
Document <title> element is empty.
Mode: light
<html>
XPath: html
Example 4 View on Page
Document <title> element is empty.
Mode: light
<html>
XPath: html
Example 5 View on Page
Document <title> element is empty.
Mode: light
<html>
XPath: html
83 Moderate accesslint navigable/bypass:
83 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Page has no mechanism to bypass repeated content. Add a <main> landmark or skip link.
Mode: light
<html>
XPath: html
Example 2 View on Page
Page has no mechanism to bypass repeated content. Add a <main> landmark or skip link.
Mode: light
<html>
XPath: html
Example 3 View on Page
Page has no mechanism to bypass repeated content. Add a <main> landmark or skip link.
Mode: light
<html>
XPath: html
Example 4 View on Page
Page has no mechanism to bypass repeated content. Add a <main> landmark or skip link.
Mode: light
<html>
XPath: html
Example 5 View on Page
Page has no mechanism to bypass repeated content. Add a <main> landmark or skip link.
Mode: light
<html>
XPath: html
83 Moderate accesslint navigable/page-has-heading-one:
83 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Page does not contain a level-one heading.
Mode: light
<html>
XPath: html
Example 2 View on Page
Page does not contain a level-one heading.
Mode: light
<html>
XPath: html
Example 3 View on Page
Page does not contain a level-one heading.
Mode: light
<html>
XPath: html
Example 4 View on Page
Page does not contain a level-one heading.
Mode: light
<html>
XPath: html
Example 5 View on Page
Page does not contain a level-one heading.
Mode: light
<html>
XPath: html
83 Moderate accesslint landmarks/landmark-main:
83 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Page has no main landmark.
Mode: light
<html>
XPath: html
Example 2 View on Page
Page has no main landmark.
Mode: light
<html>
XPath: html
Example 3 View on Page
Page has no main landmark.
Mode: light
<html>
XPath: html
Example 4 View on Page
Page has no main landmark.
Mode: light
<html>
XPath: html
Example 5 View on Page
Page has no main landmark.
Mode: light
<html>
XPath: html
40 Moderate accesslint keyboard-accessible/focus-order:
6 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Non-interactive <div> with tabindex="0" has no interactive role.
Mode: light
<div data-history-node-id="24584" class="item promo img-quadrada" data-value="1" style="width: 100%; display: inline-block;" tabindex="0"> <div class="content-promo"> <h2> Borses...
XPath: #node-24580 > div[aria-label="carousel"] > div > div > div[aria-label="slide 1"] > div > div
Example 2 View on Page
Non-interactive <div> with tabindex="0" has no interactive role.
Mode: light
<div data-history-node-id="24584" class="item promo img-quadrada" data-value="1" style="width: 100%; display: inline-block;" tabindex="0"> <div class="content-promo"> <h2> Borses...
XPath: #node-24580 > div[aria-label="carousel"] > div > div > div[aria-label="slide 1"] > div > div
Example 3 View on Page
Non-interactive <div> with tabindex="0" has no interactive role.
Mode: light
<div data-history-node-id="24584" class="item promo img-quadrada" data-value="1" style="width: 100%; display: inline-block;" tabindex="0"> <div class="content-promo"> <h2> Employ...
XPath: #node-24580 > div[aria-label="carousel"] > div > div > div[aria-label="slide 1"] > div > div
Example 4 View on Page
Non-interactive <div> with tabindex="0" has no interactive role.
Mode: light
<div data-history-node-id="24584" class="item promo img-quadrada" data-value="1" style="width: 100%; display: inline-block;" tabindex="0"> <div class="content-promo"> <h2> Bolsas...
XPath: #node-24580 > div[aria-label="carousel"] > div > div > div[aria-label="slide 1"] > div > div
Example 5 View on Page
Non-interactive <div> with tabindex="0" has no interactive role.
Mode: light
<div class="masonry-text" tabindex="0"> <h3>Fàbriques de creació</h3> <div class="masonry-description">Aprofita els espais que et permetran potenciar la teva creativi...
XPath: #innova-i-crea > div:nth-of-type(2) > div:nth-of-type(1) > div > div
25 Moderate accesslint distinguishable/color-contrast:
3 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
Insufficient color contrast ratio of 4.25:1 (required 4.5:1).
Mode: light
<div class="descripcio">Information on resources for balancing care work with employment and personal life, aimed at caregivers.</div>
XPath: #family > div > div > div:nth-of-type(2) > div:nth-of-type(3) > div > div
Example 2 View on Page
Insufficient color contrast ratio of 4.31:1 (required 4.5:1).
Mode: light
<div class="descripcio">Service fostering quality free time among children, teenagers, young people and adults with disabilities, as well as promoting the work-life balance of families. It offers free...
XPath: #family > div > div > div:nth-of-type(2) > div:nth-of-type(4) > div > div
Example 3 View on Page
Insufficient color contrast ratio of 4.31:1 (required 4.5:1).
Mode: light
<div class="descripcio">Check the early detection services for children up to the age of 6 who suffer, or are at risk of suffering, development disorders. Centres and teams for preventive assistance, ...
XPath: #family > div > div > div:nth-of-type(2) > div:nth-of-type(5) > div > div
Example 4 View on Page
Insufficient color contrast ratio of 4.31:1 (required 4.5:1).
Mode: light
<div class="descripcio">Barcelona offers a range of leisure options adapted to people with disabilities. Look up leisure activities, social support associations and specific programmes like “Time for ...
XPath: #leisure > div > div > div:nth-of-type(2) > div:nth-of-type(3) > div > div
Example 5 View on Page
Insufficient color contrast ratio of 4.31:1 (required 4.5:1).
Mode: light
<div class="descripcio">The city provides a wide range of fully equipped sports facilities adapted for everyone to enjoy, and which prioritize inclusive activities, be they for schools, summer casals ...
XPath: #leisure > div > div > div:nth-of-type(2) > div:nth-of-type(4) > div > div
21 Moderate accesslint landmarks/no-duplicate-banner:
17 pages affected

Examples

Example 1 View on Page
Page has multiple banner landmarks.
Mode: light
<header id="header" class="header front-page" role="banner" aria-label="Site header"> <div id="zone-header-wrapper" class="zone-wrapper"> <div id="region-header"> <s...
XPath: #header
Example 2 View on Page
Page has multiple banner landmarks.
Mode: light
<div id="promotional-home" class="promotional front-page" role="banner" aria-label="Promotional home"> <section class="region region-promotional"> <div class="views-element-conta...
XPath: #promotional-home
Example 3 View on Page
Page has multiple banner landmarks.
Mode: light
<header id="header" class="header" role="banner" aria-label="Site header"> <div id="zone-header-wrapper" class="zone-wrapper"> <div id="region-header"> <section clas...
XPath: #header
Example 4 View on Page
Page has multiple banner landmarks.
Mode: light
<header id="header" class="header" role="banner" aria-label="Site header"> <div id="zone-header-wrapper" class="zone-wrapper"> <div id="region-header"> <section clas...
XPath: #header
Example 5 View on Page
Page has multiple banner landmarks.
Mode: light
<header id="header" class="header" role="banner" aria-label="Site header"> <div id="zone-header-wrapper" class="zone-wrapper"> <div id="region-header"> <section clas...
XPath: #header
17 Moderate accesslint keyboard-accessible/tabindex:
17 pages affected

Examples

Example 1 View on Page
Element has tabindex="1" which disrupts tab order.
Mode: light
<a href="#carousel-capcalera" class="visually-hidden focusable to-main-content" tabindex="1"> Vés al contingut </a>
XPath: body > a[href="#carousel-capcalera"]
Example 2 View on Page
Element has tabindex="1" which disrupts tab order.
Mode: light
<a href="#main-content" class="visually-hidden focusable to-main-content" tabindex="1"> Skip to main content </a>
XPath: #viure > a[href="#main-content"]
Example 3 View on Page
Element has tabindex="1" which disrupts tab order.
Mode: light
<a href="#main-content" class="visually-hidden focusable to-main-content" tabindex="1"> Skip to main content </a>
XPath: #quepotsfer > a[href="#main-content"]
Example 4 View on Page
Element has tabindex="1" which disrupts tab order.
Mode: light
<a href="#main-content" class="visually-hidden focusable to-main-content" tabindex="1"> Skip to main content </a>
XPath: #quepotsfer > a[href="#main-content"]
Example 5 View on Page
Element has tabindex="1" which disrupts tab order.
Mode: light
<a href="#carousel-capcalera" class="visually-hidden focusable to-main-content" tabindex="1"> Vés al contingut </a>
XPath: body > a[href="#carousel-capcalera"]
16 Moderate accesslint labels-and-names/frame-title:
4 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Frame is missing an accessible name. Add a title attribute.
Mode: light
<iframe frameborder="0" height="88px" src="https://ajuntament.barcelona.cat/widgets/temps/v3/?lang=ca" width="142px" id="i-temps"></iframe>
XPath: #i-temps
Example 2 View on Page
Frame is missing an accessible name. Add a title attribute.
Mode: light
<iframe frameborder="0" height="88px" src="https://ajuntament.barcelona.cat/widgets/qualitat-aire/v2/?lang=ca&amp;config=lameva&amp;20240110" width="336px" id="qualitat-aire-i"></iframe>
XPath: #qualitat-aire-i
Example 3 View on Page
Frame is missing an accessible name. Add a title attribute.
Mode: light
<iframe frameborder="0" height="410px" src="https://com-shi-va.barcelona.cat/ca/api/widget/route" width="100%"></iframe>
XPath: #block-barcelonacat-theme-comshiva > p > iframe
Example 4 View on Page
Frame is missing an accessible name. Add a title attribute.
Mode: light
<iframe src="https://geoportal.barcelona.cat/PlanolBCN/widget/Widget.aspx?lang=CA" id="iframe-planol"></iframe>
XPath: #iframe-planol
Example 5 View on Page
Frame is missing an accessible name. Add a title attribute.
Mode: light
<iframe frameborder="0" height="88px" src="https://ajuntament.barcelona.cat/widgets/temps/v3/?lang=ca" width="142px" id="i-temps"></iframe>
XPath: #i-temps
13 Moderate accesslint aria/aria-allowed-role:
3 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
Role "presentation" is not allowed on element <button>.
Mode: light
<button type="button" role="presentation" class="owl-prev disabled"><span aria-label="Previous">‹</span></button>
XPath: #family > div > div > div:nth-of-type(3) > div > div:nth-of-type(2) > button:nth-of-type(1)
Example 2 View on Page
Role "presentation" is not allowed on element <button>.
Mode: light
<button type="button" role="presentation" class="owl-next"><span aria-label="Next">›</span></button>
XPath: #family > div > div > div:nth-of-type(3) > div > div:nth-of-type(2) > button:nth-of-type(2)
Example 3 View on Page
Role "presentation" is not allowed on element <button>.
Mode: light
<button type="button" role="presentation" class="owl-prev disabled"><span aria-label="Previous">‹</span></button>
XPath: #leisure > div > div > div:nth-of-type(3) > div > div:nth-of-type(2) > button:nth-of-type(1)
Example 4 View on Page
Role "presentation" is not allowed on element <button>.
Mode: light
<button type="button" role="presentation" class="owl-next"><span aria-label="Next">›</span></button>
XPath: #leisure > div > div > div:nth-of-type(3) > div > div:nth-of-type(2) > button:nth-of-type(2)
Example 5 View on Page
Role "region" is not allowed on element <ul>.
Mode: light
<ul class="banners-paginats-list slick-initialized slick-slider" role="region" aria-label="carousel"><button class="slick-prev slick-arrow slick-disabled" type="button" style="display: inline-block;" ...
XPath: div > ul[aria-label="carousel"]
12 Moderate accesslint aria/presentation-role-conflict:
2 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
Presentation role conflicts with: element is focusable. The role will be ignored.
Mode: light
<button type="button" role="presentation" class="owl-prev disabled"><span aria-label="Previous">‹</span></button>
XPath: #family > div > div > div:nth-of-type(3) > div > div:nth-of-type(2) > button:nth-of-type(1)
Example 2 View on Page
Presentation role conflicts with: element is focusable. The role will be ignored.
Mode: light
<button type="button" role="presentation" class="owl-next"><span aria-label="Next">›</span></button>
XPath: #family > div > div > div:nth-of-type(3) > div > div:nth-of-type(2) > button:nth-of-type(2)
Example 3 View on Page
Presentation role conflicts with: element is focusable. The role will be ignored.
Mode: light
<button type="button" role="presentation" class="owl-prev disabled"><span aria-label="Previous">‹</span></button>
XPath: #leisure > div > div > div:nth-of-type(3) > div > div:nth-of-type(2) > button:nth-of-type(1)
Example 4 View on Page
Presentation role conflicts with: element is focusable. The role will be ignored.
Mode: light
<button type="button" role="presentation" class="owl-next"><span aria-label="Next">›</span></button>
XPath: #leisure > div > div > div:nth-of-type(3) > div > div:nth-of-type(2) > button:nth-of-type(2)
Example 5 View on Page
Presentation role conflicts with: element is focusable. The role will be ignored.
Mode: light
<button type="button" role="presentation" class="owl-prev disabled"><span aria-label="Previous">‹</span></button>
XPath: #cerques-feina > div > div > div:nth-of-type(3) > div > div:nth-of-type(2) > button:nth-of-type(1)
8 Moderate accesslint landmarks/landmark-unique:
4 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Multiple region landmarks have the same label "carousel".
Mode: light
<div class="llistat-promos slick-initialized slick-slider" role="region" aria-label="carousel"><button class="slick-prev slick-arrow slick-disabled" type="button" disabled="" style="">Previous promoti...
XPath: #carousel-capcalera > div:nth-of-type(1) > div[aria-label="carousel"]
Example 2 View on Page
Multiple region landmarks have the same label "carousel".
Mode: light
<div class="carousel slick-initialized slick-slider" data-taguejar="Promos Home 2 nivell" role="region" aria-label="carousel"><button type="button" class="slick-arrow nav-esquerra" tabindex="0" aria-l...
XPath: #node-24580 > div[aria-label="carousel"]
Example 3 View on Page
Multiple region landmarks have the same label "carousel".
Mode: light
<div class="llistat-promos slick-initialized slick-slider" role="region" aria-label="carousel"><button class="slick-prev slick-arrow slick-disabled" type="button" disabled="" style="">Previous promoti...
XPath: #carousel-capcalera > div:nth-of-type(1) > div[aria-label="carousel"]
Example 4 View on Page
Multiple region landmarks have the same label "carousel".
Mode: light
<div class="carousel slick-initialized slick-slider" data-taguejar="Promos Home 2 nivell" role="region" aria-label="carousel"><button type="button" class="slick-arrow nav-esquerra" tabindex="0" aria-l...
XPath: #node-24580 > div[aria-label="carousel"]
Example 5 View on Page
Multiple region landmarks have the same label "carousel".
Mode: light
<div class="llistat-promos slick-initialized slick-slider" role="region" aria-label="carousel"><button class="slick-prev slick-arrow slick-disabled" type="button" disabled="" style="">Previous promoti...
XPath: #carousel-capcalera > div:nth-of-type(1) > div[aria-label="carousel"]
4 Moderate accesslint labels-and-names/label-title-only:
4 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Form element uses title attribute as only label. Use <label>, aria-label, or aria-labelledby instead.
Mode: light
<input type="text" name="query" placeholder="Cerca a barcelona.cat..." title="Cerca a barcelona.cat">
XPath: #cercadormobile > div > input[name="query"]
Example 2 View on Page
Form element uses title attribute as only label. Use <label>, aria-label, or aria-labelledby instead.
Mode: light
<input type="text" name="query" placeholder="Cerca a barcelona.cat..." title="Cerca a barcelona.cat">
XPath: #cercadormobile > div > input[name="query"]
Example 3 View on Page
Form element uses title attribute as only label. Use <label>, aria-label, or aria-labelledby instead.
Mode: light
<input type="text" name="query" placeholder="Cerca a barcelona.cat..." title="Cerca a barcelona.cat">
XPath: #cercadormobile > div > input[name="query"]
Example 4 View on Page
Form element uses title attribute as only label. Use <label>, aria-label, or aria-labelledby instead.
Mode: light
<input type="text" name="query" placeholder="Cerca a barcelona.cat..." title="Cerca a barcelona.cat">
XPath: #cercadormobile > div > input[name="query"]
4 Moderate accesslint adaptable/listitem-parent:
1 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
<li> is not contained in a <ul>, <ol>, or <menu>.
Mode: light
<li class="banner-item box-banner" style="width: 100%; display: inline-block;"> <div class="paragraph paragraph--type--banners-paginats paragraph--view-mode--full box-banner"> ...
XPath: div[aria-label="slide 1"] > div > li
Example 2 View on Page
<li> is not contained in a <ul>, <ol>, or <menu>.
Mode: light
<li class="banner-item box-banner" style="width: 100%; display: inline-block;"> <div class="paragraph paragraph--type--banners-paginats paragraph--view-mode--full box-banner"> ...
XPath: div[aria-label="slide 2"] > div > li
Example 3 View on Page
<li> is not contained in a <ul>, <ol>, or <menu>.
Mode: light
<li class="banner-item box-banner" style="width: 100%; display: inline-block;"> <div class="paragraph paragraph--type--banners-paginats paragraph--view-mode--full box-banner"> ...
XPath: div[aria-label="slide 3"] > div > li
Example 4 View on Page
<li> is not contained in a <ul>, <ol>, or <menu>.
Mode: light
<li class="banner-item box-banner" style="width: 100%; display: inline-block;"> <div class="paragraph paragraph--type--banners-paginats paragraph--view-mode--full box-banner"> ...
XPath: div[aria-label="slide 4"] > div > li
4 Moderate accesslint navigable/empty-heading:
1 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
Heading is empty. Add text content or remove the heading element.
Mode: light
<h3><p>Ves al zoo</p> </h3>
XPath: div[aria-label="slide 1"] > div > li > div > div > h3
Example 2 View on Page
Heading is empty. Add text content or remove the heading element.
Mode: light
<h3><p>Puja al tibidabo</p> </h3>
XPath: div[aria-label="slide 2"] > div > li > div > div > h3
Example 3 View on Page
Heading is empty. Add text content or remove the heading element.
Mode: light
<h3><p>Ve de Barcelona</p> </h3>
XPath: div[aria-label="slide 3"] > div > li > div > div > h3
Example 4 View on Page
Heading is empty. Add text content or remove the heading element.
Mode: light
<h3><p>Coneix el tiquet rambles</p> </h3>
XPath: div[aria-label="slide 4"] > div > li > div > div > h3
3 Moderate accesslint adaptable/aria-required-children:
3 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Examples

Example 1 View on Page
Role "menu" requires children with role: menuitem or menuitemcheckbox or menuitemradio or group or menu or separator.
Mode: light
<div role="menu" class="container list-pano-rollover"> <ul class="row distribuidora-css3"> <li class="col-md-4 col-sm-6"> <div class="paragraph paragraph--type--...
XPath: #node-17012 > div
Example 2 View on Page
Role "menu" requires children with role: menuitem or menuitemcheckbox or menuitemradio or group or menu or separator.
Mode: light
<div role="menu" class="container list-pano-rollover"> <ul class="row distribuidora-css3"> <li class="col-md-4 col-sm-6"> <div class="paragraph paragraph--type--...
XPath: #node-722 > div
Example 3 View on Page
Role "menu" requires children with role: menuitem or menuitemcheckbox or menuitemradio or group or menu or separator.
Mode: light
<div role="menu" class="container list-pano-rollover"> <ul class="row distribuidora-css3"> <li class="col-md-4 col-sm-6"> <div class="paragraph paragraph--type--...
XPath: #node-725 > div
1 Moderate accesslint adaptable/list-children:
1 pages affected

Rule Information

Engine: accesslint

Roles: Front-End Developer

Blocking: No

Affected Pages

Examples

Example 1 View on Page
List contains non-<li> child <button>.
Mode: light
<button class="slick-prev slick-arrow slick-disabled" type="button" style="display: inline-block;" disabled=""><span class="slick-prev-icon" aria-hidden="true"></span><span class="slick-sr-only">Previ...
XPath: ul[aria-label="carousel"] > button:nth-of-type(1)