>  기사  >  웹 프론트엔드  >  html 메타 요약, html 태그의 메타 속성 사용 소개

html 메타 요약, html 태그의 메타 속성 사용 소개

WBOY
WBOY원래의
2016-08-27 08:53:561253검색

인용문: http://www.haorooms.com/post/html_meta_ds

머리말

meta는 HTML 언어의 헤드 영역에 있는 보조 태그입니다. 어쩌면 이 코드가 필요없다고 생각할 수도 있습니다. 실제로 메타 태그를 잘 활용하면 예상치 못한 효과를 가져올 수 있습니다. 메타 태그의 기능은 검색 엔진 최적화(SEO), 페이지에서 사용되는 언어 정의, 자동으로 새 페이지 새로 고침 및 지정, 효과, 페이지 버퍼링 제어, 웹 페이지 평가 및 평가, 웹 페이지 표시 창 제어 등!

html의 메타 요약

메타태그의 구성: 메타태그에는 http-equiv 속성과 name 속성의 두 가지 속성이 있습니다. 이러한 서로 다른 매개변수 값은 서로 다른 웹페이지 기능을 구현합니다.

1. 이름 속성

이름 속성은 주로 웹페이지를 설명하는 데 사용되며, 해당 속성 값은 콘텐츠입니다. 콘텐츠의 콘텐츠는 주로 검색 엔진 로봇이 정보를 찾고 분류하는 데 사용됩니다.

메타 태그의 이름 속성 구문 형식은 다음과 같습니다.

<code><span class="tag"><meta<span class="pln"> <span class="atn">name<span class="pun">=<span class="atv">"参数"<span class="atn">content<span class="pun">=<span class="atv">"具体的参数值"<span class="tag">><span class="pln">。 </span></span></span></span></span></span></span></span></span></span></code>

name 속성에는 주로 다음과 같은 매개변수가 있습니다.

가. 키워드 

설명: 키워드는 검색 엔진에 웹 페이지의 키워드가 무엇인지 알려주는 데 사용됩니다.

예:

<code><span class="tag"><meta<span class="pln"> <span class="atn">name<span class="pun">=<span class="atv">"keywords"<span class="atn">content<span class="pun">=<span class="atv">"meta总结,html meta,meta属性,meta跳转"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

나. 설명(웹사이트 콘텐츠 설명)

설명: 설명은 검색 엔진에 웹사이트의 주요 콘텐츠를 알려주는 데 사용됩니다.

예:

<code><span class="tag"><meta<span class="pln"> <span class="atn">name<span class="pun">=<span class="atv">"description"<span class="atn">content<span class="pun">=<span class="atv">"haorooms博客,html的meta总结,meta是html语言head区的一个辅助性标签。"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

C.로봇(로봇 가이드)

설명: 로봇은 검색 로봇에게 색인을 생성해야 하는 페이지와 색인을 생성할 필요가 없는 페이지를 알려주는 데 사용됩니다.

콘텐츠 매개변수에는 all, none, index, noindex, follow, nofollow가 포함됩니다. 기본값은 모두입니다.

예:

<code><span class="tag"><meta<span class="pln"> <span class="atn">name<span class="pun">=<span class="atv">"robots"<span class="atn">content<span class="pun">=<span class="atv">"none"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

구체적인 매개변수는 다음과 같습니다.

정보 매개변수는 모두입니다. 파일이 검색되고 페이지의 링크를 쿼리할 수 있습니다.

정보 매개변수가 없음: 파일이 검색되지 않으며 페이지의 링크를 쿼리할 수 없습니다.

정보 매개변수는 index입니다. 파일이 검색됩니다.

정보 매개변수는 다음과 같습니다. 페이지의 링크를 쿼리할 수 있습니다.

정보 매개변수는 noindex입니다. 파일은 검색되지 않지만 페이지의 링크는 쿼리할 수 있습니다.

정보 매개변수는 nofollow입니다. 파일은 검색되지만 페이지의 링크는 쿼리할 수 없습니다.

D.작가(저자)

지침: 웹페이지 작성자를 표시하세요

예:

<code><span class="tag"><meta<span class="pln"> <span class="atn">name<span class="pun">=<span class="atv">"author"<span class="atn">content<span class="pun">=<span class="atv">"root,root@xxxx.com"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

E.제너레이터

<code><span class="tag"><meta<span class="pln"> <span class="atn">name<span class="pun">=<span class="atv">"generator"<span class="atn">content<span class="pun">=<span class="atv">"信息参数"<span class="tag">/></span></span></span></span></span></span></span></span></span></code>

메타태그 생성기의 정보 매개변수는 웹사이트를 생성하는 데 사용되는 소프트웨어를 나타냅니다.

F, 저작권

<code><span class="tag"><META<span class="pln"> <span class="atn">NAME<span class="pun">=<span class="atv">"COPYRIGHT"<span class="atn">CONTENT<span class="pun">=<span class="atv">"信息参数"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

메타태그의 COPYRIGHT 정보 매개변수는 웹사이트의 저작권 정보를 나타냅니다.

G.재방문 후

<code><span class="tag"><META<span class="pln"> <span class="atn">name<span class="pun">=<span class="atv">"revisit-after"<span class="atn">CONTENT<span class="pun">=<span class="atv">"7days"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

revisit-after는 웹사이트 재방문을 나타내고, 7days는 7일을 나타냅니다.

2. http-equiv 속성

http-equiv는 이름에서 알 수 있듯이 http의 파일 헤더 기능과 동일합니다. 웹 페이지 콘텐츠를 정확하고 정확하게 표시하는 데 도움이 되는 몇 가지 유용한 정보를 반환할 수 있으며, 해당 속성 값은 content입니다. content in content 내용은 실제로 각 매개변수의 변수 값입니다.

메타 태그의 http-equiv 속성 구문 형식은 다음과 같습니다.

<code><span class="tag"><meta<span class="pln"> <span class="atn">http-equiv<span class="pun">=<span class="atv">"参数"<span class="atn">content<span class="pun">=<span class="atv">"参数变量值"<span class="tag">><span class="pln">; </span></span></span></span></span></span></span></span></span></span></code>

http-equiv 속성에는 주로 다음 매개변수가 있습니다.

만료

설명: 웹페이지의 만료 시간을 설정하는 데 사용할 수 있습니다. 웹페이지가 만료되면 서버로 다시 전송되어야 합니다.

사용법:

<code><span class="tag"><meta<span class="pln"> <span class="atn">http-equiv<span class="pun">=<span class="atv">"expires"<span class="atn">content<span class="pun">=<span class="atv">"Fri,12Jan200118:18:18GMT"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

참고: GMT 시간 형식을 사용해야 합니다.

B. Pragma(캐시 모드)

설명: 브라우저가 로컬 컴퓨터 캐시의 페이지 콘텐츠에 액세스하지 못하도록 합니다.

사용법:

<code><span class="tag"><meta<span class="pln"> <span class="atn">http-equiv<span class="pun">=<span class="atv">"Pragma"<span class="atn">content<span class="pun">=<span class="atv">"no-cache"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

참고: 이 설정을 사용하면 방문자는 오프라인으로 검색할 수 없습니다.

C.새로고침

설명: 자동으로 새로고침하고 새 페이지를 가리킵니다.

사용법:

<code><span class="tag"><meta<span class="pln"> <span class="atn">http-equiv<span class="pun">=<span class="atv">"Refresh"<span class="atn">content<span class="pun">=<span class="atv">"2;URL=http://www.haorooms.com"<span class="tag">><span class="pln"> //(注意后面的引号,分别在秒数的前面和网址的后面) </span></span></span></span></span></span></span></span></span></span></code>

참고: 2는 2초 동안 머물렀다가 자동으로 URL을 새로 고치는 것을 의미합니다.

D.세트-쿠키(쿠키설정)

참고: 웹페이지가 만료되면 저장된 쿠키가 삭제됩니다.

사용법:

<code><span class="tag"><meta<span class="pln"> <span class="atn">http-equiv<span class="pun">=<span class="atv">"Set-Cookie"<span class="atn">content<span class="pun">=<span class="atv">"cookie value=xxx;expires=Friday,12-Jan-200118:18:18GMT;path=/"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

참고: GMT 시간 형식을 사용해야 합니다.

E. 창-대상(표시 창 설정)

설명: 페이지가 현재 창에 독립적인 페이지로 표시되도록 합니다.

사용법:

<code><span class="tag"><meta<span class="pln"> <span class="atn">http-equiv<span class="pun">=<span class="atv">"Window-target"<span class="atn">content<span class="pun">=<span class="atv">"_top"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

참고: 다른 사람이 프레임에서 자신의 페이지를 호출하는 것을 방지하는 데 사용됩니다.

F, content-Type(표시 문자 집합 설정)

설명: 페이지에서 사용되는 문자 집합을 설정합니다.

사용법:

<code><span class="tag"><meta<span class="pln"> <span class="atn">http-equiv<span class="pun">=<span class="atv">"content-Type"<span class="atn">content<span class="pun">=<span class="atv">"text/html;charset=gb2312"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

상세 내용은 다음과 같습니다.

메타태그의 문자세트 정보 매개변수가 GB2312와 같은 경우 웹사이트에서 사용하는 인코딩이 중국어 간체라는 의미입니다.

메타 태그의 문자 세트 정보 매개변수가 BIG5와 같은 경우 웹사이트에서 사용되는 인코딩이 중국어 번체임을 의미합니다.

메타 태그의 문자 세트 정보 매개변수가 iso-2022-jp와 같은 경우 웹사이트에서 사용되는 인코딩이 일본어라는 의미입니다.

메타태그의 문자셋 정보 매개변수가 ks_c_5601이면 해당 웹사이트에서 사용하는 인코딩이 한국어라는 뜻입니다.

메타태그의 문자세트 정보 매개변수가 ISO-8859-1과 같은 경우 웹사이트에서 사용되는 인코딩이 영어라는 의미입니다.

메타태그의 문자셋 정보 매개변수가 UTF-8인 경우 세계 공통 언어 인코딩을 나타냅니다.

G、content-Language(显示语言的设定)

用法:

<code><span class="tag"><meta<span class="pln"> <span class="atn">http-equiv<span class="pun">=<span class="atv">"Content-Language"<span class="atn">content<span class="pun">=<span class="atv">"zh-cn"<span class="tag">/></span></span></span></span></span></span></span></span></span></code>

H、Cache-Control指定请求和响应遵循的缓存机制。

Cache-Control指定请求和响应遵循的缓存机制。在请求消息或响应消息中设置Cache-Control并不会修改另一个消息处理过程中的缓存处理过程。请求时的缓存指令包括no-cache、no-store、max-age、max-stale、min-fresh、on

ly-if-cached,响应消息中的指令包括public、private、no-cache、no-store、no-transform、must-revalidate、proxy-revalidate、max-age。各个消息中的指令含义如下

Public指示响应可被任何缓存区缓存

Private指示对于单个用户的整个或部分响应消息,不能被共享缓存处理。这允许服务器仅仅描述当用户的部分响应消息,此响应消息对于其他用户的请求无效

no-cache指示请求或响应消息不能缓存

no-store用于防止重要的信息被无意的发布。在请求消息中发送将使得请求和响应消息都不使用缓存。

max-age指示客户机可以接收生存期不大于指定时间(以秒为单位)的响应

min-fresh指示客户机可以接收响应时间小于当前时间加上指定时间的响应

max-stale指示客户机可以接收超出超时期间的响应消息。如果指定max-stale消息的值,那么客户机可以接收超出超时期指定值之内的响应消息。

J、http-equiv="imagetoolbar"

<code><span class="tag"><meta<span class="pln"> <span class="atn">http-equiv<span class="pun">=<span class="atv">"imagetoolbar"<span class="atn">content<span class="pun">=<span class="atv">"false"<span class="tag">/></span></span></span></span></span></span></span></span></span></code>

指定是否显示图片工具栏,当为false代表不显示,当为true代表显示。

K、Content-Script-Type

<code><span class="tag"><Meta<span class="pln"> <span class="atn">http-equiv<span class="pun">=<span class="atv">"Content-Script-Type"<span class="atn">Content<span class="pun">=<span class="atv">"text/javascript"<span class="tag">></span></span></span></span></span></span></span></span></span></code>

W3C网页规范,指明页面中脚本的类型。

L 页面跳转,只用于IE

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.