HTML5 시멘틱 태그와 표준을 지키는 이유

HTML5과 웹 브라우저

• .html 이란 확장자를 구동할 수 있는것이 웹 브라우저
• 웹 브라우저는 크롬, 엣지, 익스플로어, 사파리 등등이 있음
• html은 하이퍼텍스트 마크업 언어로 웹 페이지를 위한 지배적인 마크업 언어임
• 마크업 언어는 데이터를 어떤 방식으로 어떻게 표현할지 정의함

시멘틱 태그란?

• 의미를 가진 태그임
• <header>,<footer>,<nav>,<main>,<section>,<article>등이 있음
• 사이트의 구조를 파악하기 쉽고, 코드를 이해하기 쉽고 명확하게 전달해줌
• 코드를 이해하기 쉽다 == 유지보수의 비용을 줄일 수 있다
• 웹 접근성 측면에서도 스크린 리더가 해당 태그를 사용자에게 더 명확한 의미를 전달 할 수 있음

웹 표준이란?

• 브라우저 종류와 버전의 차이에 따라 생기는 차이를 호환이 가능하도록 표준으로 웹 페이지를 제작하는 기법
• 웹 표준의 목적은 웹 사이트에 접속한 사용자가 어떠한 운영체제나 브라우저를 사용하더라도 동일한 결과를 보이게 함
• 웹 표준을 지키면 수정 및 운영관리에 용이하고, 접근성이 향상되고, 검색엔진 최적화, 서버 저장공간 절약, 효율적인 마크업 등의 이점을 얻을 수 있음

웹 접근성이란?

• 어떠한 제약을 가지는 사람이든 모두가 웹 사이트를 이용할 수 있게 하는 방식
• 장애를 가진 사람들에게는 스크린 리더기를 이용하여 웹을 이용하는 것이 대표적인 예시

호환성이란?

• 웹 브라우저 버전, 종류와 관계없는 웹사이트 접근
• 웹 표준 준수를 통한 브라우저 호환성 확보(htm,css문법 준수/ 동작, 레이아웃, 플러그인 호환)