Accessibility: audit findings needing design or product decisions
维护者通常 1 天内回复
还没有人认领这个 Issue。
评估
- 难度
- 5/5
- 预计耗时
- 一周以上
- 新手友好度
- 25/100
- Issue 类型
- 缺陷
- 描述清晰度
- 基本清楚
- 活跃度
- 活跃
- 技术栈
- typescript
调研方向
先阅读列出的 TypeScript/TSX 文件和所引用的 app-shell 规范,然后针对每个视觉、内容或产品问题获取 maintainer 的决定。只处理已有一致方向的发现;完成意味着选定的 WCAG 问题已得到解决,并且所有注明的规范变更都已更新。
由索引模型根据 Issue 内容生成。
描述
A full accessibility pass over apps/web (every source file read; WCAG 2.1 AA + ARIA APG) produced 62 findings. The ARIA-correctness layer is already addressed in PR #154 and PR #155, and a follow-up PR covers the mechanical remainder. This issue holds the findings that are real WCAG failures but carry a visual, content, or product dimension that shouldn't be decided unilaterally by a volunteer — each needs a maintainer call (and, per the specops workflow, a spec touch where noted).
1. Green Volunteer CTA fails contrast — Serious (WCAG 1.4.3)
White on green-600 (#16a34a) ≈ 3.05:1; normal-size text needs 4.5:1. It's the site's primary CTA in three places. green-700 is borderline (≈ 4.5:1); green-800 passes comfortably. A one-class change — but it's the brand green, and there's no success button variant or green token, so this magic color is also a design-system gap.
AppHeader.tsx · Home.tsx:92 · Volunteer.tsx:37
2. Links distinguished by color alone, and the colors are nearly identical — Serious (WCAG 1.4.1)
--primary and --foreground are both near-black neutrals (≈ 1.4:1 against each other vs the 3:1 required when color is the only differentiator). Some screens add underline, many don't. Either underline inline links by default or give --primary a real hue — a theme decision.
index.css:53,58 · ~20 screens
3. Every route shares one document title — Serious (WCAG 2.4.2)
Nothing sets document.title per route; every page is "Code for Philly" to screen readers and tab-switchers. Needs a small per-route title convention (and a spec touch, since screens are spec-governed).
index.html:8 · App.tsx
4. Hero slideshow auto-advances with no pause control — Serious (WCAG 2.2.2)
aria-hidden hides it from AT, but the criterion is about motion in the viewport: auto-advancing (8s crossfades) needs a visible pause/stop affordance.
HeroSlideshow.tsx
5. Whole pages have no headings because CardTitle is a <div> — Serious (WCAG 1.3.1 / 2.4.6)
All account-claim and password-reset pages are built from cards only, so they render zero headings and no <h1>. Fix is per-page heading placement (or a heading-level prop pattern), not necessarily changing the shadcn primitive.
ui/card.tsx:36 · pages/AccountClaim*.tsx · PasswordReset*.tsx
6. Blog/buzz images are unconditionally alt=\"\" — Serious (WCAG 1.1.1)
Authors have no way to supply alt text for featured images. Needs a content-model decision: an alt field on posts/updates, or an explicit editorial policy that featured images are decorative.
BlogDetail.tsx:36 · BlogIndex.tsx:124 · ActivityCard.tsx:80
7. Client-side navigation never moves focus or announces the new page — Moderate (WCAG 2.4.3)
<main tabIndex={-1}> exists but nothing focuses it on route change. A small router-level focus/announce hook — worth pairing with the document-title work (item 3).
AppShell.tsx:24 · App.tsx
8. Filter/search result updates are silent — Moderate (WCAG 4.1.3)
Index screens re-render their lists after the debounce with no status announcement. A shared "N results" role=\"status\" line would cover them; copy and placement are design calls.
ProjectsIndex · PeopleIndex · HelpWantedIndex · TagsNamespace
9. Reduced-motion honored only by the hero's Ken Burns pan — Moderate
Spinners, sheet/dialog transitions, and scrollTo({behavior:'smooth'}) run regardless of prefers-reduced-motion. The usePrefersReducedMotion hook exists and is under-applied; a global @media (prefers-reduced-motion: reduce) block is the usual fix.
index.css · 5 screens' scrollTo · HeroSlideshow.tsx:70
10. Network-error banner says "Retry" but only dismisses — Moderate (spec↔code contradiction)
The spec (specs/behaviors/app-shell.md:162) prescribes [Retry], and the button's handler only calls clearError(). Surfaced during the ARIA pass and recorded in plans/aria-correctness.md follow-ups. Either the button should refetch or the spec's label should change — both need a spec edit first, so it's parked here rather than patched.
NetworkErrorBanner.tsx · specs/behaviors/app-shell.md:162
Happy to implement any of these once there's a direction — most are small once the decision is made.
🤖 Generated with Claude Code
- 主要语言
- TypeScript
- 星标
- 1
- 派生
- 1
- 平均合并
- 11 分钟
- 30 天内合并 PR
- 22
环境准备
- 提供 Dockerfile 或 Docker Compose 文件
- 没有 Pull Request 模板
- 没有贡献指南
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
CodeForPhilly/codeforphilly-ng 的其他 Issue
-
难度 2/5 1-3 小时 新手友好度 84/100
CodeForPhilly/codeforphilly-ng#178 ·
维护者通常 1 天内回复
-
MarkdownEditor toolbar: use Radix Toolbar from radix-ui instead of the hand-rolled roving tabindex未关闭enhancement
难度 2/5 1-3 小时 新手友好度 82/100
CodeForPhilly/codeforphilly-ng#169 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 76/100
CodeForPhilly/codeforphilly-ng#89 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 88/100
CodeForPhilly/codeforphilly-ng#87 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 74/100
CodeForPhilly/codeforphilly-ng#50 ·
维护者通常 1 天内回复
查看 CodeForPhilly/codeforphilly-ng 的全部 Issue
相似的 Issue
-
难度 2/5 1-3 小时 新手友好度 78/100
JoviDeCroock/pracht#432 ·
维护者通常 1 天内回复
-
approved check:passed streams:add
难度 1/5 1 小时以内 新手友好度 75/100
维护者通常 1 天内回复
-
Hardware attribute name "app Connection Support" has inconsistent casing可能已有人在做 关联的 PR 仍在进行中或已合并。 未关闭
难度 1/5 1 小时以内 新手友好度 88/100
walletbeat/walletbeat#1628 ·
维护者通常 1 天内回复
-
bug go
难度 2/5 1-3 小时 新手友好度 82/100
genkit-ai/genkit#6761 · 1 条评论 ·
维护者通常 2 天内回复
-
难度 2/5 1-3 小时 新手友好度 72/100
NousResearch/hermes-agent#136483 ·
维护者通常 1 天内回复