processing / processing/p5.js-website

[Image] Excessively long alternative text

Open
#873 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Accessibility: Low Severity
Dominant language
MDX
Stars
96
Forks
322
Avg merge
5d 22h
Merged PRs (30d)
8

Description

Title

[Image] Excessively long alternative text

Description

An image (<img>) element on the page with very long (over 100 characters) alternative text. Non-text content must convey the same purpose or information as presented visually. When alt text is too long, users who rely on it may miss essential context or struggle to understand the content.

Steps to Reproduce
  1. go to tutorials/ and tutorials/setting-up-your-environment/
  2. Locate to the following element
<img class="aspect-photo object-cover" height="293" width="440" src="/_astro/SetupA.MT9CUmVs_UdPSt.webp" loading="eager" decoding="async" alt="An interactive sketch in the p5.js Web Editor draws circles on the canvas as the mouse pointer moves." style="">
<img height="1152" width="2048" src="/_astro/p5_editor_sign_up_page.ti-nvYfB_Z17jU5E.webp" loading="lazy" infersize="true" decoding="async" aspectratio="none" alt="An arrow pointing to the highlighted User Name, Emaill, Password, and Confirm Password fields on the Sign Up page." style="">
Actual Behavior

The image’s alt attribute contains more than 100 characters of description.

Expected Behavior

Alternative text should be concise and focused, describing the essential content and function of the image in a brief phrase or sentence.

Environments

No response

Suggested Fix
  1. Keep the alt text brief and focused—describe only the image’s essential purpose in a few words.
  2. If readers need more context, place supplementary details next to the image or link to a separate description page.
  3. Avoid hiding unique information solely in the alt text; ensure all critical content is visible elsewhere on the page.
Reference
What is your operating system?

None

Web browser and version

No response

Contributor guide

No contributing guide indexed for this repository

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.

Research direction

Search the tutorials/ and tutorials/setting-up-your-environment/ content for the two exact alt attributes shown in the issue. Shorten each description to its essential purpose while preserving useful information, then verify the rendered images have concise alternative text and that the tutorials still display correctly.

Written by the indexing model from the issue text.

Assessment

Domain
accessibility, content
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.