뻔한얘기는 생략하고,
HTML뒤에 왜 5가 붙었느냐? 예상한대로 이 숫자는 버전이다.
필자가 처음 웹을 배울때는 HTML4.01인가 였는데 어느순간 HTML5가 대세가 되었다.
그당시 웹은 DIV가 매우 남발되던 시기였는데, 그 이유는 현재 사용되는 시멘틱 태그가 없었기때문이다
따라서 자연스럽게 ID선택자도 많이 사용되었다.
<div id="header"></div>
<div id="main"></div>
<div id="footer"></div>
이런식으로 말이다.
따라서 이러한 야매(?)스러운 코딩을 줄이고 좀더 표준화 하자고 만든게 HTML5라고 생각된다.
굳이 모든 작업자가 id="header"를 사용하는데 <header>라는 태그를 만들지않을 이유는 없지않는가?
또 이런걸 시멘틱 태그라고 하는데 필자는 영어를 죽어도 안하는 영포자였지만 이 단어는 외웠다.
"sementic = 의미론적인"
학교에선 컴퓨터가 문서를 읽을때 어느부분이 어떤 기능과 역할을 하는지 알 수 있게 코딩하는거라고 배웠는데 무슨말인지 1도 몰랐다.
최근 웹접근성 수업을 듣다가 조금 이해가 되었는데 한가지 예시를 들어보자.
일반적로 시각장애인은 스크린리더기라는 디바이스를 이용해서 웹페이지를 이용한다.
이 스크린리더기는 html태그를 순차적으로 읽으면서 내용을 보이스로 읽어준다.
예를들어 "로그인 페이지로 이동 - 아이디 입력창 - 비밀번호 입력창 - 로그인 버튼" 이런식으로 읽어줄텐데,
여기서 '입력창', '버튼', '이동' 이라는 단어에 관심을 가져봐야한다.
만약 흔히들 하는실수로 로그인 버튼을 <a>태그로 작성을 했다면 어떻게 될까?
스크린리더기가 "로그인 이동" 이렇게 읽어주지 않을까 예상된다.
그렇다. 각 태그마다의 역할이 정해져있는데 이를 제대로 쓰지 않는다면 이런 현상이 일어나게된다.
따라서 아까 거론되었던 시멘틱이란 스크린리더 또는 인터프리터가 html문서를 읽을때 모든 요소들이 제 역할대로 인식되도록 퍼블리셔가 홈페이지를 제작하는것을 의미하며, 이러한 문서를 HTML5라고 한다.