Semantic HTML의 필요성을 예시를 들어 설명해주세요.
인터넷의 발전으로 방대한 웹 문서가 생기면서 제각기 일관적이지 않은 문서 구조는 원하는 정보를 찾기 힘들어지는 원인이었다. div태그의 기능과 마찬가지로 block element이면서 사이트의 구조(레이아웃)을 설계하기 위한 태그.
HTML의 구조를 설계하는데에 있어 의미를 부여함으로써 사이트의 구조를 파악하기 용이할 수 있도록 도와주는 태그.
시멘틱 태그의 장점
1. SEO 최적화에 유리
검색 엔진이 태그의 목적에 부합하게 설계 되어있는 구조의 사이트에서 더욱 효과적으로 정보를 파악할 수 있어 검색 결과의 노출에 유리할 수 있게 해준다.
2. 웹 접근성에 효율적
일반적인 브라우저에서는 차이가 없지만 스크린 리더와 같은 환경에서는 웹 접근성과 사용성을 향상 시켜준다.
3. 유지보수의 용이성
태그의 이름만 봐도 어떤 영역인지 바로 확인이 가능하며 해당 태그에 맞는 작업을 구분하여 진행하기 용이하다.
오늘도 한 발자국 더 나아가.