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标签语义化

网站标题

网站副标题

第一部分
第二部分
©2018 GaoFang Huang

更多查阅 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的更多相关文章

  1. WEB前端开发规范

    WEB前端开发规范 规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档.本文档如有不对或者不合适的地方请及时提出, 经讨论决定后方可更改. 基本 ...

  2. WEB前端开发规范文档(转)

    http://codeguide.bootcss.com/  编写灵活.稳定.高质量的 HTML 和 CSS 代码的规范上面的文档 再结合下面的规范: 无论是从技术角度还是开发视角,对于web前端开发 ...

  3. 前端开发规范:命名规范、html 规范、css 规范、js 规范

    上周小组的培训内容是代码可读性艺术,主要分享如何命名.如何优化代码排版,如何写好的注释.我们都知道写出优雅的代码是成为大牛的必经之路. 下面感谢一位前端开发小伙伴总结的前端开发规范,通过学习相关开发规 ...

  4. 网站开发进阶(三十八)Web前端开发规范文档你需要知道的事

    Web前端开发规范文档你需要知道的事 规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进 ...

  5. Web前端开发规范文档你需要知道的事

    Web前端开发规范文档你需要知道的事 规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进 ...

  6. WEB前端开发规范文档[转]

    为新项目写的一份规范文档, 分享给大家. 我想前端开发过程中, 无论是团队开发, 还是单兵做站, 有一份开发文档做规范, 对开发工作都是很有益的. 本文档由本人编写, 部分意见来源于网络, 以此感谢, ...

  7. Web 前端开发规范手册

    一.规范目的 Web 前端开发规范手册 1.1 概述 ......................................................................... ...

  8. Web前端开发规范手册

    一.规范目的 1.1  概述 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进行前台页面开发.  ...

  9. Web前端开发规范文档(google规范)

    (Xee:其实没什么规范约束,但是养成一种好习惯,何乐而不为?) 区分大小写 xhtml  区分大小写,xhtml要求 标签名 属性名 值都要小写,并且要有双引号和 标签闭合. css 元素名称以及i ...

  10. Web前端开发规范文档你需要知道的事--HTML、css、js、文档等需要规范内容

          规范目的 为提高团队协作效率,便于后台人员添加功能及前端后期优化维护,输出高质量的文档,特制订此文档.本规范文档一经确认,前端开发人员必须按本文档规范进行前台页面开发.本文档如有不对或者不 ...

随机推荐

  1. luogu P1650 田忌赛马 |贪心

    题目描述 我国历史上有个著名的故事: 那是在2300年以前.齐国的大将军田忌喜欢赛马.他经常和齐王赛马.他和齐王都有三匹马:常规马,上级马,超级马.一共赛三局,每局的胜者可以从负者这里取得200银币. ...

  2. luogu P2824 [HEOI2016/TJOI2016]排序

    题目描述 在2016年,佳媛姐姐喜欢上了数字序列.因而他经常研究关于序列的一些奇奇怪怪的问题,现在他在研究一个难题,需要你来帮助他.这个难题是这样子的:给出一个1到n的全排列,现在对这个全排列序列进行 ...

  3. Selenium 4 Python的最佳测试框架

    随着Python语言的使用越来越流行,基于Python的测试自动化框架也越来越流行.在项目选择最佳框架时,开发人员和测试人员会有些无法下手.做出选择是应该判断很多事情,框架的脚本质量,测试用例的简单性 ...

  4. 2019ICPC 上海网络赛 G题 Substring(哈希)

    题意: 给了一个母串S, 每次循环给了一个模板串,问模板串在母 串中“匹配”了多少次?“匹配”的意思就是首字母和尾字母一样, 中间字母顺序可以换. 题解: 字符串hash.我们将询问字符串的首尾特殊h ...

  5. 洛谷 题解 P2117 【小Z的矩阵】

    这题这么无聊,亏我还用了读入输出优化... 关键在于,这还是道黄题QWQ 掀桌而起 (╯‵□′)╯︵┻━┻ 显而易见,在i != j的情况下,a[i][j] + a[j][i]和a[j][i] + a ...

  6. 初次在Vue项目使用TypeScript,需要做什么

    前言 总所周知,Vue新版本3.0 使用 TypeScript 开发,让本来就很火的 TypeScript 受到更多人的关注.虽然 TypeScript 在近几年才火,但其实它诞生于2012年10月, ...

  7. Python基础第二课

    字符串(引号):四种表达方式 n1 = "我是" n1 = '我是' n1 = """我是""" n1 = '" ...

  8. Python抓取豆瓣电影top250!

    前言 本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理.作者:404notfound  一直对爬虫感兴趣,学了python后正好看到 ...

  9. 深入学习 OLED Adafruit_SSD1306库(8266+arduino)

    QQ技术互动交流群:ESP8266&32 物联网开发 群号622368884,不喜勿喷 单片机菜鸟博哥CSDN 1.前言 SSD1306屏幕驱动库,最出名应该就是u8g2,读者可以参考 玩转u ...

  10. 【React】在React中 JSX 代码如何转成 JS 代码?

    一.介绍 写 React 代码的朋友应该都是直接写 JSX 代码,JSX 让我们可以在 JS 中直接写 HTML 代码,可阅读性较高.本章节主要介绍 JSX 通过 babel 转换后会生成什么样式代码 ...