语义的概念起源于语言学领域。它的字面意思是“意义研究”。因此,语义学是在不同的指示符(例如单词,符号和符号)之间寻找联系的学科。由于HTML是一种标记语言,而不是编程语言,因此语义是其中非常重要的一部分。如果明智地使用HTML5语义,则可以使的网站更易于访问,改善用户体验并获得更好的搜索引擎排名。在本篇文章中,我们将介绍什么是HTML5语义及其对SEO的作用。然后,我们将为提供一些动手技巧,可以帮助改善HTML页面的语义。

什么是HTML5语义?

从HTML语言开始,语义就一直是HTML不可或缺的一部分。但是,只有在引入HTML5之后才引起广泛关注。鲜为人知的是,HTML4.01及其之前的版本还包含语义标记,最重要的是所有HTML页面上都需要的<html>,<head>和<body>标记。

此外,所有具有某种含义的HTML标记,例如标题(<h1>,<h2>,<h3>,<h4>,<h5>,<h6>),有序和无序列表(<ol>,<ul>,<li>),段落(<p>),图像(<img>),表(<table>,<thead>,<tbody>,<tfoot>,<tr>,<td>),表单元素(<form>,<fieldset>,<label>,<input>,<textarea>)和链接(<a>)也是语义元素。

HTML5 在语言中添加了多个新的语义标记,例如<figure>,<header>,<footer>(块级标记)和<strong>,<em>和<mark>(内联级标记)。但是,真正重要的是引入了四个分段标签:<article>,<aside>,<nav>和<section>。它们使可以为每个HTML页面创建有意义的文档大纲。

如何使用语义来改善SEO排名

搜索引擎排名取决于许多不同的因素。在过去的几年中,搜索引擎的算法越来越重视高质量的内容。因此,如果想在搜索引擎上排名靠前,则需要编写清晰的副本,以便他们正确理解。这就是HTML5语义出现的地方。

默认情况下,搜索引擎机器人不了解内容的结构。可以将它们视为一个看不见图像,布局和样式元素的盲人。尽管他们可以阅读文本(因此关键字优化仍然很重要),但他们看不到内容的不同部分之间如何相互关联。可以通过两种不同的方式为这个无意义的结构添加含义:

  1. 使用HTML语义
  2. 通过丰富的摘要,或者换句话说,通过结构化数据

由于丰富的摘要是另一个主题,因此在本指南中我们将不再讨论。但是,如果要创建在搜索引擎中排名较高的高质量内容,则需要同时使用这两种技术。

选择合适的语义标签

HTML5语义看起来很简单,但是,需要避免一些陷阱。要理解的最重要的事情是,并非所有语义标记都具有相同的目的。语义标签主要有三种类型:

  1. 块级分段元素
  2. 块级非分段元素
  3. 内联级元素

块级分段元素创建一个可由搜索引擎机器人读取的文档大纲。如前所述,其中有四个:

  1. <article>用于文章或评论等独立内容
  2. <section>标记逻辑上属于其他内容的其他内容块,例如选项卡式内容
  3. <aside>对于侧边栏
  4. <nav>用于导航部分

合理地使用非语义元素

除了语义元素,如果想在搜索引擎排名中表现出色,还需要注意非语义标签。非语义标签也有自己的用途。当仅出于样式原因需要标记内容时,可以使用它们。

例如,当想向一组互不相关的内容添加左页边距时,需要引入一个HTML类,以便可以使用CSS对其进行样式设置。这是非语义<div>标记的最佳选择,因为它没有为该组分配结构含义。块级<div>标记也具有内联级等效项:<span>可以以相同的方式使用,仅用于内联内容。

很多时候,决定是否需要语义或非语义元素并不容易。一般来说,太多的语义标签也会损害文档的轮廓,因为页面结构会太复杂。

HTML5语义是创建在Google和其他搜索引擎中排名较高的内容的重要步骤。它的学习曲线相对平坦,因此值得将其集成到的工作流程中,因为它可以为的网站增加很多价值。内容是用户体验的重要方面。编写引人入胜的副本还不够,还需要以用户和搜索引擎可以理解它的方式来呈现它。