시맨틱 HTML을 사용하는 것이 접근성과 기본 동작 설계에 왜 중요한가요?

이렇게 답해 보세요 (핵심 답변)

시맨틱 HTML은 요소의 시각적 모양이 아니라 콘텐츠의 의미와 역할에 맞는 태그를 선택해, 브라우저의 기본 상호작용과 보조 기술 해석을 자연스럽게 얻는 방식입니다. 예를 들어 페이지 이동에는 <a href>, 동작 실행에는 <button>을 쓰면 별도 자바스크립트 없이도 탭 포커스 이동과 Enter·Space 키 실행, 스크린리더 역할 안내가 기본 제공됩니다. 또한 <main>, <nav>, 제목 태그로 문서 구조를 나누면 보조 기술과 검색 엔진이 구조를 정확히 파악하도록 돕습니다.

함께 설명하면 좋은 이유 (꼬리질문 대비)

1. <div>나 <span>에 onClick만 달아서 버튼을 흉내 내면 키보드 탭 이동, 스페이스바 클릭, 비활성화(disabled) 처리 등을 모두 수동으로 구현해야 합니다.
2. <section>이나 <article>은 단순 스타일링 래퍼가 아니라 문서 개요에서 독립적인 주제나 구획을 나타낼 때 의미에 맞게 사용합니다.

면접에서 자주 하는 실수

시맨틱 태그 몇 개를 사용했다는 사실만으로 접근성 검증이 모두 끝났다거나 검색엔진 상위 노출이 자동 보장된다고 말하면 안 됩니다.