[web]Semantic web, Semantic tags

박성수·2022년 9월 20일
0
post-thumbnail

시맨틱 웹이란 웹의 사용이 폭발적으로 증가함에 따라 데이터 처리에 있어 사용자가 하나하나 개입해서 처리해야하는 불편함이 나타났다.

이에 따라 컴퓨터가 필요한 정보를 추출, 해석 가공할 수 있도록 제시된게 시맨틱 웹이다.

시맨틱 웹을 사용함으로써 검색엔진이 최적화될 수 있다.

시맨틱 웹을 위해 시맨틱 태그들을 사용해야한다.
시맨틱 태그들에는 header, nav, aside, section, article, footer이 있다.

다음과 같은 태그들을 사용하여 내용이 어느 위치에 해당하는 부분인지 개발자가 명시적으로 사용자들에게 알려줄 수 있다.

제목은 span이나 p div 같은 태그들에 써서 css를 활용하여 제목처럼 꾸며줄 수 있지만
h1태그를 활용한다면 검색엔진도 어떤 것이 제목인지 읽을 수 있고, 사용자가 자료를 검색할 때 추가 점수를 부여할 수 있다고 한다.

(이건 개인적인 생각이지만 시각장애인용 웹에서도 h1태그 p태그나 시맨틱 태그들을 활용한다면 어떤것이 제목이고 어떤것이 본문인지 명확히 알 수 있는 장점도 있는 것 같다.)

span div태그로도 모든 것들을 표현할 수는 있겠지만, 이미지를 넣을 때는 Img태그 제목에는 h1태그 본문에는 p 태그 등 용도에 맞는 태그들을 쓰는 것이 웹의 최적화에도 도움이 되고 내 웹이 더 잘 검색될 수 있게 하는 것 같다.

참조 https://xtring-dev.tistory.com/entry/HTML-%EC%8B%9C%EB%A7%A8%ED%8B%B1-%EC%9B%B9Semantic-Web%EC%9D%B4%EB%9E%80-HTML%EC%9D%98-%EA%B8%B0%EB%B3%B8-%EC%A4%91-%EA%B8%B0%EB%B3%B8

profile
Front-end Developer

0개의 댓글