web前段开发||head标签介绍
head标签概述
head标签用于在HTML文档中指定文档的元数据，包括文档标题、字符集、样式表、脚本等等。它通常位于HTML文档的头部，不会在浏览器窗口中显示出来，但是它包含了一些非常重要的信息，如搜索引擎优化所需的关键字和描述，以及浏览器渲染页面所需的CSS和JavaScript文件的链接等。
打开vscode，新建一个文件我们给他起名叫head标签介绍，注意后缀是.html，新建好文件后我们输入英文状态下的!按tab键，自动帮我们生成了网页的基本结构。如下代码所示
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
在生成的结构中，head标签内帮我们生成了两个meta标签，和一个title标签，此外我们还可以再head标签内些style标签script标签等。
meta标签
我们先来介绍meta标签，meta标签可以用来制定字符集，指定视图大小，meta标签还可以用来指定网页的关键词和描述，以及设置搜索引擎的索引方式和频率。此外，meta标签还可以用来禁止网页缓存、自动刷新网页等。总之，meta标签是网页优化和SEO中不可或缺的一部分。
meta标签设置字符集
我们先介绍下什么是字符集？
字符集是一种规定了一组字符的编码方式，用于计算机存储和处理文本信息。它包含了字母、数字、符号和其他特殊字符，每个字符都有一个唯一的编码值。常见的字符集包括ASCII、Unicode等。在计算机中，使用字符集来表示和处理文本信息，以确保不同的计算机系统之间可以正确地显示和处理文本。我们通常使用的字符编码就是utf-8或者GBK。
我们通过meta标签的charset属性来设置字符编码如：
<meta charaset="utf-8">
这样就告诉我们的浏览器使用utf-8编码来加载这个网页
meta标签设置SEO
我们还可以使用meta标签来做搜索引擎的优化(SEO)，搜索引擎优化是一种通过优化网站内容和结构，以提高网站在搜索引擎结果页面中的排名和可见性的技术。通过使用关键字、改进网站结构、提高网站速度等方法，可以帮助网站在搜索引擎中获得更高的排名，从而增加流量和受众。
我们通过meta标签的name属性设置搜索引擎类型，content属性设置搜索内容。
其基本语法如下：
指定作者 <meta name="author" content="" />
指定描述文档 <meta name="description" content="" />
指定关键字<meta name="keywords" content="" />/
比如，我们要在网站上发一篇朱自清的春，我们就可以通过以下方式来进行SEO
<meta name="author" content="朱自清" />
<meta name="description" content="盼望着，盼望着，东风来了，春天的脚步近了。" />
<meta name="keyword" content="朱自清春" />
meta标签设置网页缓存
meta标签还可以通过http-equiv属性来设置网页刷新与禁止网页缓存，基本语法如下
<!--刷线网页：-->
<meta http-equiv="refresh" content="时间；网址" />
<!--禁止网页缓存-->
<meta http-equiv="Pragma" content="no-cahe" />
<meta http-equiv="Cache-Control" content="no-cache"/>
<meta http-equiv="expires" content="0">
title标签
接下来我们介绍，title标签，title标签用于在HTML文档中定义网页的标题，它会显示在浏览器的标题栏或标签页上。这个标签非常重要，因为它会影响到搜索引擎对网页的理解和排名。通常情况下，title标签应该包含简短、准确、具有描述性的词语，以便用户和搜索引擎了解页面的主题和内容。
我们来看一下title标签效果。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>head标签介绍</title>
</head>
<body>
</body>
</html>
我们在title标签里写内容head标签介绍，展示如下
style标签和script标签
在head标签里还可以写style标签和script标签，style标签就是我们说的css样式，script标签就是我们说的脚本标签，我们后文介绍。但我们这里要注意，head标签中的script标签和后文script标签，谁在上谁先被浏览器执行。
