Web前端规范--HTML规范

本文提供了一套详尽的HTML编码规范指南,包括标签使用、文档声明、字符集定义、元信息设置、脚本及样式引入的最佳实践等内容,帮助开发者创建高质量的网页。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、html标签、html属性全部小写。

2、 文件应以”<!DOCTYPE … …>”首行顶格开始,推荐使用”<!DOCTYPE HTML>”。

3、必须声明文档的编码charset,且与文件本身编码保持一致,推荐使用UTF-8编码。

<meta charset="UTF-8">

4、根据页面内容和需求填写适当的keywords和description。

5、 IE 支持通过特定的 <meta> 标签来确定绘制当前页面所应该采用的 IE 版本。

<meta http-equiv="X-UA-Compatible" content="IE=Edge">

6、 使用双引号(“”) 而不是单引号(”) 。

7、 如果只需兼容 IE10+,可将 HTML5 的 async 属性加至脚本中,它可防止阻塞 DOM 的解析 。

<script src="main.js" async></script>

8、双标签必须闭合,单标签(自关闭标签)不闭合。

9、使用style、link、script,不用指定type属性,因为 text/css 和 text/javascript 分别是他们的默认值。

10、 table不建议用于布局,tab只可用于表现具有明显表格形式的数据。

11、使用link将CSS文件引入,并置于head中。使用script将JS文件引入,并置于body底部。

12、 段落文字应该用<p>,避免使用<br>。

13、 列表项放<ul>、<ol>、<dl>,不要使用一系列的<div>或<p> 。

14、 form button应制定type类型,使用type="submit"、type="reset"或type="button"。

15、 有效使用<thead>、<tfoot>、<tbody>、<th>(scope属性)。可以把<tfoot>放<tbody>前提高加载速度。

16、 块元素、列表元素、表格元素都放在新行。

17、图片文件可采用有意义的备选文本(alt)( 图片的 alt 属性是可不填写内容的alt=""

<img src="banner.jpg" alt="welcome">

18、 严格地保证结构、表现、行为三者分离,并尽量使三者之间没有太多的交互和联系。

19、 不在元素上使用 style 属性(比如<div style="border:1px solid #CCC"></div>是不建议的)

20、标签最好语义化。

21、 标题最好用h*(同一页面只能有一个h1)。

22、尽可能减少div多层嵌套。

23、指定img明确的宽度和高度,可以增加页面渲染速度

24、多余代码, 比如页面注释掉不需要的代码,应该坚决删除掉。

25、注意浮动的浏览器兼容问题。及时清除浮动。

26、 很多浏览器会将含有这些词的作为广告拦截: ad、ads、adv、banner、sponsor、gg、guangg、guanggao等 页面中尽量避免采用以上词汇来命名。

转载于:https://my.oschina.net/CharmyZ/blog/761136

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值