검색엔진에 중요한 걸 알려주세요 - 의미 있는 html 태그

검색엔진에 중요한 걸 알려주세요 - 의미 있는 html 태그라고 제목을 정하긴 했지만, 사실 의미가 없이 사용되는 태그는 없겠지요. 하지만 조금 더 의미 있게 태그를 부여하게 되면 조금 더 좋은 영향을 줄 수 있습니다. "10~12년 전 문서 하나 제대로 인덱싱하는 것도 버거워하던 검색엔진이 아니다"는 말이 있듯이 현재의 검색엔진들은 문서의 전체적인 의미를 분석하게 됩니다. 그중에서도 제일 중요한 게 '본문영역'이 되겠고, 그전의 우선순위는 '타이틀'이 되겠지요. 디자인적인 태그와 조금은 의미가 부여된 태그를 적절히 사용하면 검색엔진 최적화뿐만 아니라, 의미론적인 시멘틱한 문서의 구조가 완성될 수 있습니다.


중요한 html 태그 시작합니다.
부제 : 검색엔진은 태그를 좋아합니다.
요약 : 의미 있는 html 태그
작성자 : 해커 C (Hackerc.com)
주의 : 실제와 다른 내용이 포함될 수도 있습니다.


의미가 다른 html 태그1.png

1. 디자인은 똑같지만, 의미가 다른 태그 (b, i, strong, em 태그)
문서(블로그 글) 작성할 때 조금 강조하고 싶은 단어나 문장 자체에 진하게 효과를 넣으시죠?? 대부분 기본 편집기에서 제공되는 <b>,</b> 태그를 사용하여 진하게 효과를 넣게 되죠. 그리고 사람의 말을 글자로 표현할 때 쓰게 되는 기울이기 효과 <i>,</i> 태그들, 실제 b 와 i 태그는 디자인적인 효과만 나타나며, 검색엔진이나 리더(스크린 리더)와 프로그램에서는 일반 텍스트로 인식하게 됩니다. 조금 더 중요하니까 효과를 적용하게 되었겠지만, 시력이 있는 사람만 인식이 가능한 태그이며 디자인적인 부분만 작용하게 된다는, 그와 반대로 'strong' 태그와 'em' 태그는 디자인과 중요도를 함께 포함하고 있습니다. 검색엔진에서도 많은 영향은 아니지만, 플러스 요인으로 작용하게 됩니다.


의미가 다른 html 태그2.png

2. 디자인은 똑같지만 입력해야 하는 태그도 다르다는 사실.
수정 작업을 많이 해야 하거나 복잡한 것도 없어서 쉽게 사용 가능합니다. 중요도에 따라 <strong> 혹은 <em> 태그를 입력해주시면 됩니다. 중요도는 없지만, 진하게 혹은 기울여서 보여주고 싶을 땐 <b>와 <i> 태그의 선택이 옳다고 봅니다.


Hn 태그의 종류.png

3. 헤딩태그 1~6 종류별 크기
티스토리 블로그 하기 전 사이트 운영할 때부터 고민이었던 게 'Hn' 태그였습니다. <Hn> 태그는 1~6단계까지 제공되며 스타일을 적용하지 않을 땐 기본 크기들이 정해져 있어서, 그냥은 잘 사용하지 않게 되는 태그 중의 하나입니다. 하지만 검색엔진이 해당 페이지를 분석할 때 최대한 구조적으로 문서를 인덱싱할 수 있게 도와주는 태그가 <Hn>의 구성입니다. 일반적으로 h1 ~ h4까지 많이 사용하게 되며, 티스토리 블로그는 기본적으로 h1 태그는 블로그 이름(타이틀)에 지정이 되어 있습니다. (물론, 수정 가능합니다.)


헤딩태그의 적절한 사용.png

4. 헤딩태그(Hn) 사용하기
적절한 (문서 속에서 분류를 나눌 때 제목이 되는) 부분에 2~4단계를 지정해 주시면, 가장 구조적으로 알맞은 문서가 되지 않을까 생각이 드네요. html 편집 모드를 이용하여 h1 ~ h6 까지 만 사용하시면 됩니다. (모든 헤딩태그를 다 써야 하는 건 아닙니다. 해당 문서의 내용과 길이에 따라 다르겠죠.)


p태그의 오남용.png

6. 의미 없는 태그는 사용하지 않는 거 보다 못합니다.
티스토리 블로그를 이용하시는 분들이라면 쉽게 발견되는 의미 없는 문단 태그입니다. 줄 바꿈을 위해 엔터(Enter)를 눌렀지만, <p><br /></p> 이런 구성으로 자동 입력이 됩니다. 보통 티스토리 블로그에서 이미지를 추가하고 밑에 텍스트를 입력하는 구간에 많이 발생하며, 자동 입력이 되어 의미 없이 자원까지 낭비하게 됩니다.


중요한 키워드를 알려라.png

사실 의미 없는 태그는 없겠지만, 최대한 글을 쓰는 본인이 알리고자 하는 중요한 문구들은 중요한 태그로 감싸주는 게 검색엔진과 리더기, 또 다양한 접근에서도 효과적인 건 사실입니다. 하지만 이런 중요도를 부여하는 태그도 과하게 사용하게 된다면 부작용이 있습니다. 검색엔진이 해당 문서를 색인하면서 어디가 중요한 부분인지 구분 짓기 어려운 예도 있으며, 스크린 리더와 같은 프로그램을 이용해야 하는 분들께서도 문서의 중요포인트를 이해하기 어렵게 되는 부작용이 있으니, 적절하게 사용하는 게 좋습니다. (스크린 리더를 사용해보시면 중요도를 나타내는 태그가 어떠한 효과인지 쉽게 알 수 있습니다.)


Plus+
글자를 굵고, 크고, 디자인적인 면을 위해 태그가 사용되는 경우보다, 중요하니까 굵고, 크고, 디자인적으로 다른 텍스트와 달라야 한다는 의미로 사용되어야 합니다. 중요도를 나타내는 태그가 없다고 검색엔진에 노출되지 않는 건 아닙니다. 또, 태그를 적절히 사용한다고 무조건 상위권에 노출되는 것도 아닙니다. 하지만 검색엔진이 전 세계에 하나만 있는 게 아니며, 해당 문서에 정상적인 시력을 가진 사람만 접근하는 것도 아니라는 게 중요합니다.


글 작성하실 때 많이들 사용하시는 방법 있으시죠? 본문 시작과 동시에 제목을 반복해주고 '진하고 굵게' 효과 주시는 경우들 많으시죠?? 그런 경우 단지 시각적인 효과만을 위해서 하시는 것은 아니실 거 같습니다만, 한번 확인해보시고 중요한 부분이기 때문에 중요도를 나타내는 태그를 적당히 사용해보세요. 디자인적인 면과 중요도와 다른 외부적인 접근에서도 좋은 효과가 있는 게 제일 좋겠죠.!?