상호작용을 유지하며 HTML 접근성을 수정하는 방법.
의미론적 HTML 수정은 기능을 유지하고 맥락 속에서 테스트해야 합니다. ARIA 추가는 올바른 네이티브 요소 선택을 대신하지 못합니다.
작업에 맞게 절차를 조정하세요.
컨트롤의 실제 목적을 파악하고 기존 동작을 유지하면서 적절한 네이티브 의미를 선택하세요. 필요한 이름이나 상태 정보를 추가한 뒤 전체 맥락에서 키보드, 포커스, 폼 상호작용을 검증하세요.
- 제공할 내용
- HTML 조각과 지정된 접근성 문제.
- 받을 결과
- 검토 메모가 포함된 의미론적 마크업 수정안.
입력과 결과를 확인하세요.
설명용 입력과 출력 · 실제 WebAct 실행이 아닌 학습용 예시
입력 항목 예시개
Replace <div onclick="submitForm()">Send message</div> in an existing HTML form. The form's submit handler already performs validation and calls submitForm().
완성된 예시
<button type="submit">Send message</button> The native submit button uses the existing form submission path. Verify Enter/Space interaction, visible focus, validation errors and prevention of duplicate sends. Do not retain a second click handler that also calls submitForm().
이 입력을 프롬프트에 넣고 WebAct에 복사해 작업을 실행해 보세요. 결과는 설명용 예시와 다를 수 있습니다.
판단 기준과 문제 해결.
ARIA 역할만 추가하면 div가 완전한 버튼이 되나요?
키보드 동작이나 폼 의미를 자동 구현하지 않습니다. 의도한 컨트롤에 맞는 경우 네이티브 버튼을 우선하세요.
클릭 가능한 요소를 교체했더니 폼이 예상치 않게 제출되는 이유는 무엇인가요?
버튼 타입을 확인하세요. 일반 동작용 컨트롤에는 제출 동작 대신 type="button"이 필요할 수 있습니다.
직접 준비한 자료로 시도하세요.
작업 프롬프트의 예시를 내 자료로 바꾸세요. 필요한 요구 사항은 유지하고 작업을 WebAct에 복사하세요.
작업 맞춤 설정 및 복사 ↑