Skip to content

fix: replace structural <span> wrappers with semantic headings (<h1>, <h2>)#2827

Merged
sydseter merged 10 commits intoOWASP:masterfrom
Mysterio-17:fix/homepage-heading-span-tags
Apr 19, 2026
Merged

fix: replace structural <span> wrappers with semantic headings (<h1>, <h2>)#2827
sydseter merged 10 commits intoOWASP:masterfrom
Mysterio-17:fix/homepage-heading-span-tags

Conversation

@Mysterio-17
Copy link
Copy Markdown
Contributor

@Mysterio-17 Mysterio-17 commented Apr 16, 2026

Description

This PR resolves an accessibility (a11y) and SEO issue on the landing page where the primary page titles were being rendered using un-classed tags rather than proper HTML document headings.
Previously, home.h1.1, home.h1.2, and home.h1.3 were wrapped in tags, which broke screen-reader navigation and search-crawler context. To make them visually appear as headers, a global styling block was originally applied to all span components, which made future inline styling brittle.

Fixes: #2826

Solution

  • src/routes/+page.svelte: Replaced the top-most main component wrapper (home.h1.1) with a single <h1> tag to establish the root document hierarchy.
  • src/routes/+page.svelte: Converted the subsequent structural wrappers (home.h1.2 and home.h1.3) to <h2> tags.
  • CSS Formatting: Updated the Svelte style block to directly target the new h1, h2 headings instead of globally hijacking the span element.

AI Usage

AI was used to help format this PR description. The code analysis, HTML/CSS changes, and solution logic are entirely my own work and free of AI-generated noise and unnecessary comments.

… a11y and SEO

Resolves accessibility and SEO issues on the landing page by properly formatting title wrappers to semantic headings, and updating CSS accordingly.
Copilot AI review requested due to automatic review settings April 16, 2026 17:01
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR improves the semantic structure of the landing page by replacing non-semantic <span> title wrappers with proper heading elements, aiming to improve accessibility (screen-reader navigation) and SEO.

Changes:

  • Replaced the main title wrapper with an <h1> and subsequent title wrappers with <h2> on the home route.
  • Updated the page-scoped CSS to style h1, h2 instead of globally styling span.

Comment thread cornucopia.owasp.org/src/routes/+page.svelte Outdated
Mysterio-17 and others added 7 commits April 16, 2026 22:54
Deleted impossible fallback traces and simplified error catching logic in Health/Api controllers. Eliminated unreachable branches and added specific Vitest maps to bump frontend branch coverage.
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
@Mysterio-17
Copy link
Copy Markdown
Contributor Author

Hey @sydseter , have a look at this whenevr you have time.

@sydseter sydseter merged commit 9e7b7e0 into OWASP:master Apr 19, 2026
9 checks passed
@sydseter
Copy link
Copy Markdown
Collaborator

@Mysterio-17 Thank you for your time!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Fix main headings being rendered as <span> tags on the homepage

3 participants