메타 태그(Meta Tag)
meta태그는 웹 문서에 대한 메타데이터를 웹 브라우저나 검색엔진에게 전달하는 태그입니다.
웹 문서의 메타데이터에는 문자 인코딩, 검색 키워드, 저자, 페이지 초기 설정 등이 있습니다.
모든 메타데이터는 하나의 meta 태그 안에 속성들로 이루어져 있습니다.
meta태그에 어떤 속성들이 있는지 알아보겠습니다.
속성 & 속성 값 | 설명 | |
charset | 문서의 인코딩 방식 | |
name, content | 문서의 메타데이터를 설정(같이 사용됩니다.) | |
http-equiv, content | 전처리 구문 지시자(content 속성과 같이사용) 페이지를 새로고침 하는 리로드 시간을 줄 때 주로 사용된다. |
주로 사용되는 속성들을 정리해봤습니다.
한 가지 주의할 점은 meta 태그를 사용할 시, content 속성을 제외한 다른 속성들은 같이 사용되선 안됩니다.
<meta name="title" content="meta태그"> (사용 가능 O)
<meta charset="utf-8" name="title" content="meta"> (사용 불가능 X)
Meta Chraset 사용
meta 태그 속성 중 하나인 웹 페이지(문서)의 인코딩 방식을 결정하는 태그이다.
해당 속성을 사용해서 웹 페이지를 브라우저 화면상에 출력할 때, 글자가 깨지거나 브라우저와 페이지가
서로 맞지 않는 인코딩 방식을 사용해 알 수 없는 언어로 출력되는 현상들을 올바르게 수정할 수 있다.
웹 페이지와 웹 브라우저의 인코딩 방식이 동일하지 않으면 생겨나는 글자 깨짐 현상
현재 에디터에서 작성 중인 웹 페이지(문서)에 대한 인코딩 방식은 "UTF-8"인 것을 확인.
웹 브라우저에게 해당 문서는 "utf-8" 유형으로 인코딩 되었다고 인지시켜줍니다.
웹 브라우저와 문서 간의 인코딩 방식이 동일하여 올바르게 글자가 표기됩니다.
서로 인코딩 방식이 다르다면?
인코딩 방식이 다르면 어떻게 표시되는지 확인하기 위해, 웹 브라우저에게 "euc-kr" 유형으로 인코딩 되게 전달합니다.
인코딩 방식이 서로 다르므로, 글자 깨짐 현상이 나타나는 것을 확인할 수 있습니다.
'HTML > 기초' 카테고리의 다른 글
[16. 웹 사이트 제작] (0) | 2020.01.08 |
---|---|
[15. 링크 태그(A)] (0) | 2020.01.08 |
[13. 웹 페이지 제목 태그(TITLE)] (0) | 2020.01.07 |
[12. HTML 언어 구조] (0) | 2020.01.07 |
[11. 목록 태그(li,ul,ol)] (0) | 2020.01.06 |