Jemima Abu: Give coding agents accessibility rules from the start

A product engineer shows how semantic HTML, reusable components and explicit agent skills can help teams build more usable interfaces.

JAJemima Abu연사 · CAIS
채널
AI Engineer
게시일
2026년 11월 9일
영상
14:38
읽기
4분
슬라이드
3
원문
영어
YouTube에서 열기
스크롤하면 영상이 오른쪽 아래로 작아져 계속 재생됩니다. 자막은 읽기 언어를 따릅니다.
읽기 언어2개 언어로 읽을 수 있음
이 글은 아직 한국어 번역이 없어 영어 원문으로 표시합니다.
요약

30초 요약

Jemima Abu argues that coding agents can repeat accessibility gaps present in their training and surrounding code. Her practical response is to define accessibility requirements, audit existing code, build reusable components and make agents follow those rules. In one informal Figma implementation, her accessibility skill coincided with a drop from 15 to five minutes and 58% lower cost, but she cautions that a single uncontrolled run cannot establish a general speed or cost benefit.

  1. 1A single skill-assisted run was faster, but is not proofAbu reports 15 versus five minutes and 58% lower cost in one informal Figma experiment; she explicitly says it was not controlled.
  2. 2Native elements can replace some custom codeThe HTML details element can provide an accordion-like disclosure without recreating its behavior from scratch.
  3. 3Inaccessible products lose customers before teams see themAbu recounts a banking customer switching providers because the first app could not be used.
  4. 4Make accessibility part of the agent workflowDefine requirements, audit the codebase, use shared components and require agents to follow the rules.
  5. 5Semantic HTML and keyboard operation are useful starting pointsAbu shares a lightweight skill and warns that instructions alone cannot guarantee full accessibility.

핵심 정리

  1. Define accessibility requirements before prompting an agent to implement a product.
  2. Audit the existing codebase so agents do not simply reproduce its accessibility problems.
  3. Prefer suitable semantic HTML and reusable components over unnecessary custom implementations.
  4. Put keyboard access and other accessibility requirements into agent guidance that runs consistently.
  5. An accessibility skill can help, but testing with appropriate tools and people remains necessary.
전문

챕터별로 다듬은 전문 읽기

원본 자막만 보기
01

An accessibility exercise and a small experiment

Abu asks the audience to use a phone without looking. She compares one Figma implementation with and without accessibility guidance, while explaining the experiment’s limits.

Jemima Abu asks the audience to close their eyes and unlock a phone, then to imagine doing so for the first time without knowing where the keys are. The exercise introduces the difficulty of relying on interfaces that assume everyone can see them.

Abu defines accessibility as building products that people can use regardless of disability. Visual, motor, cognitive and hearing disabilities can all expose barriers that a developer using the product in one familiar way might miss.

She cites a finding that 96% of leading websites have accessibility issues and recounts common objections from developers: accessibility takes too long, clients do not request it, or managers have other priorities.

To test her own hypothesis, Abu asked an agent to implement a Figma design twice: once without accessibility guidance and once with a skill she wrote. In her example, the guided run took five minutes rather than 15 and cost 58% less.

One Figma implementation with and without the skill
슬라이드 1 / 3One Figma implementation with and without the skillThe slide reports 15.6 versus 5.2 minutes and $14.20 versus $5.97; Abu cautions this was one uncontrolled experiment.

Abu immediately qualifies the comparison: it was a one-off experiment in an uncontrolled environment, not evidence that accessible code is always cheaper or faster. Her point is that specific instructions can help an agent follow the desired approach.

Abu introduces herself as a product engineer and certified accessibility professional. She compares an AI agent to a young child sent on an errand: a map, shopping list and clear boundaries help the child reach the intended destination.

02

How coding agents repeat inaccessible patterns

Agents need explicit guidance, Abu argues. She compares custom components with native HTML and explains why accessibility is harder to add at the end.

For a coding agent, the equivalent is clear guidance about the code and behavior expected. Without it, the agent may generate a large collection of generic elements instead of the semantic structure the developer wanted.

Abu argues that human bias can become AI bias. Developers who test only on their own devices may overlook screen-reader users or people who navigate with a keyboard, and generated code can repeat patterns found in existing code.

She says agents may also produce more custom code than necessary. An accordion-style disclosure can often use the native HTML details element instead of a custom JavaScript implementation, taking advantage of browser-provided behavior.

Her blueberry muffin analogy illustrates why accessibility should be built in from the start. Adding ARIA labels after a site is complete, she argues, is like pushing blueberries onto an already baked plain muffin.

03

Users, business costs and legal exposure

Inaccessible interfaces can push customers away. Abu also discusses legal risks, which depend on the applicable jurisdiction and circumstances.

Abu recounts a person switching from one bank to another because the first bank’s app was inaccessible. The customer did not necessarily prefer the second bank’s features; they needed a product they could actually use.

That creates a selection problem for teams: saying no current users rely on assistive technology may overlook people who tried the product, found a barrier and left. Abu compares it to a shop wondering why nobody enters when it has no door.

She also raises legal exposure associated with inaccessible websites and refers to the Americans with Disabilities Act. The precise obligations depend on the organization, service and applicable law; the talk’s broad formulation should not be treated as a legal determination.

04

A four-step agent workflow

Define requirements, audit the codebase, use reusable components and make accessibility guidance mandatory for agents.

Her first recommendation is to define accessibility requirements for the product. A web application and a mobile application may have different needs, so the developer or product manager should identify the relevant standards before prompting an agent.

Second, audit the existing codebase. Abu compares an agent entering a messy project to a new roommate who sees dirty dishes and assumes that is the household norm; existing patterns can become the examples the agent follows.

Steps toward accessible agent-generated code
슬라이드 2 / 3Steps toward accessible agent-generated codeThe slide lists defining requirements, auditing the codebase and implementing a design system.

Third, use a design system or reusable component library. When an accessibility issue is fixed in a shared component, the improvement can reach many pages rather than requiring each instance to be repaired independently.

Fourth, make the requirements mandatory in the agent’s normal workflow. Deadlines make accessibility easy to forget, so the agent should repeatedly receive guidance to build for people with different ways of using the product.

05

A lightweight skill and questions

Abu recommends semantic HTML and keyboard operation while emphasizing that prompts alone cannot guarantee accessibility. In questions she criticizes superficial accessibility overlays.

A lightweight accessibility skill
슬라이드 3 / 3A lightweight accessibility skillThe example asks for semantic HTML, keyboard support, labels and checks before returning code.

Abu shows a lightweight accessibility skill: use semantic HTML, reach for ARIA when appropriate, and ensure interactive elements work with a keyboard. She says her examples focus on the web and should be adapted to the product.

She also mentions modern web guidance that helps agents choose current browser features, such as details for disclosures. These instructions can improve the starting point, but she cautions that prompts alone do not make a product fully accessible.

During questions, Abu names two frustrations: teams ignoring basic needs, such as keyboard handlers, and teams treating an accessibility overlay as a complete solution. An overlay, she says, resembles adding blueberries after the muffin has already been baked.

같은 채널의 다른 글

슬라이드 7장19:41EN
AI Engineer· 2026년 11월 9일A high-reliability automation starts by routing the hard cases awayMatthew Jewkes · Standard CyberneticsMatthew Jewkes describes separating critical errors, ambiguous decisions and unusual exceptions in a biopharma indexing workflow.에이전트 엔지니어링Workflow automation평가(Evals)+1
슬라이드 7장22:01EN
AI Engineer· 2026년 11월 9일Zach Lloyd: make the software factory measurable and editableZach Lloyd · WarpWarp’s CEO proposes recording agent runs, scoring failures and testing changes to the workflow on real tasks.소프트웨어 팩토리코딩 에이전트평가(Evals)+2
슬라이드 12장27:35EN
AI Engineer· 2026년 11월 9일Uber traded an always-green trunk for faster AI-scale mergesPreetam Dwivedi, Manjari Akella · UberIts merge queue now relaxes some conflicts and validates the combined state after landing, with a verified-good fallback.개발 워크플로와 테스트코딩 에이전트인프라와 배포+2
슬라이드 3장15:25EN
AI Engineer· 2026년 11월 9일Hassan and Omar El Mghari: When an AI financial forecast is right for the wrong reasonsHassan El Mghari, Omar El Mghari · Together AIA Costco membership-fee model passed basic checks and landed close to reported results, but an audit uncovered offsetting assumptions.금융 AI평가(Evals)에이전트 엔지니어링
슬라이드 4장21:12EN
AI Engineer· 2026년 11월 9일Tom Moor: Give coding agents the product context that code cannot showTom Moor · LinearLinear’s workflow carries customer requests, past decisions, review history and human feedback from intake through implementation and review.코딩 에이전트제품과 UX에이전트 엔지니어링
슬라이드 2장15:35EN
AI Engineer· 2026년 11월 9일Mislav Ivanda: Choose an execution boundary before an agent frameworkMislav Ivanda · DaytonaThe Daytona engineer compares local approvals, embedded runtimes and sandboxed machines for running agent-generated code.Sandboxes & isolation에이전트 엔지니어링인프라와 배포