什么是 HTML 标签?超文本标记语言 (HTML) 标签是 Web 内容的构建块。它们以浏览器可以理解的方式对文本、图像和链接进行结构化和格式化,充当标签或说明,告诉浏览器如何显示网页内容。您可以将它们用作 SEO 的一部分作为 HTML 标签,例如元标签(alt 标签、元描述等),以帮助为搜索引擎提供上下文并帮助它们理解页面的内容。
基本的 SEO HTML 标签我们已经介绍了用于 SEO 的 HTML 元标记如何改善您网站的结构和用户体验。接下来,让我们深入了解一些基本标签。
1. 标题标签 <title>
标题标签可以说是提高排名时需要熟悉的最重要的标签。对于任何对您的网站进行排名的搜索引擎,它都需要知道您的内容、每个页面和整个网站是关于什么的。标题 HTML 标签描述您网站上每个页面或内容的主题。它以一种对搜索引擎有意义的方式做到这一点。这是标题标签将在 Google 上显示的位置。你的标题标签需要包含你在内容中定位的关键词,告诉搜索引擎如何对你进行排名。例如,在上面的标题标签中,我猜测 Investopedia 正试图为关键词 “digital marketing” 进行排名。我怎么猜到这个?好吧,如果你注意到元描述和标题标签之间的相似之处,两者都有那个确切的短语。这样做对您的排名非常重要。但我们很快就会更深入地讨论元描述。
现在,让我们谈谈如何在你的网站中包含该标题标签。该标题的 HTML 代码如下所示:
<title>什么是数字营销?</title>
文本以 <title> 开头,以 </title> 结尾,以向搜索引擎表明您在网页上讨论的主题和关键字。您网站的每个页面都应该有一个唯一的标题标签。您不必手动检查此内容。您可以使用 Ubersuggest 来加快流程并帮助您进行必要的更改。步骤 1:输入您的 URL 并单击搜索步骤 2:点击 Site Audit(网站诊断)步骤 3:滚动到底部并单击“See All Issues”快速搜索 (control+f) 单词 “title” 将查明您的标题标签的任何问题。在此示例中,没有重复的标题标签。但是,有两个与标题标签相关的问题需要解决:
37 个标题标签过长的页面
1 个标题标签太短的页面
这些是您应该尽快解决以支持您的 SEO 的项目。
2. 元描述 <meta description>
紧跟在 title 标签之后,meta 标签对于任何认真使用 SEO HTML 标签来提升其在线形象的人来说都是绝对必须的。将元描述想象成一本书背面的概要。元描述简要总结了页面的内容,显示在搜索结果中的标题下方。如果你做对了,你的元描述将帮助你在 Google 上获得良好的排名,并以引人注目的副本销售 “click”,从而对用户参与度产生积极影响。这是元描述在 Google 结果中显示的位置。以下是当你点击上面 Google 结果中的链接时,元描述 HTML 标签的样子:
<meta name=”description” content=”Digital marketing is the act of selling products and services through channels such as social media, SEO, email, and mobile apps.”/>
确保标题标签和元描述之间的连续性,以便搜索引擎可以轻松识别您的帖子的内容。如果您使用的是 WordPress,请按照添加元描述的教程进行操作。为每个页面提供唯一的元描述,在每个描述中包含有关内容的相关信息,并使其具有描述性。3. 标题标签 <h1> 到 <h6>标题标签按层次结构组织内容,使搜索引擎和用户能够了解页面的结构。它们真的很容易包含在你的内容中,它们是 SEO 最重要的 HTML 元标记之一。当你在整篇文章中标记所有主题标题时,你就会准确地告诉搜索引擎你的内容在讨论什么。这就是 Google 创建您在查找主题时有时会看到的片段的方式。有几种不同的 header 标签。根据您的格式,您可能有 h1、h2、h3,有时还有 h4 甚至 h5。这些将逐渐变小,制作出色的标题和副标题来组织您的内容。以下是 Erin Morrison 的婚纱摄影网站的 HTML 标签的样子:当您在网上看到该网站时,它是这样的:由于此内容的作者将其组织成易于阅读的步骤,因此 Google 在向网络搜索者展示时知道如何构建它。有两种简单的方法可以添加标题标签。如果您使用的是可视化编辑器,则通常只需单击正确的标题即可。在 HTML 编辑器中,包括标记 <h1> 表示前面,</h1> 表示末尾。您可以对所有其他 header 标签执行相同的操作。4. 图像替代文本 <img>Alt 标签是许多人错过的 SEO 机会。它们通过使屏幕阅读器能够阅读文本并确保搜索引擎了解图像的内容,为视障用户描述图像。添加这些标签可以提高可访问性并为图像提供上下文,从而有助于 SEO。为什么图像 alt 标签对于一般搜索目的如此重要?搜索引擎无法读取图像,但搜索引擎可以解释 HTML 中的 SEO 标签。这意味着您需要在所有屏幕截图和照片上包含 alt 标签,以便您的图像有机会在 Google 上排名。这样,当有人搜索 “Images” 标签页时,他们仍然可以找到您的内容。以下是 alt HTML 标记在 W3C 网站源代码中的外观:以及它对访客来说是什么样子的:要在 WordPress 帖子中的图像上包含此标签,请单击图像以查看此栏的出现。点击小铅笔。在侧面,您将看到一个标有“Alt text”的空框。
5. 规范标签 <canonical>
如果你有多个内容相似的页面,规范标签有助于防止重复内容问题并巩固链接资产,因为它们向搜索引擎展示你喜欢的网页版本。以下是这些用于 SEO 的 HTML 元标记在幕后的样子示例:canonical 标签也非常适合组织内容和优先考虑一个网页而不是重复网页。搜索引擎可以使用所有这些不同的 URL 抓取同一个网页。对我们来说,所有这些似乎都是同一个网页。但是,对于搜索引擎来说,每个引擎都是重复的。当搜索引擎试图对您的内容进行排名时,这就成为一个问题。它会混淆搜索引擎并分别对每个 URL 进行排名。要解决这个问题,您可以使用 canonical 标签来指定 Google 应该首先关注哪个 URL。这是标签的样子。
这样做将有助于搜索引擎阅读您的网站并更好地对您进行排名。
6. robots 元标签 <meta robots>
robot meta 标记指示搜索引擎爬网程序处理特定网页。这些 SEO HTML 标签允许您控制搜索引擎是否应该为页面编制索引以及它在 SERP 结果中的显示方式。如果我想告诉搜索引擎不要索引特定页面,也不要点击它上的任何链接,我的机器人元标记将如下所示:
7. 列表标签 <li>
列表标签允许您创建有序和无序列表,增强内容结构,并提高用户和搜索引擎的可读性。发布结构良好的内容使搜索引擎更容易理解上下文和内容层次结构。列表的另一个好处是搜索引擎可以将它们用于丰富的摘要,让您有机会出现在搜索结果的顶部。列表还可以提高可读性,帮助访问者在您的页面上停留更长时间,同时提高用户参与度和体验。以下是一篇博客上 Shoppable Ads 帖子的 HTML 标签编码的样子:
8. 超链接 <a>超链接对于连接网页至关重要,允许用户和搜索引擎在相关内容之间无缝导航。当用户单击超链接时,它会将他们定向到另一个页面,从而增强他们的浏览体验。对于搜索引擎,超链接有助于发现内容并为其编制索引,从而提高网站可见性。使用超链接等 HTML SEO 标签对您的网站有益,因为它们允许搜索引擎抓取您的网站,为其提供清晰的层次结构并组织您的内容。超链接还允许您链接到其他页面(内部链接)并添加 CTA。在上面的示例中:
href 属性指定链接指向的 URL。
target=“_blank” 属性可确保链接在新选项卡中打开。
文本 “Visit Example Website” 是超链接的可点击部分。
9. 结构化数据标记 <schema>使用 SEO HTML 标记 <schema> 的结构化数据标记可帮助搜索引擎了解内容的上下文、允许丰富的摘要并提高搜索结果中的可见性。例如,您的内容可能会突出显示为 FAQ 丰富摘要、评论、食谱等。这种额外的可见性可以帮助您的 SEO,提高您网站的点击率。以下是 Google 搜索 “Best Hotel New York City” 在丰富摘要中的样子。
10. 锚标签 <a>
由 <a> HTML 元素表示的锚文本标签对于创建连接不同网页或内容的超链接至关重要。它们在网站导航中起着至关重要的作用,使用户能够轻松发现相关内容。这是一篇博主最近关于 SearchGPT 的文章中的这个例子:看到橙色文本了吗?这是指向更多信息的可点击链接的锚文本。这种链接结构还通过向搜索引擎展示链接内容的相关性和上下文来增强 SEO,从而提高域权限。为什么要在内容中使用锚标签?每当您想包含来自不同来源的统计数据或图像时,您必须确保在应得的地方给予荣誉;通常,指向该网站的链接就足够了。以下是锚文本 HTML SEO 标签的样子:实际的链接标签是这部分:<a href=“http://example-blog.com”>。11. 打开图谱标签和 Twitter 卡片Open Graph 标签和 Twitter 卡片是优化内容在社交媒体平台上的外观、提高社交平台上的可见性和增加参与度的重要工具。通过在网页的 HTML 中使用特定的 <meta> SEO 标签,这些工具可以控制共享链接随附的标题、描述和图像。这使您能够在各种社交媒体网站上以不同的方式展示您的网站,并创建吸引人的片段以鼓励点击。Open Graph 标签和 Twitter 卡片的主要好处是更好的品牌知名度和更多社交渠道的参与度。
您可以自己编写这些代码,但如果您缺乏技术专业知识,请不要担心,因为您可以使用 Yoast 或 All-in-one SEO 插件。
12. 样式表
如果您希望在整个网站上保持一致性,样式表是最重要的 SEO HTML 标签之一。样式表可确保网站在视觉上具有吸引力和响应速度,以便它们适应不同的屏幕大小和分辨率,从而提高可用性并保持访问者的参与度。您可以使用样式表来定义元素(如字体、颜色、布局和空白)的样式。这些样式表使用级联样式表 (CSS) 来控制 Web 内容的呈现方式,从而显著影响用户体验和内容在各种设备上的显示方式。以下是 Nike.com 的 HTML 样式表代码。该脚本指示搜索引擎从 Nike 的网站加载两个 CSS 样式表,并定义网页的视觉外观和布局。
如果你想提高你的网站的知名度,那么为 SEO 添加一些 HTML 标签可能就是你所需要的。您可以使用 HTML 告诉搜索引擎您的网站是关于什么的以及他们应该如何对您进行排名。为了获得最佳效果,您需要注意的 HTML 标签是标题标签、元描述、标题标签、图像 alt 标签、nofollow 链接、锚文本和规范标签。