• 什么是语义化良好的网页


         因为CSS很强大,所以无论有没有按照语义选择标签,我们都可以通过css实现需要的设计。但这也是把双刃剑,如果使用不当,容易使我们陷入css布局的一个误区----只要不是table布局,只要是通过css布局的,就是对的,就是符合web标准的。如果只是考虑最终视觉效果,而不考虑标签语义,其实又走上了table布局的老路。正确做法是先确定HTML,确定语义的标签,再来选用合适的css。

         判断网页标签语义化是否良好的一个简单方法是:去掉样式,看网页结构是否组织良好有序,是否仍然有很好的可读性。

          同样的设计图,不同的HTML标签可以通过不同的CSS实现同样的页面,但语义不好的CSS布局和语义良好的CSS布局在去掉样式后的表现却可能截然不同。(在Firefox浏览器中Web Developer插件中可以禁用网页中的css)

         除了去样式后的可读性外,值得重点提及的还有h标签。h标签的含义是“标题”,搜索引擎对这个标签比较敏感,尤其是h1和h2。一个语义良好的页面,h标签应该是完整有序没有断层的,也就是说,要按照h1,h2,h3,h4这样依次排列下来,不要出现类似h1,h3,h4,漏掉h2的情况。

        当页面内标签无法满足设计需要时,才会适当添加div和span等无语义标签来辅助实现。

    语义化标签应注意的一些其他问题

          1,尽可能少地使用无语义标签div和span。

          2,在语义不明显,既可以用p也可以用div的地方,尽量用p,因为p默认情况下有上下间距,去样式后的可读性更好,对兼容特殊终端有利。

          3,不要使用纯样式标签,例如b,font,和u等,改用css设置。语义上需要强调的文本可以包在strong或em标签里,strong和em有“强调”的语义,其中strong的默认样式是加粗,而em默认样式是斜体。

  • 相关阅读:
    暴力STL
    多维坐标离散 排序二分 | set | hash
    H. 试题H:摆动序列 25'
    蓝桥杯模拟赛4.D.路径配对[搜索+判重]
    python 参数表,可变参数,用 json/dict 作为函数参数传入
    sql 修改查询结果的值给接下来的查询用,但是不更改数据库中的值
    使用chrome全网页或部分网页截图
    一个sql语句中用多个where
    sql 使用with as 语句报 “Only `SELECT` statements are allowed against this database”错误
    go 语言并行
  • 原文地址:https://www.cnblogs.com/disneyland/p/4160558.html
Copyright © 2020-2023  润新知