一、验证代码是否符合标准

优点:

  • 标准的页面会保证浏览器正确的渲染
  • 网页能更容易被搜索引擎搜索,提高网站的搜索排名
  • 提高网站的易用性
  • 网页更好维护和扩展

常用工具:

  • W3 Validator
  • HTML Validator(Firefox)

二、常用规范

自闭合标签:area  base br col command embed hr img input keygrn link meta param source track wbr

过时标签不再使用:basefont  big  center font

不推荐在HTML标签中添加样式属性

移除不常用的HTML标签:acronym applet dir

样式与结构分离

设置IE浏览器兼容:<meta http-equiv="X-UA-Compatible" content="IE=8"/>

设置页面中移动设备的显示:<meta name="viewpoint" content="width=device-width,initial-scale=1,maximum-scale=1"/>

【Web前端开发最佳实践系列】标准的HTML代码的更多相关文章

  1. Web前端开发最佳实践系列文章汇总

    Web前端开发最佳实践(1):前端开发概述 Web前端开发最佳实践(2):前端代码重构 Web前端开发最佳实践(3):前端代码和资源的压缩与合并 Web前端开发最佳实践(4):在页面中添加必要的met ...

  2. 【Web前端开发最佳实践系列】前端代码推荐和建议

    一.常用的前端文件的组织结构: 1.js (放置JavaScript代码) lib(放置框架JavaScript文件) custom.js 2.css(放置CSS样式代码) lib(放置框架CSS文件 ...

  3. 【WEB前端开发最佳实践系列】JavaScript篇

    一.养成良好的编码习惯,提高可维护性 1.避免定义全局变量和函数,解决全局变量而导致的代码“污染”最简单的额方法就是把变量和方法封装在一个变量对象上,使其变成对象的属性: var myCurrentA ...

  4. 【WEB前端开发最佳实践系列】CSS篇

    一.有效组织CSS代码 规划组织CSS代码:组织CSS代码文件,所有的CSS都可以分为2类,通用类和业务类.代码的组织应该把通用类和业务类的代码放在不同的目录中. 模块内部的另一样式规则:样式声明的顺 ...

  5. 【WEB前端开发最佳实践系列】高可读的HTML

    一.HTML语义化 HTML5中增加了很多标签都是基于此类原则设计的(article   nav  header  footer).页面标签语义化的优点是使得搜索引擎以及第三方抓包工具等更容易读懂页面 ...

  6. Web前端开发最佳实践(5):正确闭合HTML标签,停止使用不标准的标签和属性

    正确闭合HTML标签 HTML元素的内容模型定义了元素的结构,表明元素可以包含哪些内容以及元素可以有哪些属性.元素可以包含的内容包括其他元素和字符,但是也有一些元素是空元素,即不能包含任何内容,这些元 ...

  7. Web前端开发最佳实践(1):前端开发概述

    引言 我从07年开始进入博客园,从最开始阅读别人的文章到自己开始尝试表达一些自己对技术的看法.可以说,博客园是我参与技术讨论的一个主要的平台.在这其间,随着接触技术的广度和深度的增加,也写了一些得到了 ...

  8. Web前端开发最佳实践(9):CSS代码太太乱,重复代码太多?你需要精简CSS代码

    前言 提高网站整体加载速度的一个重要手段就是提高代码文件的网络传输速度.之前提到过,所有的代码文件都应该是经过压缩了的,这可提高网络传输速度,提高性能.除了压缩代码之外,精简代码也是一种减小代码文件大 ...

  9. Web前端开发最佳实践(8):还没有给CSS样式排序?其实你可以更专业一些

    前言 CSS样式排序是指按照一定的规则排列CSS样式属性的定义,排序并不会影响CSS样式的功能和性能,只是让代码看起来更加整洁.CSS代码的逻辑性并不强,一般的开发者写CSS样式也很随意,所以如果不借 ...

随机推荐

  1. 了解ASP.NET Core 依赖注入,看这篇就够了 于2017年11月6日由jesseliu发布

    DI在.NET Core里面被提到了一个非常重要的位置, 这篇文章主要再给大家普及一下关于依赖注入的概念,身边有工作六七年的同事还个东西搞不清楚.另外再介绍一下.NET  Core的DI实现以及对实例 ...

  2. PCL(Point Cloud Library)的第三方库简单介绍(boost,eigen,flann,vtk,qhull)

    PCL由于融合了大量的第三方开源库,导致学习成本升高~在学习之前我们最好还是了解一下这些库都是干嘛的,以便有的放矢.在之后更好的使用 boost: C++的标准库的备用版,擅长从数学库到智能指针,从模 ...

  3. asp adodb.stream读取文件和写文件

    读取文件操作: '------------------------------------------------- '函数名称:ReadTextFile '作用:利用AdoDb.Stream对象来读 ...

  4. git clone Google的代码失败的解决方法

    git clone Google的volley代码遇Q. 想到用代理服务器就可以解决这个问题.Google了一下解决方法,记录下来,分享一下. git config:                 

  5. 文字描边css

    -webkit-text-stroke: 3.3px #2A75BF; -webkit-text-fill-color:#fff; 该方法在安卓端貌似不支持,显示为一团 或: -webkit-text ...

  6. 【matlab】=size(img)的其中两种用法&zeros( )

    i1=imread('D:\Work\1.png'); i1=rgb2gray(i1); [m,n]=size(i1); 返回图片的尺寸信息, 并存储在m.n中.其中m中存储的是行数,n中存储的是列数 ...

  7. Python对象(上)

    Python是一门面向对象的语言,在Python中一切都是对象,函数是对象,类型也是对象. 下面就看看Python中对象相关的内容. Python对象基本概念 Python对象有三个基本的要素: 身份 ...

  8. HTTP API接口测试利器PostMan介绍

    一.什么是API接口测试? API接口有多种,个人将其划分为三类.第一种是函数级别的,测试需要对接口的各个参数进行测试,如:Int getResult(String key, String ID, I ...

  9. 【Cesium】天空盒子

    skyBox: new Cesium.SkyBox({ sources: { positiveX: 'static/image/skyBox/posx.jpg', negativeX: 'static ...

  10. 使用 vux 框架

    1)vux官网:https://vux.li/#/ 2)通过 vue-cli 工具使用 vux 1.如果没有安装 nodejs,请先前往 nodejs 官网下载并安装 nodejs,传送门:https ...