Use of <meta> tags in html

Source: Internet
Author: User

use of <meta> tags in HTML <meta> Tags basic introduction

<meta> tags are an important HTML tag in the source code of an HTML Web page . META notes are used to describe The properties of an HTML page document, such as author, date, keyword, and page refresh. In addition <meta> tags are used for search engine optimization (seo). It is located within the HTML document , although it provides no visible information, but it is the most basic meta-information of the document.

Attribute enumeration for <meta> tags

attributes in the <meta> tag can be divided into required properties and optional properties.

1. required attribute:content property. This property is intended to define meta information related to the http-equiv or name property, where the content is used to search for information and classifications for bots.

2. Optional properties

the ①name property is primarily used to describe web pages. The value of the Name property can be:author,description,keyword ,generator , etc.

The ②http-equiv property. This property is quite similar to the HTTP header file, and can return some useful information to the browser to help correct and accurately display the content. The value of the Http-equiv property can have content-type,expires,Refresh and so on;

the name attribute in the <meta> tag applies1. name= " Keywords " (keyword: Tell the browser what your page's keywords are)2. name= " Description " (Description: Tell the browser what the main content of your page is)

These two attribute values work Similarly, setting these values can help your home page be logged in by major search engines, increasing the amount of site visits. So these two properties are worth setting up to be particularly important. As the search engine works, the search engine will first retrieve the page keywords and description, and add it to their own database, and then according to the density of keywords to the site sort.

<meta name= "keywords" content= " about the use of meta tags " >

<meta name= "description" content= " <meta> tags in HTML how to use correctly " >

Note : The content of keywords should be limited to 36 words;

The content of description should be limited to 76 words;

Name must be used in conjunction with the content property.

3.robot(Robot Wizard: Used to tell the robot which pages need to be indexed, which pages do not need to be indexed)

the value of this property is all,none,index,noindex, Follow and the nofollow default is All

set to all: The file will be retrieved and the link on the page can be queried;

set to none: The file will not be retrieved, and the link on the page cannot be queried;

set to index: The document will be retrieved;

Set as follow: links on the page can be queried;

Set as noindex: The file will not be retrieved, but the link on the page can be queried;

Set as nofollow: The file will be retrieved, the link on the page can not be queried;

http-equiv attribute application in the <meta> tag 1. http-equiv= ' Content-type ' (document content type: Used to set document type and character set)

This is one of the most common settings in Meta notes, and when making a Web page, we can see in plain HTML that he is the language that defines your page when the browser accesses your page, The browser will then identify and make the appropriate settings, otherwise the browser will use the default setting method.

<meta http-equiv= "Content-type" content= "Text/html;charset=utf-8" >

2. http-equiv= ' Expires ' ( term: can be used to set the expiration date of the page )

once the page expires, it must be refreshed on the server and cannot be retrieved from the cache. It is important to note that the time set must be in GMT format.

<meta http-eqive= "Expires" content= "fri,12 Jan 2001 15:15:15 GMT" >

If you set up a browser page in your browser to get from a page in the local cache, you will only get it from the local cache when you browse , and the browser will not get a new page until the time set in the meta expires.

3. http-equiv= ' pragma ' (cache mode )

Description : prevents the browser from accessing the page content from the locally computed cache.

<meta http-equiv= "Pragma" content= "No-cache" >

This code means that the page is not fetched from the cache, so the visitor will not be able to work offline.

4. Refresh : Wait for a certain amount of time to automatically refresh or jump to a different URL

<meta http-equiv= "Refresh" content= "1;url=https://www.baidu.com"/>

Use of the <meta> tag on the mobile side 1. name= " Viewport " ( Zoom on the mobile screen )

Viewport, that 's the area .

<meta name= "Viewport"

Content= "Width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" >

that is, force the width of the document and the device to remain 1:1; the ratio and the maximum proportion of documents are 1.0. Using user-scalable=no to define the user can not be manually scaled, so that the page fixed;

2. name= " formmat-detection "

This property allows you to disable automatic phone calls and mailboxes.

<meta name= "format-detection" content= "Telephone=no,email=no"/>

In this way, the device browses the page to the number does not start the phone function (note that different devices may be interpreted differently), ignoring the number on the page is recognized as a phone number. The same is true for mailboxes.

3. name= " apple-mobile-web-app-capable " ( web App support is open on the website )

<meta name = "App-mobile-web-app-capable" content= "yes"/>

description ; 1. website open to Web APP the support

2. the meta can be seen as "Apple device Web Application * *", meaning that the meta specifically defined Web applied.

4. name= " Apple-mobile-web-app-status-bar-style " ( change the color of the top status bar )

<meta name= "Apple-mobile-web-app-status-bar-style" content= "Black"/>

Description: 1. The color of the status bar in the web App is black ;

2. defaults to default (white), which can be defined as blackand black-translucent (Grey Translucent)

5. Name Property Set author name and contact information

<meta name= "Author" content= "Xx,[email protected]" >

Reference:http://www.cnblogs.com/zhuzhenwei918/p/6028414.html

Use of <meta> tags in html

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.