分离结构与表现的另一个重要方面是使用语义化的标记来构造文档内容。一个Xhtml元素的存在就意味被标记内容的那部分有相应的结构化的意义,没有理由使用其他的标记。换句话说,不要让CSS使一个HTML元素看起来就像另一个HTML元素,比如用<div>来代替<p>标记标题。
虽然语义化的HTML属于WEB标准化范畴,值得WEB前端的设计者学习,但对于一个全面的SEO来说,使用标准化的网页结构,对SEO是有百利而无一害的,而WEB标准化就必须谈到语义化的HTML。其实,应该很容易想象,如果整个HTML文档中,都只用div来布局、表现数据,那还需要其他的那些HTML标签做什么呢?可以这么说,语义化的HTML让我们的网页更加容易被人或者机器理解,更容易清楚的表达网页的真实含义。下面,我们就来了解下SEO种需要重点注意的一些语义化HTML。
标题<Hx>
<h1>、<h2>、<h3>、<h4>、<h5>、<h6>,在WEB中作为标题使用,并且依据重要性递减。<h1>是最高的等级,所以你需要准确确定每个页面最重要的内容是什么,要优化的关键词在哪里。以我们最常见的博客为例,博客首页罗列最多的通常就是最新博文,而最重要的应该就是博客的名称了,是不是每个页面的H1标签都包含博客名称呢?建议次级页面的博客名称链接都放在H2标签里,而你的文章标题则使用H1标签,这样对于整站优化是很有帮助的,这也是优化到每个页面需要注意的一点。通过合理设置每个页面的hx标题,网站的内容才会更具优势。
强调<em>、<strong>、<b>、<i>
<em>、<strong>这两个标签对SEO有着较大影响效果,适当使用它们,可使你的网页增色不少。<em>、<strong>与Hx一样,其区别也在于重要性不一样。<em> 表示强调,而<strong>意为重点强调,较em更重一些。在SEO时,我们可以将最重要的关键词用strong标记,对第二重要的用em标记。结合前面使用的Hx标签,它们更适合放在文章正文的内部,而Hx理所当然是在用在正文的外部。有些WEB设计者为了达到网页的某些效果,使用<strong>纯粹是为了达到加粗,使用em就是为了倾斜,而这种做法根本没必要,而且相反可能会影响到SEO的效果。在以前,为了达到粗体、斜体的效果,WEB设计者会使用<b>、<i>标签,而现在基本不用它们了,它们仅仅是用来表现文本样式的,而最明智和常用的解决方案是用CSS来控制文字样式。
段落<p>
当搜索引擎读取网页内容的时候,遇到P标签的时候,立马就知道这是一个段落,而如果使用DIV,就无法体现html语义化的优势了。从WEB标准的角度来看,文章正文使用P是理所当然,也是更值得提倡的。不过如果使用<div>代替<p>,对SEO的影响还是甚微的,因为它们并没有任何强调的意味在里面。但是如果你使用P来给网页整体布局,就显得有些怪异了。
列表<ul>、<ol>、<li>、<table>
<ul>为无序列表,大家广泛使用的,有序列表<ol>也挺常用。在web标准化过程中,<ul>被更多的用于导航条,这样做是完全正确的,而 在文章列表里面,就可以使用ol了,因为那些列表都是有一定顺序的。当然,这两个对于SEO的影响也是甚微的,但如果你使用表格<table>代替列表,不仅会使得HTML文档变得冗长,更没能很好的利用HTML语义化的优势来优化你的网页,因为表格更适合来标记列表的数据。
title属性(不是title标签)和alt属性
title属性是用来为元素提供额外说明信息的,它可以用在除了base,basefont,head,html,meta,param,script和title之外的所有标签。alt属性为不能显示图像、窗体或applets的用户代理(UA),指定替换文字。alt属性对图片优化的功能是毋庸置疑的,而且这也是SEO所提倡的,如果你非用图片到HTML里面去,最好将图片加上ALT属性,而且可以将关键词适当的放到里面去。半年前看到一位博友说title属性(不是title标签)可以增加网站的关键词密度,零才在这里持有不同的观点,因为现在ALT属性里的值都已经被搜索引擎轻视了,title里面的内容对关键词密度的影响也会被搜索引擎放低,同时。title属性里的内容并不一定能够增加关键词的密度,如果大量使用,且里面的内容不含关键词,相反会削弱关键词密度。
这篇文章更适合SEO初学者来看,但是对于很多只懂链接和内容操作的SEO来说,WEB标准还是应该引起大家的注意。同时,对于WEB设计者来说,考虑HTML对网站SEO的影响,更应该正确的使用你手下的HTML标记。
分享到:
相关推荐
网页设计是IT领域中至关重要的一环,特别是在互联网时代,个人博客作为个人展示、分享和交流的平台,受到了广泛欢迎。这个“网页设计作业-个人博客”项目,是针对前端开发初学者的一个很好的学习实例,它涵盖了HTML...
在本文中,我们将深入探讨这个模板中的关键知识点,并解释它们如何帮助提升网页设计的水平。 首先,我们来谈谈HTML5。HTML5是超文本标记语言的最新版本,它引入了许多新特性,旨在提高网页的交互性、可访问性和性能...
【标题】中的“html网页设计作业-基于html+css,制作的学校官网网页”表明这是一个使用HTML和CSS技术设计的学校官方网站的项目。HTML(HyperText Markup Language)是用于创建网页的标准标记语言,而CSS(Cascading ...
网页设计是数字时代的重要组成部分,尤其在互联网领域,一个优秀的网页设计可以提升用户体验,吸引更多的访问者。HTML5作为最新的超文本标记语言标准,为网页设计师提供了更多创新和功能增强的可能性。本压缩包"网页...
HTML5模板可能遵循SEO最佳实践,比如使用`<meta>`标签来提供元数据,用`<title>`和`<description>`元素来设定页面标题和摘要,以提高在搜索引擎结果中的可见性。同时,网站的加载速度也会影响SEO评分,所以模板可能...
在这个项目中,源码文件展示了如何使用HTML标记来组织文本、图像、链接和其他元素,构建出符合纺织行业特色的网页布局。例如,可能会有专门的页面来介绍纺织材料、生产工艺或者产品目录。HTML代码的编写需要遵循语义...
通过合理的元标签设置、结构化的数据标记以及语义化的HTML代码,模板可以更好地被搜索引擎理解,从而提高网站在搜索结果中的排名。 6. **移动优先策略**:随着移动设备的普及,婚庆网站模板需适应移动优先的设计...
在这个“网页设计作业-小米网站”项目中,我们可以看到一个初学者尝试通过Dreamweaver这样的工具来模仿知名科技品牌——小米的官方网站。这个作业虽然不用于商业目的,但它是学习网页设计过程中的宝贵实践。 首先,...
这个压缩包文件包含了一个完整的Web网页设计项目,主要用于教学或毕业设计的实践,它涵盖了前端开发中的三个核心元素:HTML(超文本标记语言)、CSS(层叠样式表)和JavaScript。下面将详细介绍这三个方面的知识及其...
在网页设计制作领域,HTML(HyperText Markup Language)是构建网页的基础语言,它定义了网页的结构和内容。这个毕业设计项目主要是围绕网络公司HTML网站的源码进行的,旨在让学生掌握网页设计的基本技能,并能独立...
在给定的网页设计中,通过使用HTML,开发者能够定义网页的不同部分及其内容。例如,标题、段落、链接、图像等都由特定的HTML标签表示。 - **CSS (Cascading Style Sheets)**:这是一种用于描述HTML文档外观的语言,...
在这个“网页设计模板-黑色漂亮大气的html5整站模板”中,我们主要关注的是HTML5技术在现代网页设计中的应用以及如何利用这种模板来提升网站的视觉效果和用户体验。 HTML5是超文本标记语言的最新版本,它引入了许多...
在本文中,我们将深入探讨 Laravel 开发中的一个重要扩展——`laravel-seo-attributes`。这个扩展专门设计用于帮助开发者快速、方便地在 Laravel 视图中添加 SEO(搜索引擎优化)属性,从而提升网站在搜索引擎结果页...
7. SEO(搜索引擎优化):为了提高网站在搜索引擎中的可见性,需要考虑SEO策略。这包括合理使用关键词、创建元标签、优化URL结构等。 8. 网页布局:理解网格系统、流式布局和固定布局等不同的网页布局方式,对于...
在本毕业设计大作业中,你将接触到的是一个针对其他行业的HTML网站源码,这为你提供了实践和学习网页设计的宝贵机会。 1. HTML基础知识:HTML由一系列元素组成,每个元素都有其特定的标签,如`<html>`、`<head>`、`...
HTML5是超文本标记语言的最新版本,它引入了许多新特性,如语义化标签、媒体元素、离线存储以及增强的表单控件,这使得网页设计更加灵活且易于维护。在该模板中,HTML5的使用确保了跨平台兼容性,提高了用户体验,...
7.3 典型的CSS布局章节可能涵盖流体布局、网格布局、响应式布局等,这些是现代网页设计中常用的技术,旨在确保页面在不同设备和屏幕尺寸下都能良好显示。 7.4 实训部分则提供实践机会,让学生通过实际操作加深对...
模板基于DIV+CSS布局,这是一种现代的网页设计方法,将内容(HTML)与样式(CSS)分离,使网页更易于维护和适应不同设备。 1. **DIV+CSS布局**:DIV是一个HTML标签,通常作为容器元素来组织页面结构。CSS...
【Web网页设计制作-毕业设计期末大作业】化妆品公司HTML网站源码是一个综合性的项目,旨在教授学生如何创建一个专业且吸引人的化妆品公司网站。这个压缩包包含了一系列用于构建网站的HTML文件,这些文件是网站结构的...