Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

a11y: notebook preview header is outside any landmark

Open Beginner friendly
  • Is something wrong?
#14,968 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
1/5
Estimated time
Under an hour
Newbie friendliness
90/100
Issue type
Bug
Clarity
Clearly specified
Activity status
Active
Tech stack
html
Domain
accessibility

Research direction

Start with src/resources/formats/html/embed/template.html at the embed header markup. Render the three-file website reproduction with quarto render, open _site/nb-preview.html, and run axe-core on it. Done means the notebook controls are exposed through a named navigation landmark and the region finding is gone.

Written by the indexing model from the issue text.

Description

accessibility embed

I have:

  • searched the issue tracker for similar issues
  • installed the latest version of Quarto CLI
  • formatted my issue following the Bug Reports guide

Bug description

On a notebook preview page (*-preview.html), the #quarto-embed-header bar is a plain <div> outside every landmark. The bar holds the "Back to Article" link, the notebook title, and the "Download Notebook" link. Screen-reader users cannot get to these controls with landmark navigation.

axe-core 4.10.3 reports this as region ("All page content should be contained by landmarks"). axe rates region as Best Practice, not as a WCAG failure. The closest success criterion is 1.3.1 Info and Relationships.

Steps to reproduce

Make a website project with three files: _quarto.yml, index.qmd, and nb.ipynb.

_quarto.yml:

project:
  type: website

index.qmd:

---
title: Embed test
---

{{< embed nb.ipynb#one-plus-one >}}

nb.ipynb (already executed, so no kernel is necessary):

{"cells":[{"cell_type":"code","execution_count":1,"metadata":{},"outputs":[{"name":"stdout","output_type":"stream","text":["2\n"]}],"source":["#| label: one-plus-one\n","print(1 + 1)"]}],
 "metadata":{"kernelspec":{"display_name":"Python 3","language":"python","name":"python3"},"language_info":{"name":"python"}},"nbformat":4,"nbformat_minor":5}
  1. Run quarto render.
  2. Open _site/nb-preview.html.
  3. Run axe-core (4.10.3) on the page.

Actual behavior

axe reports region on #quarto-embed-header at 1440x900 and at 320x568:

<div id="quarto-embed-header" class="headroom fixed-top bg-primary">

Expected behavior

The header bar is inside a landmark, for example a nav element with an accessible name. axe reports no region finding for it.

Your environment

  • IDE: Positron 2026.10.0 (build 56)
  • OS: macOS 26.6.2 (build 25G83)

Quarto check output

Quarto 1.11.4

[✓] Checking environment information...
      Quarto cache location: /Users/charlottewickham/Library/Caches/quarto

[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.10.0: OK
      Dart Sass version 1.101.0: OK
      Deno version 2.7.14: OK
      Typst version 0.15.1: OK

[✓] Checking versions of quarto dependencies......OK

[✓] Checking Quarto installation......OK
      Version: 1.11.4
      Path: /Applications/quarto/bin


[✓] Checking tools....................OK
      TinyTeX: v2026.04
      Chrome Headless Shell: 150.0.7871.115
      VeraPDF: 1.28.2






[✓] Checking LaTeX....................OK
      Using: TinyTex
      Path: /Users/charlottewickham/Library/TinyTeX/bin/universal-darwin
      Version: 2026


[✓] Checking Chrome Headless....................OK
      Using: Chrome Headless Shell installed by Quarto
      Path: /Users/charlottewickham/Library/Application Support/quarto/chrome-headless-shell/chrome-headless-shell-mac-arm64/chrome-headless-shell
      Version: 150.0.7871.115











[✓] Checking basic markdown render....OK







[✓] Checking R installation...........OK
      Version: 4.6.0
      Path: /Library/Frameworks/R.framework/Versions/4.6/Resources
      LibPaths:
        - /Users/charlottewickham/Library/R/arm64/4.6/library
        - /Library/Frameworks/R.framework/Versions/4.6/Resources/library
      knitr: 1.51
      rmarkdown: 2.31



























[✓] Checking Knitr engine render......OK











[✓] Checking Python 3 installation....OK
      Version: 3.12.2
      Path: /Users/charlottewickham/.pyenv/versions/3.12.2/bin/python3
      Jupyter: 5.9.1
      Kernels: python3





















































[✓] Checking Jupyter engine render....OK































[✓] Checking Julia installation...

AI helped with this investigation. The work was grounded in a local clone of quarto-cli, as "Using AI tools to investigate" in CONTRIBUTING.md describes.

Dominant language
JavaScript
Stars
6k
Forks
461
Avg merge
13h 15m
Merged PRs (30d)
54

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from quarto-dev/quarto-cli

All issues in quarto-dev/quarto-cli

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.