질문
" Semantic HTML의 필요성을 예시를 들어 설명해주세요. "
- 위 질문에 내가 생각한 질문의 요점 : Semantic HTML을 적절하게 사용하고, 그 이유를 안다.
답변
"Semantic HTML은 구조를 만드는 것을 넘어
의미를 갖게 만드는데 필요합니다.
시맨틱 요소의 예시로는 header, main, nav, footer tag 등이
있습니다.
HTML에는 많은 종류의 요소가 있지만, div와 span tag 두 가지 요소만 알아도 충분히 화면의 구조를 만들 수 있습니다.
하지만, 이 두 요소의 이름에는 의미가 없기 때문에
요소의 이름으로는 각 요소가 어떤 역할을 하는지 알 수 없습니다.
하지만 시맨틱 요소를 사용하면 요소의 이름만 보고도
해당 요소가 어떤 역할을 하는지, 요소가 가진 의미를 통해 파악할 수 있게 됩니다.
시맨틱한 HTML을 작성하면 개발자간 소통, 검색 효율성, 웹 접근성에 효과를 볼 수 있습니다.
요소의 이름만 봐도 의미를 파악할 수 있기 때문에 그만큼 의미를 전달하기 위한 시간과 id, class 작성에 필요한 시간 소모도 줄어들고 개발자간 소통이 원활해집니다.
또한 검색 엔진은 HTML 코드를 보고 문서의 구조를 파악하기 때문에 시맨틱 요소를 사용함으로써 HTML에 의미를 부여하는 것만으로도 검색 효율성을 높일 수 있습니다.
마지막으로 시맨틱 요소를 사용하면 화면의 구조를 짜는 것을 넘어 구조에 대한 정보를 전달할 수 있어 요소에 담긴 콘텐츠도 더 명확하게 전달할 수 있으므로 웹 접근성을 향상시킬 수 있습니다"
Hello world!