HTML5에서 달라진 태그들

Home Search

HTML4에서 사용하던 태그들은 HTML5로 넘어와서도 그 기능이 거의 바뀌지 않았지만 아주 일부 태그들은 용도가 달라진 것들이 있습니다. 이 부분은 잘 알아두어야 HTML5로 웹 페이지를 만들 때 혼란스럽지 않을 것입니다.

텍스트 기울이기 - <i>태그

HTML4에서 <i>태그는 italic의 약자로 글자를 기울어지게 표시합니다. 하지만 HTML5에서는 외국어나 분류학적인 용어, 기술 용어, 선박 이름, 대본에서의 무대 지문, 일부 악보 기록, 또는 생각이나 손으로 직접 쓴 텍스트등 다른 텍스트와 구별되는 텍스트를 표현할 때 사용합니다.

텍스트를 진하게 - <b>태그

<b>태그는 특별히 중요하지는 않지만 진하게 표시하려고 할 때에 사용합니다. <strong>태그는 의미상 중요할 때, <em>태그는 기울어진 텍스트로 강조하려고 할 때, <mark> 태그는 하이라이트 효과를 주려고 할 때 사용하는데, 이외의 경우에 텍스트를 강조하고 싶을 땐 <b>태그를 사용하면 됩니다. 이 태그들은 화면에는 비슷하게 보이지만 검색로봇은 태그로 의미를 인식하기 때문에 사용에 유의 해야 합니다.

포커스를 받지 못하는 텍스트 - <small>태그

HTML4에서 <small>태그는 글자를 작게 만드는 태그였지만 HTML5에서는 웹 페이지의 푸터에 있는 저작권 문장이나 라이센스 정보처럼 포커스를 받지 못하는 텍스트 콘텐츠용으로 사용됩니다. 단, <p>태그를 사용한 단락이나 목록 같은 블록 단위 콘텐츠에서는 <small>태그를 사용하면 안 됩니다. 이런 콘텐츠들은 메인 콘텐츠로 취급하기 때문 입니다.
그리고 글자를 작게 만들려면 CSS를 사용하면 되기 때문에 <small> 텍스트라고 해서 주변 텍스트보다 작아야 하는것은 아닙니다.

단락의 주제을 바꾸는 - <hr>태그

<hr>태그는 마치 소설에서 장면이 바뀌는 것처럼 웹 페이지 안에서 주제가 바뀔 때 사용하는 태그입니다. <section> 태그를 사용해도 내용과 내용을 구분할 수는 있지만 <hr>태그는 주제가 바뀐다는 데 좀더 무게가 실립니다.그리고 <p>태그를 사용해 단락을 나누는 대신 <hr> 태그를 사용해도 됩니다.