W3C standard meta tag details

web front end eight thousand and forty-seven 13 years ago (2012-07-05)

Meta is an auxiliary tag in the head area of html language. In almost all web pages, we can see the following html code:

<meta http-equiv="content-Type" content="text/html; charset=gb2312">

Maybe you think these codes are optional. In fact, if you can use meta tags well, it will bring you unexpected results. For example, adding keywords will be automatically collected by large search websites; You can set the page format and refresh.  

1、 Composition of meta tags

The meta tag has two attributes: http equiv attribute and name attribute. Different attributes have different parameter values. These different parameter values realize different web page functions.

1. Name attribute

The name attribute is mainly used to describe web pages, and the corresponding attribute value is content. The content in content is mainly used to facilitate search engine robots to find information and classify information.

The syntax format of the name attribute of the meat tag is:< Meta name="Parameter" content="Specific parameter value">.

The name attribute mainly has the following parameters:

A. Keywords

Notes: keywords is used to tell the search engine what the keywords of your web page are.

For example:< meta name ="keywords" content="science, education,culture,politics,ecnomics,relationships, entertaiment, human">

B. Description

Description is used to tell search engines the main content of your website.

For example:< meta name="description" content="This page is about the meaning of science, education,culture.">

C. Robots

Note: robots are used to tell the search robot which pages need to be indexed and which pages do not need to be indexed.

The parameters of content include all, none,index,noindex,follow,nofollow。 The default is all.

For example:< meta name="robots" content="none">

D. Author

Description: Mark the author of the page

For example:< meta name="author" content="zys666, zys666@21cn.com ">

2. Http equiv attribute

Http equiv, as its name implies, is equivalent to http file header. It can browser Some useful information is returned to help correctly and accurately display the page content. The corresponding attribute value is content, and the content in content is actually the variable value of each parameter.

The http equiv attribute syntax format of the meat tag is:< Meta http equiv="parameter" content="parameter variable value">; the http equiv attribute mainly includes the following parameters:

E. Window target

Note: force the page to display as a separate page in the current window.

Usage: meta http-equiv="Window-target" content="_top">

Note: It is used to prevent others from calling their own pages in the framework.

F. Content Type (display character set settings)

Note: Set the character set used by the page.

Usage: meta http-equiv="content-Type" content="text/html; charset=gb2312">

2、 Functions of meta tags

Above, we introduced some basic components of meta tags, and then let's take a look at the common functions of meta tags:

1. Help homepage is logged in by major search engines

A very important function of the meta tag is to set keywords to help your home page be logged in by major search engines and increase the number of visits to the website. In this function, the most important is the setting of keywords and description. Because according to the working principle of search engines, search engines first send robots to automatically retrieve keywords and descriptions on the page, and add them to their own data base , and then sort websites according to the density of keywords. Therefore, we must set keywords to improve the search click rate of the page. Let's give an example for your reference:

<meta name="keywords" content="Politics, economy, science and technology, culture, health, emotion, soul, entertainment, life Sociology , enterprise, transportation ">

< meta name="description" content="politics, economy, technology, culture, health, emotion, soul, entertainment, life, society, enterprise, transportation" >

Note: It can be used to set the expiration time of the webpage. Once the page expires, you must go to The server Retransmit on.

Usage: meta http-equiv="expires" content="Fri, 12 Jan 2001 18:18:18 GMT">

Note: The GMT time format must be used.

B. Pragma (cache mode)

Note: browser is prohibited from being local computer The page content is accessed in the cache of.

Usage: meta http-equiv="Pragma" content="no-cache">

Note: With this setting, visitors will not be able to browse offline.

C. Refresh

Note: Automatically refresh and point to a new page.

Usage: meta http-equiv="Refresh" content="2;URL= https://www.toyean.com/ ">

Note: 2 refers to automatically refreshing to the URL after staying for 2 seconds.

D. Set Cookie

Note: If the webpage expires, the saved cookie will be deleted.

Usage: meta http-equiv="Set-Cookie" content="cookievalue=xxx; expires=Friday, 12-Jan-2001 18:18:18 GMT; path=/">

Note: The GMT time format must be used.

After setting these keywords, the search engine will automatically add these keywords to the database and sort them appropriately according to their density.

2. Define the language of the page

This is the most common function of the meta tag. When creating a web page, we will see it in pure HTML code. Its role is to define the language of your web page. When visitors visit your web page, the browser will automatically identify and set the language in the web page. If your web page is set with a GB code and the browser does not install the GB code, At this time, the web page will only display the browser default language set by the browser. Similarly, if the page is English , then charset=en. The following is a representative example:

<meta http-equiv=&Prime; content-Type&Prime; content=&Prime; text/html; charset=gb2312&Prime;〉

This code means that the language of the webpage is set to the national standard code.

3. Automatically refresh and point to a new page

If you want to make your web page automatically visit the specified web page at the specified time without control, you can use the meta tag's function of automatically refreshing the web page. Let's look at a piece of code:

〈meta http-equiv=&Prime; refresh&Prime; content=&Prime; 2; URL= https://www.toyean.com/

This code can make the current page automatically go to https://www.toyean.com/ This is the refresh function of meta. In content, 2 represents the set time (in seconds), and URL is the web address automatically connected after the specified time.

4. Animation effect when realizing webpage conversion

Using meta tags, we can also achieve animation effects at the moment of entering or leaving the web page. We just need to add the following code between the<head></head>tags in the html code of the page:

<meta http-equiv="Page-Enter" content="revealTrans(duration=5. 0, transition=20)">

<meta http-equiv="Page-Exit" content="revealTrans(duration=5. 0, transition=20)">

Once the above code is added to a page, we will see some special effects when entering and exiting the page. This function is actually the same as the Format/Page Transition in FrontPage2000, but we should note that the added page cannot be a Frame page;

5. Web page rating and evaluation

Browsers of IE4.0 and above can prevent browsing some restricted websites. The reason why the browser will automatically identify whether certain websites are restricted is that the level of the website has been set in the website meta tag, and the rating of this level is assessed by the U.S. RSAC, the rating agency of the Entertainment Commission. If you need to evaluate your website, you can connect to the website https://www.toyean.com/ , submit the form as required, and RSAC will provide you with a meta code, which can be copied to your own web page. The following is an example code:

〈meta http-equiv=&Prime; PICS-Label&Prime;

content=&prime; (PICS-1.1 &Prime; https://www.toyean.com/

l gen true comment &Prime; RSACi North America Server&Prime;

for &Prime; https://www.toyean.com/

on &Prime; 2001.08.16T08:15-0500&Prime;

r (n 0 s 0 v 0 l 0))&prime;〉

6. Control Page Buffering

The meta tag can set the expiration time of web pages. That is to say, when you set up a browser in Internet Explorer to browse a web page, you should first view the page in the local buffer. When you browse a web page and the local buffer is sometimes, the browser will automatically browse the page in the buffer until the time set in the meta expires. At this time, the browser will not get a new page. For example, the following code indicates that the expiration time of the web page is 18:18:18 on January 12, 2001.

〈meta http-equiv=&Prime; expires&Prime; content=&Prime; Friday, 12-Jan-2001 18:18:18 GMT&Prime;〉

7. Windows that control the display of web pages

We can also use the meta tag to control the window displayed on the web page. Just add the following code to the web page: metahttp-equiv="window-target" content="_top">, This code can prevent the web page from being called as a Frame by others.

---------------------------

Meta Tag Details The META tag is an auxiliary tag in the HEAD area of the HTML language. It is located between the<HEAD>tag and the<TITLE>tag in the header of the HTML document. It provides information that is not visible to the user. Here are some examples and explanations of marks.  

META tags are divided into two parts: HTTP header information (HTTP-EQUIV) and page description information (NAME).  

  ★HTTP-EQUIV 

HTTP-EQUIV is similar to the HTTP header protocol. It responds to the browser with some useful information to help correctly and accurately display web content. Common HTTP-EQUIV types are:

1. Content Type and Content Language (display character set settings)

Description: Set the character set used for the page to indicate the text and language used for making the home page. The browser will call the corresponding character set to display the page content according to this.  

Usage:< Meta http-equiv="Content-Type" Content="text/html; Charset=gb2312">

      <Meta http-equiv="Content-Language" Content="zh-CN"> 

Note: This META tag defines the character set used by the HTML page as GB2132, which is the national standard Chinese character code. If "charset=GB2312" is replaced with "BIG5", the character set used in this page is the traditional Chinese Big5 code. When you browse some foreign sites, IE browser will prompt you to download xx language support to correctly display the page. This function is to read the Content Type attribute of the META tag of an HTML page to know which character set to use to display the page. If there is no corresponding character set installed in the system, IE will prompt to download. Other languages also correspond to different charsets. For example, the Japanese character set is "iso-2022-jp", and the Korean character set is "ks_c_5601".

Content of Content Type can also be: text/xml and other document types;

Charset options: ISO-8859-1 (English) BIG5、UTF-8、SHIFT-Jis、Euc、Koi8-2、us-ascii, x-mac-roman, iso-8859-2, x-mac-ce, iso-2022-jp, x-sjis, x-euc-jp,euc-kr, iso-2022-kr, gb2312, gb_2312-80, x-euc-tw, x-cns11643-1,x-cns11643-2 Equal character set; Content of Content Language can also be: EN, FR and other language codes.  

2. Refresh

Note: How long (seconds) to refresh the page, or how long after the page automatically links to other pages.

Usage:< Meta http-equiv="Refresh" Content="30">

      <Meta http-equiv="Refresh" Content="5; Url= https://www.toyean.com/ ">

Note: 5 refers to automatically refreshing to the URL after staying for 5 seconds.  

3. Expires

Note: Specify the expiration time of the page in the cache. Once the page expires, it must be recalled on the server.

Usage:< Meta http-equiv="Expires" Content="0">

      <Meta http-equiv="Expires" Content="Wed, 26 Feb 1997 08:21:57 GMT">

Note: You must use the GMT time format, or set it to 0 directly (the number indicates the expiration time).  

4. Pragma (cach mode)

Note: The browser is prohibited from accessing page content from the cache of the local machine.

Usage:< Meta http-equiv="Pragma" Content="No-cach">

Note: The web page is not saved in the cache. The page is refreshed every time you visit it. With this setting, visitors will not be able to browse offline.  

5. Set Cookie

Note: When the browser accesses a page, it will store it in the cache, and it can be read from the cache the next time it is accessed to improve the speed. When you want visitors to refresh your ads every time Icon , or refresh your counter every time, you will disable the cache. It is not necessary to disable caching for HTML files ASP You can disable caching when you see a page. Because every page you see is dynamically generated on the server, caching will lose its meaning. If the webpage expires, the saved cookie will be deleted.

Usage:< Meta http-equiv="Set-Cookie" Content="cookievalue=xxx; expires=Wednesday,

       21-Oct-98 16:14:21 GMT; path=/">

Note: The GMT time format must be used.  

6. Window target

Note: force the page to display as a separate page in the current window.

Usage:< Meta http-equiv="Widow-target" Content="_top">

Note: This property is used to prevent others from calling your page in the framework. Content options:_ blank、_top、_self、_parent。  

7. Pics label (web RSAC rating)

Note: There is a content setting in Internet Options of IE, which can prevent browsing some restricted websites

It is set through this parameter.

Usage:< META http-equiv="Pics-label" Contect=

               "(PICS-1.1' https://www.toyean.com/ '

       I gen comment 'RSACi North America Sever' by ' inet@microsoft.com

       for ' https://www.toyean.com/ ' on '1997.06.30T14:21-0500' r(n0 s0 v0 l0))"> 

Note: Do not set the level too high.

8. Page Enter, Page Exit

Note: This is some special effects when the page is loaded and called out.

Usage:< Meta http-equiv="Page-Enter" Content="blendTrans(Duration=0.5)">

      <Meta http-equiv="Page-Exit" Content="blendTrans(Duration=0.5)">

Note: blendTrans is a kind of dynamic filter, which produces fade effect. Another dynamic filter, RevealTrans, can also be used for page entry and exit effects:

      <Meta http-equiv="Page-Enter" Content="revealTrans(duration=x, transition=y)">

      <Meta http-equiv="Page-Exit" Content="revealTrans(duration=x, transition=y)"> 

Duration indicates the duration of the filter effect (unit: seconds)

Transition filter type. It indicates which special effect to use, and the value is 0-23.  

0 Rectangle Zoom Out

1 Rectangular expansion

2 Circle reduction

3 Circular expansion

4 Refresh from bottom to top

5 Refresh from top to bottom

6 Refresh from left to right

7 Refresh from right to left

8 Vertical shutter

9 Horizontal shutter

10 Staggered horizontal shutter

11 Staggered vertical shutter

12 point diffusion

13 Refresh from left to right to middle

14 Refresh from middle to left and right

15 Middle to top and bottom

16 Top to bottom to middle

17 Bottom right to top left

18 Top right to bottom left

19 Top left to bottom right

20 Bottom left to top right

21 Horizontal bar

22 Vertical bar

Choose one of the above 22 at random

  9、 MSThemeCompatible (XP theme )

Note: Whether to close the theme of xp in IE

Usage:< Meta http-equiv="MSThemeCompatible" Content="Yes">

Note: The system display style of the blue stereo button for closing xp is very similar to that of win2k.  

  10、 IE6 (Page Builder)

Note: Page generator, ie6

Usage:< Meta http-equiv="IE6" Content="Generator">

Note: It is made of something similar to a factory manufacturer.  

11、 Content-Script-Type ( script Related)

Note: This is a recent W3C specification, indicating the type of script in the page.

Usage:< Meta http-equiv="Content-Script-Type" Content="text/javascript">

12、 MSSmartTagsPreventParsing()

Note: In a word, it is to prevent Microsoft The page editing software automatically adds labels on the page to ensure the original code

Usage:< meta name="MSSmartTagsPreventParsing" content="TRUE">

 

★ NAME variable

The name describes the web page and corresponds to the Content to facilitate search engine robots to search and classify (at present, almost all search engines use online robots to automatically find meta values to classify web pages).

The value value of name (name="") specifies the type of information provided. Some values are already defined. For example, description, keyword, refresh, etc. You can also specify any other value, such as creationdate

Document ID, level, etc.

The content of name specifies the actual content. For example, if level is specified as value, Content may be beginner, intermediate, or advanced.  

 

1. Keywords

Description: keyword list provided for search engines

Usage:< Meta name="Keywords" Content="Keyword 1, Keyword 2, Keyword 3, Keyword 4& hellip;& hellip; ">

Note: The keywords are separated by the English comma ",". META is often used to specify keywords that search engines use to improve search quality. When several META elements provide document language dependency information, the search engine will use the lang feature to filter and display the search results through the user's language priority reference. For example:

      <Meta name="Kyewords" Lang="EN" Content="vacation,greece,sunshine">

      <Meta name="Kyewords" Lang="FR" Content="vacances,gr&egrave;:ce,soleil"> 

2. Description

Description is used to tell search engines the main content of your website.

Usage:< Meta name="Description" Content="Brief description of your web page">

3. Robots

Description: Robots is used to tell the search robot which pages need to be indexed and which pages do not need to be indexed. The parameters of Content include all none、index、noindex、follow、nofollow。 The default is all.

Usage:< Meta name="Robots" Content="All|None|Index|Noindex|Follow|Nofollow">

Note: Many search engines log in to the website by releasing robot/spider search. These robot/spider will use some features of the meta element to decide how to log in.  

All: The file will be retrieved and the links on the page can be queried;

None: the file will not be retrieved, and the links on the page cannot be queried; (Same as "noindex, no follow")

Index: the file will be retrieved; (Let the robot/spider log in)

Follow: the links on the page can be queried;

Noindex: The file will not be retrieved, but the links on the page can be queried; (Do not allow robot/spider to log in)

Nofollow: the file will not be retrieved, and the links on the page can be queried. (The robot/spider is not allowed to follow the link on this page)

4. Author

Note: Mark the author or production group of the page

Usage:< Meta name="Author" Content="Zhang San, abc@sina.com ">

Note: Content can be: the name of you or your production team, or Email

5. Copyright

Note: Label copyright

Usage:< Meta name="Copyright" Content="The copyright of this page belongs to Zerospace. All Rights Reserved">

6. Generator

Description: Description of the editor

Usage:< Meta name="Generator" Content="PCDATA|FrontPage|">

Note: Content="Your editor"

7. Revisit after

explain:

Usage:< META name="revisit-after" CONTENT="7 days" >

 

★ Other usages in Head

 

1. Scheme

Description: scheme can be used when name is used to specify how the value of content should

      be interpreted.

Usage:< meta scheme="ISBN" name="identifier" content="0-14-043205-1" />

2. Link

Description: Link to file

Usage:< Link href="soim.ico" rel="Shortcut Icon">

Note: For many websites, if you save it in the inbox, you will find a small icon associated with it. If you click again to enter, you will also find a small icon in the address bar. Now you can easily implement this function by adding this paragraph to your page header< LINK>is used to link the current file with other URLs, but there is no link button. It is used between<HEAD>tags. The format is as follows:

   <link href="URL" rel="relationship"> 

   <link href="URL" rev="relationship"> 

3. Base

Description: Insert the base link property of the page

Usage:< Base href=" https://www.toyean.com/ " target="_blank">

Note: All relative paths on your page will be prefixed when linking“ https://www.toyean.com/ ”。 Where target="_blank" means that the linked file is opened in a new window, and you can make other settings. Changing "_blank" to "_parent" means that the linked file will be opened in the parent window of the current window; Change to "_self" link file to open in the current window (frame); Change to "_top" link file full screen display.  

 

Detailed explanation of http equiv attribute of Meta in w3c standard

Http equiv, as its name implies, is equivalent to http file header. It can return some useful information to the browser to help correctly and accurately display the page content. The corresponding attribute value is content, and the content in content is actually the variable value of each parameter.

The http equiv attribute syntax format of the meat tag is:; The http equiv attribute mainly has the following parameters:

1. Expires

Note: It can be used to set the expiration time of the webpage. Once the page expires, it must be retransmitted to the server.

Usage:

Note: The GMT time format must be used.

2. Pragma (cache mode)

Note: browser offline browsing is prohibited

Usage:

Note: With this setting, visitors will not be able to browse offline.

3. Refresh

Note: Automatically refresh and point to a new page.

Usage:

Note: 2 refers to automatically refreshing to the URL after staying for 2 seconds.

4. Set Cookie

Note: If the webpage expires, the saved cookie will be deleted.

Usage:

Note: The GMT time format must be used.

5. Window target

Note: force the page to display as a separate page in the current window.

Usage:

Note: It is used to prevent others from calling their own pages in the framework.

6. Content Type (display character set settings)

Note: Set the character set used by the page.

Usage:

7. Pics label (web page rating)

Usage: Web page rating

Note: There is a content setting in Internet option of IE, which can prevent browsing some restricted websites, and the restriction level of websites is set through meta attribute.

And Page_Enter Page_Exit&hellip;& hellip;

Supplement:

Set special effects when entering the page

Set special effects when leaving the page

The value of Duration is the dynamic transition time of the web page, in seconds.

Transition is a transition mode. Its values are 0 to 23, corresponding to 24 transition modes. The following table:

0 Box shrinkage

1 Box radiation

2 Circular shrinkage

3 Circular radiation

4 From bottom to top

5 From top to bottom

6 From left to right

7 From right to left

8 Vertical shutter

9 Horizontal shutter

10 Horizontal lattice shutter

11 Vertical lattice louver

12 Dissolve at will

13 Unfold from the left and right ends to the middle

14 Unfold from the middle to the left and right ends

15 Unfold from the upper and lower ends to the middle

16 Unfold from the middle to both ends

17 Expand from the top right corner to the bottom left corner

18 Expand from lower right corner to upper left corner

19 Unfold from top left corner to bottom right corner

20 Expand from lower left corner to upper right corner

21 Horizontal linear expansion

22 Vertical linear expansion

23 Random generation of a transition mode