html 제목태그의 필요성

 

제목태그(h태그)

h1, h2, h3, h4, h5, h6 

이렇게 html의 제목 태그가 존재하지만 제목태그를 사용하지 않아도 같은 결과를 줄 수 있습니다.

시맨틱 태그등을 사용하지 않아도 div나 sapn만으로도 코딩이 가능합니다.

실제로 div만으로 코딩하신분도 몇번 본적이 있습니다.

결과로 보면 비슷해 보이지만 html에 의미에 맞게 사용해야 합니다.

오늘은 그이유에 대해서 알아보겠습니다.

 

 

아래와 같은 코드가 있을때

<h3>title</h3>

<strong><span stype="font-size:24px">title</span></strong>

 

위에처럼 <h3></h3>의 제목태그로 감싼 코딩과 아래와 같이 strong과 sapn으로 깜싸고 스타일을 준 코딩은 결과만 보면 차이가 없어 보입니다.

 

하지만 여러가지 이유로 제목태그를 사용할 것을 권장합니다.

 

 

제목태그의 필요성

 

1. 간결함

위에 예시 코드만 봐도 알겠지만 제목 태그를 사용하는 편이 훨씬 간결하게 쓸 수 있고 여기가 제목이구나 라고 한번에 알 수 있습니다.

 

 

2. 검색엔진에 유리

웹 페이지는 어떤 내용을 담고 있는지 태그에 근거해서 정돈 합니다.

사용자가 위에 title을 검색했을때 제목태그로 감싼 title을 좀더 높게 쳐주기 때문에 상단에 올라갑니다.

웹사이트를 만들때는 홍보목적이 크기 때문에 검색했을때 상위에 뜨느냐 안뜨느냐는 비지니스 측면으로 정말 중요한 부분이고 이렇게 h1, h2, h3같은 제목태그로 감쌌느냐 아니냐에 따라 수백페이지 까지 차이가 날 수 있다는 것입니다.

즉 검색엔진에 거의 노출이 되지 않는 것입니다. 이미지로 글을 작성하는 경우도 검색 엔진에게는 존재하지 않는 페이지가 되기 때문에 검색에 불리한 사이트가 됩니다.

즉 html의 의미에 맞게 정확하게 사용한다는 것은 비즈니스 적은 부분에서도 매우 중요합니다.

 

 

2. 접근성

웹에서 중요한것 중 하나가 장애가 있는 분들도 정보접근에 소외가 되지 않아야 한다는 부분입니다.

장애가 있는 분들은 스크린리더 같은 보조장치로 접속을 하는데 그때 html이 정확하게 의미에 맞게 사용되지 않을 경우 누군가에게는 접근이 불가능한 사이트가 될 수 있습니다.