HTML5自学
1.1 标题文本
在HTML5中,文本的结构除了以行和段落出现之外,还可以作为标题存在,通常一篇文档最基本的结构就是由不同级别的标题和正文组成的。
例如1:(中国门户网站)
https://www.gov.cn/xinwen/2017-11/06/content_5237462.htm
例如2:(百度知道)
https://zhidao.baidu.com/question/1737748898441802467.html?entry=home_new_content
例如3:(百度百科)
https://baike.baidu.com/item/%E6%B5%A3%E7%86%8A#hotspotmining
1.1.1 标题文本的标签
HTML5文档中的各级标题由< h1>到<h6>元素来定义,英文h是headline(标题行)的简称,其中,h1表示1级标题,级别最高,文字最大,其它元素依次递减,h6级别最小。
h标签是成对出现的,以<h>开始,以</h>结束。h1,h2,h3,h4,h5,h6作为标题标签,并且依据重要性递减。这种布局原则能让页面的层级关系更清楚,让搜索引擎更好地抓取和分析出页面的主题内容等等。
1.1.2 标题标签的作用
在html里的每一个标签都有其自身的意义,而H标签作为标题标签,它的意义更是至关重要。
一、H标签直观的告诉用户,网页哪部分是重要的,哪些是不那么重要的。heading 标签通常用来为用户展现网页的结构,由于heading 标签通常会使某些文字比普通的文字大,对于用户来说,便于他们更直观地看出这些文字的重要性,而且可以帮助他们理解heading文字下方的内容。多种渐变大小的heading一开始主要为网页的内容创建分层结构,便于用户直观地浏览网站;
二、H标签引导搜索引擎,网页哪些是重要的内容。对搜索引擎来说,<h>标签的主要意义是告诉搜索引擎这个是一段文字的标题或说是主题,起强调作用,h标签的权重会高于Strong。因此在搜索引擎优化中H标签的运用非常重要。因为,搜索引擎需要在一堆文本中明白它写的是什么,所以,它也依照人们的阅读习惯,首先寻找文章的标题,然而,不像人们那样可以迅速确定标题是什么,搜索引擎是“盲人”,所以,使用<h>标签就指导搜索引擎标题在那里,便于它们迅速掌握文本大意。标题(H1-H6)标签是采用关键词的重要地方,这个标签应该包括文本中最重要的关键词。
1.1.3 合理使用标题标签
一、<h1>用来修饰网页的主标题,即网页中最上层的标题,一般是网页的标题,文章标题,<h1>中部署主关键词。<h1>尽量靠近在html 中的<body>标签,越近越好,以便让搜索引擎最快的领略主题。每个页面只使用一次H1,并且H1中务必包含网站的关键字。多个H1造成的后果是搜索引擎不知道页面的哪个标题内容最重要,会淡化这个页面的标题和关键词。H1用得好的话会提高关键字的排名,用得不好会对SEO和用户造成伤害。
二、<h2>表示一个段落的标题,或者说副标题,部署长尾关键词(即网站上的非目标关键词但与目标关键词相关的也可以带来搜索流量的组合型关键词)。
三、<h3>表示段落的小节标题,<h3>效果跟Strong差不多,一般是用在段落小节。
四、<h4>-<h6>基本很少用到,是告诉搜索引擎这些不是很重要的内容,当一篇文章内容较多的时候,可以用来说明一些内容是不很重要的。
HTML5自学的更多相关文章
- html5开发学习 html5自学需要怎么学
记得很多大鳄都说过一句话:只要站在风口上,猪都能飞起来.而对于如今的IT技术领域来说,无疑这只幸运的"猪"非html5莫属.html5开发技术在16年迎来了一个飞跃的发展,这也让很 ...
- HTML5 —— 自学第一课
1.心得 首先遇见问题要寻根源,而不是将问题抛出:其次要经常查看参考文档.参考示例:学会百度. 2.技能需求 HTML5.XHTML.CSS3.JavaScript.jQuery(jQuery-UI/ ...
- HTML5自学笔记[ 11 ]canvas绘图基础1
html5新增<canvas>标签用于绘制图像,默认宽高是300*150,canvas的宽高需要在这里设置,在css中设置会有问题:设置的形状,如矩形,会等比缩放,而非设置的宽高. 在不支 ...
- HTML5自学笔记[ 10 ]简单的购物车拖拽
用html5拖拽功能实现了一个简单的购物车,样式简陋,得学学画画提高下审美了T^T: <!doctype html> <html> <head> <meta ...
- HTML5自学笔记[ 9 ]HTML5实现元素的拖放
要想在html5中实现元素的拖放,被拖放元素就必须设置属性draggable="true";被拖放元素被放置的地方是另外一个元素,该元素是目标元素:这两个元素在拖放过程中都会触发不 ...
- HTML5自学2
1.1 文字格式 一个杂乱无序.堆砌而成的网页,会让人感觉枯无味,而一个美观大方的网页,会让人有美轮美奂,流连忘返的感觉,本节将介绍如何设置网页文本格式. 文字格式包括字体.字号.文字颜色.字体风 ...
- Html5 自学笔记
1 html的全称 Hyper Text Markup Language 2 HTML的意义 使用标记标签( Markup Tag)来描述网页 3 HTML标签一定成对吗 是 4 <html ...
- HTML5自学笔记[ 24 ]canvas绘图之星空草地
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- HTML5自学笔记[ 23 ]canvas绘图基础7
变换矩阵: transform(a,b,c,d,e,f),多次使用该函数,效果是多次状态改变的累加: setTransform(a,b,c,d,e,f),会忽略之前的变换,从起始状态开始改变.
随机推荐
- AtCoder AGC032E Modulo Pairing (二分、贪心与结论)
题目链接 https://atcoder.jp/contests/agc032/tasks/agc032_e 题解 猜结论好题. 结论是: 按\(a_i\)从小到大排序之后,一定存在一种最优解,使得以 ...
- 突破大文件上传 和内网ip的端口转发
php上传大于2M文件的解决方法 2016年12月11日 :: katelyn9 阅读数 php上传大于2M文件的解决方法 如上传一个文件大于2m往往是上传不成功的解决方法: php.ini里查找 查 ...
- UFLDL(Unsupervised Feature Learning and Deep Learning)
UFLDL(Unsupervised Feature Learning and Deep Learning)Tutorial 是由 Stanford 大学的 Andrew Ng 教授及其团队编写的一套 ...
- synchronized三种使用方式,及锁的类型验证
Synchronized常用三种使用方式 1.修饰普通方法:锁对象即为当前对象 2.修饰静态方法:锁对象为当前Class对象 3.修饰代码块:锁对象为synchronized紧接着的小括号内的对象 一 ...
- git add时遇到类似fatal: Path 'XXX' is in submodule 'XXX'错误提示如何解决?
答:示例如下: fatal: Pathspec 'Vundle.vim/autoload/vundle.vim' is in submodule '.vim/bundle/Vundle.vim' 解决 ...
- TensorFlow 学习(4)——MNIST机器学习进阶
要进一步改进MNIST学习算法,需要对卷积神经网络进行学习和了解 学习材料参见https://www.cnblogs.com/skyfsm/p/6790245.html 卷积神经网络依旧是层级网络,只 ...
- 开源缓存框架之ASimpleCache
ASimpleCache 是一个为android制定的 轻量级的 开源缓存框架.轻量到只有一个java文件(由十几个类精简而来). 1.它可以缓存什么东西? 普通的字符串.JsonObject.Jso ...
- PHP中获取当前页面的完整URL、PHP URL处理、获取不带扩展名的文件名
javascript实现: top.location.href 顶级窗口的地址this.location.href 当前窗口的地址 PHP实现 #测试网址: http://localhost/blog ...
- CA证书申请+IIS配置HTTPS+默认访问https路径
引用别人博文内容:https://www.cnblogs.com/lichunting/p/9274422.html 一.CA证书申请 (一). 新StartSSL注册帐号 1. StartSS ...
- JPA 或者Hibernate 实体类说明
这里简单介绍Hibernate的Annotation注解 一.声明实体 @Entity对实体注释.任何Hibernate映射对象都要有这个注释@Table声明此对象映射到数据库的数据表,通过它可以为实 ...