文章目录
1 标签和属性之间的区别1.1 标签1.2 属性2 3个基本HTML标签2.1 <!DOCTYPE html>2.2 <head>2.3 <body>3 SEO的常用标签及其中使用的属性3.1 <meta>3.2 name属性3.3 Noindex属性3.4 description属性3.5 <title>3.6 <h1>至<h6>3.7 链接标签和Href属性3.8 Rel=”nofollow”3.9 Hreflang属性3.10 Canonical属性3.11 图片标签3.12 Src属性3.13 ALT属性
HTML是构成大多数网页的语言，是网页的基础，它可以说是SEO的最基本部分之一。使用HTML可以将页面的信息传达给用户和搜索引擎。
标签和属性之间的区别
许多人分不清“标签”和“属性”，都统称为标签。
HTML分为三部分：
开始标签标签内容结束标签
例如：
<h1>欢迎来到扬帆号</ h1>
“ <h1>”开始标签。
标签的内容为“欢迎来到扬帆号”。
“ </ h1>”结束标签。
标签
标签必须具有开始<X>和结束</ X>元素，标签才能起作用。<br>标签没有任何内容或结束标签。
属性
将属性添加到代码以对其进行修改。例如：
<link rel =“ canonical” href =“ https://www.example.com” />
3个基本HTML标签<!DOCTYPE html>
<!DOCTYPE html>标签是网页上的第一个标签。
<head>
<head>标签为页面的第一部分。这是关于页面的信息，这些信息不会在页面上显示。<head>标签很重要，因为一些SEO的关键标签在这里。
<body>
body标签包含访问者将在页面上看到的信息。
SEO的常用标签及其中使用的属性<meta>
<meta>标签位于页面的<head>中。它可以包含描述有关网页信息的属性，而这些信息实际上不会在页面内容中显示。
name属性
name属性与<meta>标签一起使用。这是向访问该页面的蜘蛛进行指定的一种方式。
例如，<meta name =“ robots” content =“ noindex” />意思是所有机器人都应遵循“ noindex”指令。
如果使用以下命令<meta name =“ googlebot” content =“ noindex” />，则只有Google的机器人遵守“ noindex”指令。
Noindex属性
“ noindex”是SEO中常用的属性。经常会听到它被称为“ noindex标签”，但更准确地说，它是<meta>标签的属性。
<meta name=\"robots\" content=\"noindex\" />
这段代码可以确定哪些内容能让搜索引擎索引。通过添加“ noindex”属性，实际上是在告诉搜索引擎不索引此页面。
例如，如果您的网站上只有付费会员可以访问的区域。
description属性
description属性（又称为“描述”）与标签一起使用。它是总结页面上的内容，有助于搜索者确定页面是否满足其需求。
这不会影响页面的排名，但可以提升点击率。
<title>
它位于站点的<head>中，用来定义页面标题的标签。用户在网页上时看不到它。但是，它显示在搜索结果中，这是SEO中的重要元素。
<h1>至<h6>
标题标签被用于显示HTML的部分内容为标题，标签位于页面的<body>内，因此查看页面内容的用户可以看到文本。
标题标签帮助构建页面。在创建网站时，开发人员将确保样式与每种标题标签相关联。
标题标签还可以帮助搜索引擎确定页面上内容的结构。
链接标签和Href属性
标准超链接本质上是一个<a>标签。格式如下：
<a href=”www.example.com”>链接的锚文本位于此处</a>。
<a>标签表明它是一个链接。href =属性指示链接的目的地（即，链接到的页面）。位于<a>标签和</a>标签之间的文本是锚文本，用户是可以点击的。
<link>标签用于将资源链接到另一个资源，并显示在页面的<head>中。这些链接不是超链接，不可单击。它们显示了Web文档之间的关系。
Rel=”nofollow”
rel =” nofollow”属性告诉蜘蛛，不要跟踪href属性中的URL。使用rel =“ nofollow”属性不会影响正常用户单击链接并进入另一页面，它仅影响蜘蛛。
它阻止在SEO中使用将一个页面链接的权重到另一页面，使用“ nofollow”属性来告诉搜索引擎这是一个付费链接，例如：广告。可以避免受到惩罚。
rel =“ nofollow”属性可以在单个链接的基础上使用，如下所示：
<a href=www.example.com rel=\"nofollow\">链接的锚定文字在此处</a>
或者可以通过在<head>中使用，就像使用了“ noindex”属性一样：
<meta name=\"robots\" content=\"nofollow\" />
Hreflang属性
hreflang属性的目的是帮助网站以多种语言显示相同的内容。它指示搜索引擎应向用户显示该页面的哪个版本，以便他们阅读。
hreflang属性与<link>标签一起使用。此属性指定链接到的URL的语言。
它在页面的<head>中使用，其格式如下：
<link rel =“ alternate” href =“ https://example.com” hreflang =“ zh-CN” />
解释：
rel =“ alternate”表示该页面具有与其相关的另一个页面。href =属性表示要链接到的URL。语言代码是两个字母的名称，用于告诉搜索引擎其链接页面所用的语言。这两个字母取自标准化列表，即ISO 639-1代码。
hreflang属性也可以在HTTP标头中用于非HTML（例如PDF）或网站XML网站地图中的文档。
Canonical属性
rel =“ canonical”属性使SEO专业人员可以指定网站的哪个页面是规范页面，意思是这个是主页，其他是副本，让搜索引擎给主页排名，而不是副本。
<link rel =“ canonical” href =“ https://www.example.com/” />
该代码应位于页面的<head>中。在“ href =”后面声明的网页应该是您希望搜索引擎将将其排名的页面。在两个或多个页面上可能具有相同或几乎相同的内容的情况下，此标签很有用。
图片标签
<img>标签用于将图像嵌入HTML页面。图片标签不是将图像原样插入页面，是可以对图片进行调整的。
<img>标签的格式如下：
<img src =“ imagename.jpg” alt =“这是图像的说明”>
Src属性
src =属性用于引用页面上显示的图像的位置。如果图片是在自己的网站中，可以使用相对URL。如果要从另一个网站提取图像，则需要使用绝对（完整）URL。
ALT属性
此属性用于指定在无法渲染图像时应显示的替代文本。
alt 属性必须存在于<img>标记中，但是如果不需要替代文本，可以将其留空。
搜索引擎无法精确确定图像的含义，所以在图像alt 属性中使用关键词是有好处的，有助于增强图像与页面主题相关性。
