vailabel/vailabel-studio

a11y: Several image elements are missing alt text

Open

#250 opened on 2026年6月19日

GitHub で見る
 (0 comments) (0 reactions) (0 assignees)TypeScript (22 forks)auto 404
good first issuehacktoberfest

Repository metrics

Stars
 (62 stars)
PR merge metrics
 (PR metrics pending)

説明

Summary Multiple <img> elements across the studio render without an alt attribute, so screen readers can't describe them and the markup fails basic accessibility/lint checks.

Where (non-exhaustive)

  • apps/studio/src/app/layout/main-layout.tsx:140
  • apps/studio/src/features/studio/components/file-list-panel.tsx:162
  • apps/studio/src/features/studio/components/canvas/canvas.tsx:54
  • apps/studio/src/features/projects/components/image-upload.tsx:64
  • apps/studio/src/features/projects/components/image-table.tsx:95
  • apps/studio/src/features/studio/components/editors/video/video-library.tsx:180

Find the rest with: grep -rn "<img" --include=*.tsx apps/studio/src | grep -v "alt="

Steps

  1. Branch: git checkout -b a11y/img-alt-text.
  2. Add a descriptive alt to each (e.g. alt={image.name} for dataset thumbnails, alt="Vailabel logo" for the logo). Use alt="" only for purely decorative images.
  3. Run yarn lint and yarn typecheck; open a PR.

Acceptance criteria

  • Every meaningful <img> has a descriptive alt; decorative ones use alt="".
  • grep -rn "<img" --include=*.tsx apps/studio/src | grep -v "alt=" returns nothing.

Good first issue — comment here if you'd like to take it.

コントリビューターガイド