Introduction to common uses of HTML meta tags

This time I will introduce to you the common usage of HTML meta tags. What are the precautions when using HTML meta tags? Here are practical cases, let’s take a look.

What is mata tag
element can provide meta-information about the page, such as description and key for search index and update frequency word. The
tag is located at the head of the document and does not contain any content. The attribute of the tag defines the name/value pair associated with the document.
meta is an auxiliary tag in the head area of ​​html language. We can see meta tags in almost all web pages, but they cannot be seen in the browser's display page. Maybe you think these codes are dispensable. In fact, the meta tag is very important and will bring practical effects to your website. For example, the website description () will be reflected in the search engine index. For example, use the meta tag to set the encoding of the website to gbk2312 or utf-8. The meta tag setting key Word

Basic Grammar

<meta  name="keywords"   content="关键字1,关键字2,关键字3....">

The function of the keyword tag is to tell the search engine what the content of the website is about, so as to facilitate the search engine to define and index the website. Keywords and keywords They are separated by commas under the English input method, and the length of the keywords is generally not more than 100 characters.
For example, our website is about learning web development technology, and the keyword description can be written like this:

<meta  name="keywords"   content="html教程,css教程,javascript教程">

When users search for these keywords in search engines, your website will appear in the results. However, because many cheaters (black hat SEO) in the early days were conducive to keyword stacking cheats, current search engines (Baidu) do not No longer so sensitive.

meta tag setting description
Grammar format:

<meta  name=“discription”  content=“描述的内容”>

The description of the web page is very important and can be directly reflected in the search engine. For example, open the Baidu website search " Sina" see the following page

meta tag settingCharacter set
Grammar format:

<meta http-equiv =“content-type”  content=“text/html;    charset="编码格式”>

Common encoding formats include Chinese encoding (gbk2312) and international encoding (UTF-8), gbk2312 is a Chinese encoding, if your website content is all in Chinese, use gbk2312 UTF-8 is a universal encoding for text around the world (including Chinese and English). The main difference between them is that gbk2312 is specifically for Chinese Created, one Chinese character occupies 2 characters. UTF-8 is a universal Chinese character occupies 3 bytes. In the early days, network bandwidth resources were scarce, so using gbk2312 encoding can save bandwidth and improve the opening speed of web pages, but now our family bandwidth is limited Starting from 4M, those bytes saved are completely ignored.
Example:

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

When we browse the web, most of us have encountered garbled pages. The encoding format is to let the browser parse in the set editing format. If the encoding format is not If used correctly, garbled characters will appear. So I recommend using the universal UTF-8 encoding, so that all browsers in the world can display normally when accessing our web pages.

meta tag sets automatic refresh time
Syntax Format

<meta http-equiv=“refresh”  content=“刷新间隔的时间”>

The refresh time is in seconds. For example, the forum page can only see new posts after refreshing. Pages that update quickly like this can add automatic refresh code to ensure that the latest posts can be seen. Page.
Example:

<meta http-equiv=“refresh”  content=“3”>

Here we demonstrate setting the time to 3 seconds, please test it yourself.

meta tag setting automatically jumps to a new page
Grammar format

<meta http-equiv=“refresh”  content=“跳转间隔的秒数；  Url="新网页地址”>

Example:

<meta http-equiv=“refresh”  content=“3；  Url="http://www.adminwang.com”>

When the browser opens this page, it will automatically jump to the homepage of our website after 3 seconds.

Meta tag setting disables caching
Grammar format

<meta http-equiv="cache-control"  content="no-cache" />

We know that browsers have a caching mechanism, which means that when you open a web page, it will be automatically saved locally. The purpose of this is to directly call the file in the cache when you visit it again within a certain period of time to improve the access speed. . But for pages like forums that change from time to time, we don’t want the browser to save cache files, so we can add this code. There is another use in program development. When debugging a program, you need to check the effect of code modifications from time to time. You can use this code to disable browsing. Server cache.
Another way to write:

<meta http-equiv="pragma" content="no-cache" >

I believe you have mastered the method after reading these cases. For more exciting information, please pay attention to other related articles on the PHP Chinese website!

Related reading:

Detailed explanation of examples of HTML text formatting

Summary of frequently used tags in html

How to use Html web table structured markup

The above is the detailed content of Introduction to common uses of HTML meta tags. For more information, please follow other related articles on the PHP Chinese website!