前端html编码规范

HTML代码规范

通过学习基本的HTML和CSS就能在浏览器上看到实际的效果,可是要写好的HTML,就不是那么容易了。这里将和大家分享HTML规范,希望大家读完之后都能够有所收获。本文将主要以下面三个部分展开:

  • HTML整体结构
  • HTML代码格式
  • HTML内容语义

第一部分:HTML整体结构

1.HTML基础设施

  1. 文件应以<!DOCTYPE.....>首行顶格开始,这句话告诉浏览器这是一个什么文件,我们推荐使用<!DOCTYPE html>。

  2. 必须在head元素内部的meta标签内声明文档的字符编码charset, 如:<meta charset="UTF-8">,这句代码告诉浏览器应该此HTML文件使用的字符集是什么,如果不加此行代码,那么在浏览器中可能显示为乱码。

  3. 页面的title是极为重要的不可缺少的一项。

2.HTML代码结构和视觉顺序基本保持一致

  1. 按照从上之下,从左到右的视觉顺序书写HTML结构。

  2. 有时候为了便于搜索引擎抓取,我们也会将重要内容在HTML结构顺序上提前,以为搜索引擎抓取网页内容是自上而下的,所以将重要内容在HTML结构顺序上提前可便于抓取重要的内容。

  3. 尽量不要使用table布局,现在基本上被淘汰了,而应该代之以div来布局,方便控制。

  4. 保持良好的树形结构

第二部分:HTML代码格式

说明文案的注释方法

  1. 开始注释:
<!-- 注释文案 -->
  1. 结束注释:
<!-- /注释文案 -->
  1. 允许只有开始注释。

严格嵌套

  1. 应当以最严格的xhtml strict标准来嵌套,不如内联元素不能包含块级元素等等。

  2. 正确闭合标签且必须闭合。

  3. 严格的属性

  • 每个属性都必须有一个值,每个值必须加双引号。

  • 没有值的属性必须使用自己的名称做为值(checked、disabled、readonly、selected等等)。

  • 可以省略style标签和script标签的type属性。

第三部分:HTML内容语义

  1. 加强资源型内容的可访问性和可用性。比如在img标签内加入alt属性,在audio内加入文案和链接等等。

  2. 加强不可见内容的可访问性,比如背景图片的文字应该同时卸载HTML中,并使用css使其不可见,有利于搜索引擎抓取你的内容,也可在css失效的情况下看到内容。

  3. 适当使用实体,以实体代替与HTML语法相同的字符,避免浏览器解析错误。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 136,798评论 19 139
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,260评论 1 92
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,556评论 1 41
  • “我们只能走在幻夜的路上,即使四周明亮犹如白昼,那也仅是假象。 就算与你共度的每个夜晚都是幻夜,我也愿意为你化身为...
    Pseudolove_阅读 277评论 0 0

友情链接更多精彩内容