Website performance meta tag_html/css_WEB-ITnose

The meta tag is often ignored by html beginners as a way of seeking death, but for a website, it is very important.

Definition: Provide meta information about the page. For example, keywords and descriptions for search engines and update frequency. Simply put, meta tags interact with search engines and can optimize website SEO.

Format:

Inside head tag

Self-closing and label

Browser support: Full

Attributes:

content: Define meta-information related to http-equiz and name

http-equiz: Associate content with http header

name: Associate content with name

scheme: used to specify the scheme to be used to translate attribute values ​​(h5 has been abandoned

charset: convenient setting encoding (H5

Function: ( What we talk about are commonly used, or useful in case of emergencies

Encoding settings

http-equiz="Content-Type" content="< !--MIME type, encoding-->"

ex:

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

Page language setting

Facilitates browser classification

ex:

<meta http-equiv="content-language" content="es">

Regular refresh and redirection

Provide for students who don’t know

ex:

<meta http-equiz="Refresh" content="10"><meta http-equiz="Refresh" content="10; Url=http://www.ecjtu.net">

Keywords

ex:

<meta name="keywords" content="华东交大 华东交通大学 日新网">

Provides a list of keywords for search engines , this is especially important for SEO! In addition, I saw something written like this on the Internet. None of the standards have been found. The declaration language should use the content-language mentioned earlier or set it like lang="zh" in the html tag

Web page content description

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

ex:

Of course it is used to tell search engines

Set robot access permissions

ex:

The code source is teambition. You can set how the robot/spider logs into the website. The content parameters include all, none, index, noindex, follow, and nofollow. The default is all.

<meta name="robots" content="NOINDEX,NOFOLLOW">

Other settings

Such as author, copyright

Mobile version meta usage (mobile version is the trend!

name="viewport" is used to set the mobile page window. This is necessary for responsiveness, and scaling control can also prevent layout confusion.

width: width, where device-width represents the device width

<🎜. >height: height. device-height

initial-scale: set the initial scaling

minimum-scale: set the minimum scaling

maxmum-scale: set the maximum scaling

user-scalable: Set whether the user can zoom, the default is yes

name="format-detection" Detect the format of certain strings in the page and limit its behavior, which is actually the mobile phone number . content="telephone=no" Set the number not to be recognized as a mobile phone number link

Set whether the iPhone browser can browse in full screen

Set the style of the status bar at the top of iPhone Safari. The default is black

Reference:

https://developer.apple.com/library/safari/documentation/AppleApplications/Reference /SafariHTMLRef/Articles/MetaTags.html#//apple_ref/doc/uid/TP40008193-SW1

http://www.quirksmode.org/mobile/viewports2.html

http:/ /css-tricks.com/snippets/html/responsive-meta-tag/

The next step is to make irresponsible recommendations, while collecting information I recorded it when I found it useful, but I haven’t tested it yet.

Cookie settings

The code explains all the settable options

ex:

Window display setting

You can prevent the page from being embedded in other pages

<Meta http-equiv="Set-Cookie" Content="cookievalue=xxx; expires=Wednesday, 21-Oct-98 16:14:21 GMT; path=/">

ex: Content options: _blank, _top, _self, _parent, use the a tag however you want

RSAC rating

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

can be used to prevent websites from being blocked as pornographic websites for no apparent reason

ex:

RSAC的站点：http://www.rsac.org/

缓存控制

只实现了禁止缓存呢

设置缓存的过期时间，格式为GMT ex:

<meta http-equiv="Pragma" content="no-cache"><meta http-equiv="Cache-Control" content="no-cache"><meta http-equiv="Expires" content="0">

 

其它功能

其实IE一些功能应用也多，但终究不是普遍现象，就提供个链接，有兴趣的可以看下

http://msdn.microsoft.com/en-us/library/ie/ms533876(v=vs.85).aspx

 

 

 

PS:有些meta功能过于陈旧，chrome下看不见效果，ie下也不想测试了。