화면을 구성하는데 있어서 meta 태그는 많은 역활들을 하고 있습니다. 사실 meta태그는 HTML 헤드 선언부에 명시된 간단한 태그로 생각들을 많이 하실 수 있는데요. 이 메타태그를 통해 다양한 효과가 발생되기도 합니다.
HTML 문서의 구조는 문서의 기본사항을 정의하는 HEAD, 본문의 내용이 들어가는 BODY 부분으로 아주 크게 나뉘어져 있습니다.
HEAD부에 선언이 되는 meta태그의 경우 그에 걸맞게 많은 기능을 가지고 있는데 대표적으로 가장 많이 사용하는 부분이 인코팅 타입을 설정하는 용도일겁니다.
첫번째 meta태그의 기능으로서 페이지 인코딩을 정의하는 기능이 있습니다.
<meta charset="utf-8">
이렇게 캐릭터 타입을 정해서 페이지에 로드되는 인코딩을 할 수가 있습니다.
두번째로 화면에 표시될 스케일을 정할 수 있는데요. 이런 스케일이란 모바일 화면에서 화면 크기를 조절할 수 있는 기능을 말합니다.
<meta name="viewport" content="width=device-width, initial-scale=1">
위의 기능은 모바일 디바이스에서 화면 확대 기준을 100% 로 정하는 명령어입니다. 이렇게 선언이 안되어 있다면, 화면크기가 모바일화면에서 데스크탑 전체화면으로 보이기 때문에 보기가 아주 불편해 집니다.
세번째로 많이 쓰이는 기능이 다른 페이지로 이동하는 기능을 많이 사용을 하게 됩니다.
<meta http-equiv="refresh" content="10;url=http://tistory.com">
위의 소스는 10초뒤에 티스토리로 사이트가 이동되는 예제입니다. 잘 응용해서 사용해보세요.
