zoukankan      html  css  js  c++  java
  • HTML标签语义化

    <Hx>

    <h1>、<h2>、<h3>、<h4>、<h5>、<h6>,作为标题使用,并且依据重要性递减。<h1>是最高的等级。

    P

    段 落标记,知道了 p 作为段落,你就不会再使用<br />来换行了,而且不需要<br /> 来区分段落与段落。p中的文字会自动换行,而且换行的效果优于<br />。段落与段落之间的空隙也可以利用CSS来控制,很容易而且清晰的区分出段落与段落。

    <ul>、<ol>、<li>

    <ul> 无序列表,这个被大家广泛的使用,<ol>有序列表也挺常用。在web标准化过程中,<ul> 还被更多的用于导航条,本来导航条就是个列表,这样做是完全正确的,而且当你的浏览器不支持CSS的时候,导航链接仍然很好使,只是美观方面差了一点而 已。

    <dl>、<dt>、<dd>

    dl就是“定义列表”。比如说词典里面的词的解释、定义就可以用这种列表。

    <em>、< strong >

    <em> 是用作强调的,strong是用作重点强调的。

    <table>、<td>、<th>、< caption >、 summary

    XHTML 中的表格不再是用来布局。如果是为了标记列表的数据,就应该使用表格了。<th>为表格标题,属性summar为摘要(要想提高搜索的排名这 个绝对不应该少),<caption>标签为首部说明,<thead>标签为表格头部,<tbody>标签为表格主 体内容,<tfoot>标签为表格尾部。

    <ins>, <del>

    知道del,就不要再用<s>做删除线了,用del显然更具有语义化。而且del还带有cite和datetime来表明删除的原因以及删除的时间。ins是表示插入,也有这样的属性。

    <abbr>、<acronym>

    <abbr>标签是表示web页面上的简称,<acronym>标签为取首字母缩写。

    alt属性和title属性

    title属性用来为元素提供额外说明信息,但是并不是必须的。

    alt属性为不能显示图像、窗体或applets的用户代理(UA),指定替换文字。替换文字的语言由lang属性指定。

    让你语义化HTML结构的无数条理由:

    1.去掉或样式丢失的时候能让页面呈现清晰的结构: 
    HTML 本身是没有表现的,我们看到例如<h1>是粗体,字体大小2em,加粗;<strong>是加粗的, 不要误会这是HTML的表现,这些其实是HTML默认的CSS样式在起作用。所以去掉或样式丢失的时候,也能让页面呈现清晰的结构,增强页面的可读性。

    2.屏幕阅读器(如果访客有视障)会完全根据你的标记来“读”你的网页

    如果你使用的含语义的标记,屏幕阅读器会根据你的标签来判断网页的内容,而不是一个字母一个字母的拼写出来。

    3.PDA、手机等设备可能无法像普通电脑的浏览器一样来渲染网页(因为这些设备对CSS的支持较弱)。

    使用语义标记可以确保这些设备以一种有意义的方式来渲染网页。理想情况下,观看设备的任务是符合设备本身的条件来渲染网页。

    4.搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重。

    搜索引擎的爬虫也是网站的“访客”,现在它们是极其宝贵的用户。没有他们的话,搜索引擎将无法索引你的网站,然后一般用户将很难过来访问。

    5.便于团队开发和维护

    在团队中大家都遵循同一个标准,可以减少很多差异化的东西,方便开发和维护,提高开发效率,甚至实现模块化开发。

  • 相关阅读:
    洛谷 P1886 滑动窗口 (单调队列)
    Acwing 288.休息时间 (环形DP)
    Acwing 287.积蓄程度 (树形DP换根)
    2020 Multi-University Training Contest 5 Tree (树形DP)
    剑指offer-JZ50-数组中的重复数字(C++)
    假设以下有一个结构体存放的是学生的记录,每条记录包括:学号、姓名、成绩
    剑指offer-JZ48-不用加减乘除做加法(C++)
    剑指offer-JZ51-构建乘积数组
    数据结构与算法->递归
    力扣(LeetCode)试题6-Z字形变换 C++代码
  • 原文地址:https://www.cnblogs.com/tearer/p/2820751.html
Copyright © 2011-2022 走看看