|
|
| 강아지랑 송아지도 만들 수 있는 HTML 강좌 - 06편 : 메타 태그 |
#1. 메타태그
메타 태그란 일반적으로 head태그 안에 사용해주는 '설정'의 일부라고 생각하시면 됩니다.
접속하는 웹브라우저와 검색엔진이 볼 수 있는 정보를 표시해주는데,
어떤 것은 필수이며, 어떤 것은 필수는 아니지만 최근에 각광을 받고 있는 중요한 태그입니다.
[ META 태그]
메타태그는 발음 그대로 이렇게 써줍니다.
열고 닫는 것 없이 그냥 저렇게만 써줍니다.
단지 다른 태그와는 다르게 각 용도별로 여러 개의 메타태그를 써줍니다.
그래서 head 태그 안에는 보통 여러 개의 메타 태그가 포함됩니다.
메타태그는 예상하신대로 용도별로 속성과 사용 방법이 있습니다.
우선 메타태그에서 가장 중요한, 필수인 사용법을 하나 살펴보겠습니다.
[ 웹 브라우저에게 html문서에서 사용하는 언어를 알려주자 ]
지금까지 인터넷을 하면서 한 번쯤은 글자가 이상하게 깨져있는 웹페이지에 접속해본 적이 있을 겁니다.
분명히 한국어로 된 홈페이지인데도 글자는 전혀 알아볼 수 없게 되어있는 곳.
혹은 다른 곳은 다 멀쩡한데 페이지 한 중간의 글씨가 알아볼 수 없게 되어있는 곳.
이런 곳들은 모두 지금 이야기하는 메타태그를 지정해주지 않았기 때문에 문제가 발생한 곳들입니다.
웹브라우저는 인터넷의 웹페이지에 접속하면 저희가 작성한 html 을 포함해서 다양한 컴퓨터 언어를 읽어들이고 처리합니다. 이것을 '인코딩'이라고 하는데 사실 특정 국가의 언어만이 아닌 더 넓은 의미입니다. 하지만 저희는 몰라도 됩니다.
요는 이것을 지정하지 않으면 웹브라우저가 어찌할줄 몰라하다가 대충 표시를 해서 글자가 다 깨지게 됩니다. 그러므로 잘 지정해줍시다. 방법은 아래와 같습니다.
<META http-equiv="Content-Type" content="text/html; charset=EUC-KR">
메타 태그는 자세하게 분석해서 알 필요는 없습니다. 그냥 이걸 썼을 때 어떤 효과가 있는지만으로 충분합니다. 만약 나중에 어떤 필요에 의해서 이 태그의 값을 바꿔주게 될 경우 charset=EUC-KR 이 부분을 바꿔주게 될 것입니다. 우선은 그 정도만 알고 넘어가면 됩니다.
그 외 주요 메타태그
<META name="author" content="제작자"> : 홈페이지를 만든 사람의 이름을 써주는 태그입니다.
<META name="copyright" content="저작권자"> : 홈페이지의 저작권을 갖고 있는 사람의 이름을 써줍니다.
<META name="keywords" content="검색어"> : 검색엔진이 해당 페이지를 읽을 때 힌트가 될 검색어들입니다. 콤마로 구분해서 여러개를 씁니다.
<META name="description" content="설명"> : 검색엔진이 참고할 페이지의 설명을 기입합니다.
<META name="robots" content="noindex"> : 검색엔진이 이 페이지를 취급하지 못하게 합니다. (강제력이 있는 건 아님)
<META http-equiv="refresh" content="시간; url=웹페이지 주소"> : 해당 사이트 접속 시 지정 시간(초 단위) 경과 후 자동으로 url에 지정된 사이트로 이동합니다.
메타 태그는 사용하시고 싶은걸 그냥 쭈욱 나열해서 적으시면 됩니다.
예를 들어 위의 태그를 다 쓰고 싶으시면 그냥 다 써버리시면 다 적용됩니다.
이 정도만 알아두면 충분하겠네요. 관심이 있는 분은 더 찾아보시기 바랍니다.
참고로 검색엔진과 관련된 부분은 최근 검색엔진 친화형 사이트라는 개념이 떠오르면서 중요하게 부각되고 있답니다.
#2. 웹페이지에 이름을 달아주자
[ title 태그]
이건 기본 중의 기본이지만 head 태그 내부와 연관있는 것이라서 지금 이야기합니다.
웹페이지에 접속하면 브라우저 좌측상단에 페이지의 이름이 뜨죠?
예를 들면 네이버에 접속하면 네이버라고 뜨고, 제 홈페이지에 접속하면 '추억의 상자'라고 뜨고.
저 이름을 페이지마다 지정해줄 수 있습니다. (지정하지 않으면 untitle이던가 이상한 글자 뜹니다.)
title 태그는 head 태그 안에서 써서 페이지의 이름을 써줍니다.
방법은 다음과 같습니다.
(예)
<head>
<title>페이지 이름</title>
</head>
|
끝입니다. 쉽죠?
앞으로 3강 남았습니다 그러면 html 끝입니다. |
|
[PREV] [1] ... [34][35][36][37][38][39][40] ... [50] [NEXT]
猫愛 - MyoAe - Homepage Mode
Ver. 1.45
by Aierse |
|
|