前端开发规范:2-HTML
HTML标签
文档声明,除非必须要兼容IE6等远古浏览器,否则一律使用HTML5文档类型申明<!DOCTYPE html>
标签闭合,img、br、hr 等自闭合标签不使用闭合斜杠

meta标签,声明编码
静态资源引入顺序, css文件在head结束之前引入,js文件在body结束之前引入并加上async属性,不需要写Type属性。
公共样式和框架要放在其他文件前面, 如common.css要放在style.css前面,文件在前的会被先解析渲染,而后面的规则会覆盖掉前面的。
正确的html文档格式
例:home.html
<!DOCTYPE html>
我是标题
to do sth...
HTML标签语义化
网站标题
网站副标题
更多查阅 https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element
SEO优化
合理使用h1~6标签
标题内容尽量使用h1~h6等标签,在HTML5标准中同一个页面已经可以使用多个h1标签,应根据页面内容选择不同量级。
给外链加上nofllow属性
通常认为使用了nofllow属性的链接不会被搜索引擎跟踪(该观点有争议),更不会给链接页面传递权重。最常用的方式是使用nofllow属性来避免页面权重不必要的流失从而达到权重集中的目的。
合作伙伴
canonical继承原页面权重
有时候同一个内容的网页会存在多条URL,用于关联原页面和 百度MIP 页,保证 MIP 页继承原页面权重,在移动搜索时优先展现 MIP 页。在head标签结束之前使用,建议放在meta标签下,其中的链接使用绝对链接。
图片加描述alt属性

块级元素与内联元素的换行
abcefg
abc
efg
内联元素中含换行符也是会占用空间的,为了避免元素错位,在编辑器中内联元素也推荐换行处理。
VScode编辑器推荐安装插件Beautify,来自动处理代码格式化排版的问题。
常用meta标签说明
meta标签共有两个属性,分别是http-equiv属性和name属性。
基础meta
基本每个网页都必备的meta
搜索引擎相关
浏览器配置相关
移动端适配相关
前端开发规范:2-HTML的更多相关文章
- WEB前端开发规范
WEB前端开发规范 规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档.本文档如有不对或者不合适的地方请及时提出, 经讨论决定后方可更改. 基本 ...
- WEB前端开发规范文档(转)
http://codeguide.bootcss.com/ 编写灵活.稳定.高质量的 HTML 和 CSS 代码的规范上面的文档 再结合下面的规范: 无论是从技术角度还是开发视角,对于web前端开发 ...
- 前端开发规范:命名规范、html 规范、css 规范、js 规范
上周小组的培训内容是代码可读性艺术,主要分享如何命名.如何优化代码排版,如何写好的注释.我们都知道写出优雅的代码是成为大牛的必经之路. 下面感谢一位前端开发小伙伴总结的前端开发规范,通过学习相关开发规 ...
- 网站开发进阶(三十八)Web前端开发规范文档你需要知道的事
Web前端开发规范文档你需要知道的事 规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进 ...
- Web前端开发规范文档你需要知道的事
Web前端开发规范文档你需要知道的事 规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进 ...
- WEB前端开发规范文档[转]
为新项目写的一份规范文档, 分享给大家. 我想前端开发过程中, 无论是团队开发, 还是单兵做站, 有一份开发文档做规范, 对开发工作都是很有益的. 本文档由本人编写, 部分意见来源于网络, 以此感谢, ...
- Web 前端开发规范手册
一.规范目的 Web 前端开发规范手册 1.1 概述 ......................................................................... ...
- Web前端开发规范手册
一.规范目的 1.1 概述 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进行前台页面开发. ...
- Web前端开发规范文档(google规范)
(Xee:其实没什么规范约束,但是养成一种好习惯,何乐而不为?) 区分大小写 xhtml 区分大小写,xhtml要求 标签名 属性名 值都要小写,并且要有双引号和 标签闭合. css 元素名称以及i ...
- Web前端开发规范文档你需要知道的事--HTML、css、js、文档等需要规范内容
规范目的 为提高团队协作效率,便于后台人员添加功能及前端后期优化维护,输出高质量的文档,特制订此文档.本规范文档一经确认,前端开发人员必须按本文档规范进行前台页面开发.本文档如有不对或者不 ...
随机推荐
- poj3111 K Best 最大化平均值,二分
题目:http://poj.org/problem?id=3111 题意:给你n,k,n个数的v.w值,选出k个数,使得v之和/w之和最大化. 思路:一看到题目,这不是赤果果的贪心吗?为什么放在二分专 ...
- 最小生成树唯一性判断-UESTC1959天才钱vs学霸周
天才钱vs学霸周 Time Limit: 1000 MS Memory Limit: 256 MB Submit Status 有一天,天才钱和学霸周闲的无聊玩起了游戏,游戏内容是这样的,现在 ...
- CodeForces1006F-Xor-Paths
F. Xor-Paths time limit per test 3 seconds memory limit per test 256 megabytes input standard input ...
- Vue - 简单实现一个命令式弹窗组件
前言 在日常工作中弹窗组件是很常用的组件,但用得多还是别人的,空闲时间就自己来简单实现一个弹窗组件 涉及知识点:extend.$mount.$el 使用方式: this.$Confirm({ titl ...
- C语言之推箱子游戏代码
前言本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理.作者:Yan_Less 正文 新手注意:如果你学习遇到问题找不到人解答,可以点 ...
- 用tensorflow求偏导
# coding:utf-8 from __future__ import absolute_import from __future__ import unicode_literals from _ ...
- CapSupport 的使用
CapSupport 是在CAP的操作上做了一些封装 目的是让事务同时执行或者同时回滚 startup services.AddCapSupport((optaion) => { optaion ...
- FPGA之驱动sdram控制兼容性移植实验
cb早在2012年就推出了VIP 视频开发板 V1.4 这套开发板是ep2的,摄像头是ov7670,虽然不如当前的vip20强大,但也算是其雏形. 在vip20后期,cb对sdram以及其他模块进行 ...
- IOS系统定时APP
将页面分为时间显示部分,控制部分,显示计次共三个部分.实现的功能有:启动定时器,计次,停止,复位. 计算:当前显示的时间 = 当前计次的累积时间 + 已经结束的所有计次的累积时间和: 关于 new D ...
- 【CSS】381- 提升你的CSS选择器技巧
我已经使用CSS多年了,但直到最近我才深入研究了一下CSS选择器. 我为什么要这样做呢?我们都知道选择器,但麻烦的是随着时间的推移,很容易习惯于在每个项目中使用相同的可信任选择器来实现你需要做的事情. ...