html/html_css

메타태그의 구성 및 설명

갓리버리 2014. 1. 21. 13:45

님이 메타 테그에 대해서 혼란스러워하니 최대한 쉽고 간단하게 설명 하겠습니다.

일반적으로 많이 쓰이고 기본적인 메타 테그에 대해서 개념을 잡는것이 중요하겠군요.

 

먼저 META TAG 라는 것은..

웹페이지에 관한 정보를 제공하는 특별한 HTML 태그입니다.

일반적인 HTML 태그들과는 달리, 메타 태그는 웹페이지의 표현에는 영향을 미치지 않습니다.

그 대신에, 누가 그 페이지를 만들었으며, 얼마나 자주 갱신되는지, 그 페이지는 무엇에 관한 것인지 등과 같은 정보를 제공하며, 그 페이지의 내용을 함축적인 키워드로 표시합니다.

많은 검색엔진들이 인덱스를 만들 때, 이 정보를 이용하게 되죠.

메타 태그는 <HEAD> 와 </HEAD> 태그 사이에 위치하며 문서 전체에 대한
간단한 요약내용을 담고 있으며 브라우저 상에는 메세지가 나타나지 않습니다.

 

대표적인 예로.

검색엔진에서 키워드 검색 이라는것을 많이 사용했죠.(지금은 거의 효과가 없지만)

meta name에 keyword 라고 정하고 content에 그 홈페이지에 관한 키워드들을 넣어두면..

검색엔진(검색 로봇)이 HEAD안에 들어간 키워드를 보고 찾아갑니다.

<META NAME="Keywords" CONTENT="HTML, tags, reference, attributes, 태그강좌,">

위와 같이 키워드를 첨가하죠.

 

META TAG의 속성에는

1)http-equiv

2)name

3)charset

4)schame

등이 있는데 hrrp-equiv 속성과 name속성만 알고 있으면 될것 같습니다.

 

1)님이 물어보신 HTTP-EQUIV 속성 은..

이름과 값의 쌍으로 이루어지는데 실제 문서를 보내기 전에 브라우저에 보낼 MIME (각 문서의 타입)문서 헤더에 이름/쌍 값을 포함시킬것을 서버에 지시하는 것입니다.

 

HTTP-EQUIV 속성에는 Content-Type, Refresh, Expires 속성이 있습니다.

HTTP-EQUIV="Content-Type" - 웹문서의 언어를 설정합니다.

HTTP-EQUIV="Refresh" - 문서를 자동으로 업데이트 합니다.

HTTP-EQUIV="Expires" - 문서의 유효기간을 지정합니다.

 

 

콘텐트 타입의 사용예: <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=euc-kr">

-콘텐트 타입은 드일위버나 어데터 프로그램에서 페이지를 생성하면 자동으로 첨부되어지는 메타 테그인데 만약  이 테그가 들어가지 않는다면 간혹 홈페이지 글이 다른 언어로 깨어지거나 변형되어 집니다.이유는 익스플러러에서 콘텐트 타입을 인식하지 못했기 때문이죠.

콘텐트 타입은 언어마다 여러가지 있습니다.

한국어는 charset=euc-kr 입니다.

 

리프레시 업데이트 사용예: <meta http-equiv="REFRESH" content="15;URL=http://galaxy.channeli.net/jakalky/sitemap.htm">

-홈페이지를 방문하고 자동으로 다름 페이지로 이동하게 할때 사용합니다.

"몇 초후에 자동으로 어디로 이동합니다"라는 것으로 많이 사용합니다.

 

문서의 유효기간 사용예: <META HTTP-EQUIV="expires" CONTENT="Sun, 30 Aug 1998 09:32:45 GMT">

-보안에 관계되는 문서 같은 경우 한번 보고 나면 문서가 파기되며
다시 보려고 하는경우 리로드해야만 보이는 웹문서를 보신 기억이 있을겁니다.
보통 멤버쉽으로 운영되는 웹사이트에서 개인 프로필을 본다음 다른 사이트로
갔다가 브라우저의 back버튼을 이용해서 프로필 화면으로 다시 와보면
파기된 문서라는(Expires) 메세지를 받게 되는데 이런경우가 해당됩니다.

GMT를 사용해서 표준시각으로 파기될 날짜를 지정할수도 있습니다.

 

2)HTTP-EQUIV 속성외에 META 테그에 대한 속성에는 NAME 속성 있습니다.

name과 content 로 이루어지는데 키워드를 알려주거나 페이지 저작자등의 속성을 알려주는것입니다.

 

name의 속성에는 keywords,subject,description등이 있습니다.

NAME="Description" - 문서의 요약이 들어갑니다.

NAME="Keywords" - 검색어를 입력하며 각 검색어는 ,(콤마)로 분리되야 합니다.

NAME="Author" - 페이지 제작자를 적습니다. 저작권에 관한 부분이라고 생각하셔도 됩니다.

NAME="subject"-홈페이지의 제목을 정합니다.어떠한 주제를 다루느냐 하고 입력해놓은 부분입니다..

 

데스크립션의 사용예: <META name="Description" content="html의 모든것,메타 테그의 상세한 설명!" >

-name의 description옵션입니다.
이는 검색엔진이 해당하는 페이지를 찾고나서 간략한 요약을 표시해 줄때 뜨는 내용이죠..
그 내용은 content안의 글이 나오게 됩니다...
따라서 자신의 홈페이지에 대해 가장 알맞고 효과적인 설명을 해줘야 겠습니다.

지금은 잘 쓰이지 않습니다.

키워드의 사용예: <META NAME="Keywords" CONTENT="HTML, tags, reference, attributes, 태그강좌,">

-가장 중요한 부분입니다..
자신의 홈페이지를 찾을때 해당하는 검색어를 지정해주는 내용입니다.
name의 keyword옵션이 바로 그러한 검색어를 지정해주는 기능을하죠..
content란에는 해당하는 검색어를 넣어야 합니다.

하지만 지금은 검색엔진에서 잘쓰이지 않습니다.

 

author의 사용예: <NAME="Author" CONTENT="hyunjung,Kim">

-이 페이지를 만든이의 이름을 넣습니다.

잘쓰이지 않습니다.

 

서브젝트의 사용예: <META name="Subject" content="메타 테그">

-해당하는 페이지에 관한 제목을 설정하는 부분이죠..
어떠한 주제를 다루느냐 하고 입력해놓은 부분입니다..
검색 로봇이 사용합니다.

지금은 잘쓰이지 않습니다.

 

3)charset 속성은 인터넷 익스플로러만 제공하는데 이 속서으이 값은 문서에서 사용하는 문자셋의 이름입니다. 되도록 이 속성대신에 http-equiv와 content 속성을 사용할것을 권장하는군요.

 

4)schame는 이 속성을 사용하여 속성의 값을 해석할때 사용할수 있는 방법을 명시할수 있습니다. 이 방법은 <head>의 프로파일 속성에서 (이 문서을 더 잘 설명해 줄수 있는 관련된 프로파일의 URL) 지정한 프로파일에 정의되 있어야 합니다.

 

결론-

현재 검색엔진에 홈페이지를 검색하는 방식은 메타 테그를 잘 이용하지 않기 때문에 과거와 달리 현재는 거의 신경을 쓰지 않습니다.

키워드를 넣는다거나 데스크립션과 서브젝트는 네어버,야후에 홈페이지를 등록할때 프로파일과 안내문으로 대신하기 때문이죠.

다만 HTTP-EQUIV의 refresh나 Content-Type, Expires등은 필요에 의해서 쓰입니다.

 

http://kin.naver.com/detail/detail.php?d1id=1&dir_id=109&eid=feotkgqXdt2nTQwAv2p5aU5jqr6wdnjY&qb=uN7FuMXCsdcgsMu79g==&pid=fLVM9woi5Thsstfart0sss--219571&sid=SNsO9%40L-2kgAABSFqVU