시맨틱 HTML

Outcome：Complete the task with 시맨틱 HTML (Semantic HTML)。 User context：뉴스 사이트는 article, h1, time, figure, nav로 기사를 구성합니다. CSS가 꺼져 있어도 이야기는 명확한 순서를 유지합니다. 보조 기술은 제목이나 내비게이션으로 바로 이동할 수 있습니다. Recommended pattern：시맨틱 HTML (Semantic HTML)。 Why it fits：콘텐츠와 동작에 맞는 네이티브 HTML 요소로 시작합니다. 네이티브 HTML이 실제로 부족할 때만 ARIA를 추가합니다. Do not use it when：스타일링이 쉽다는 이유로 링크, 버튼, 제목 또는 테이블을 흉내 내기 위해 일반 div 요소를 사용하지 마세요. Product requirements: Define the default, loading, empty, error, success, and recovery states. Keep user input. Give clear feedback after every action. Accessibility and resilience: Use semantic HTML, full keyboard access, and visible focus. Make the layout work when zoomed and support reduced motion. Follow the project’s current rules. Do not add a new UI library unless the project already uses it. Acceptance criteria: The main task works with keyboard only and at 320px width. Focus and status changes are announced. Check loading, failure, retry, cancel, and reduced-motion paths. Evidence and limits (evidence boundary)：이 표준은 나열된 범위만 적용합니다. 시각적 스타일, 제품 결정, 또는 Vibulary 예시는 선택하지 않습니다. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.