[Image] Excessively long alternative text

Aperta
  • Qualcosa non va?
#873 4 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 2 giorni

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
45/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Ferma
Ambito
accessibility, content

Direzione di ricerca

Cerca nei contenuti di tutorials/ e tutorials/setting-up-your-environment/ i due attributi alt esatti mostrati nell’issue. Riduci ogni descrizione al suo scopo essenziale, preservando le informazioni utili, quindi verifica che le immagini renderizzate abbiano un testo alternativo conciso e che i tutorial continuino a essere visualizzati correttamente.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Accessibility: Low Severity
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

Lingua principale
MDX
Stelle
97
Fork
330
Merge medio
3g 15h
PR unite (30g)
13

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di processing/p5.js-website

Tutte le issue di processing/p5.js-website

Issue simili

Altre issue su Accessibility

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.