【03】Html书写规范
【03】
Html书写规范
1、推荐使用html5的文档声明
- <!DOCTYPE HTML>
2、必须申明文档的编码charset,且与文件本身编码保持一致,推荐使用UTF-8编码
- <metacharset="utf-8">
3、title 不可缺少,控制在25个字、50个字节以内。“二级栏目 - 一级栏目 - 网站名称”。
4、keywords很重要,关键词,针对SEO。
注意: 5个左右,单个8汉字以内;禁忌堆砌,与网站主题无关。
5、description网站描述,字数尽量空制在80个汉字,160个字符以内
6、采用栅格化处理,常用980栅格,1000栅格
7、书写注释,方便程序开发嵌套。注释方式:
开始注释:<!-- 注释 -->
结束注释:<!-- /注释文案 -->
允许只有开始注释
注意: 浮动的地方不要加注释,可能导致布局错位或文字的BUG。
8、img添加alt属性,增加可访问性。
- <imgsrc=""alt="图片描述"title="图片描述">
9、带有实体名称的 ASCII 实体或特殊字符要使用实体名。
注意: 实体名称对大小写敏感。
字符 | 名称 | 实体名 |
---|---|---|
¥ | 人民币符号:元 | ¥ |
© | 版权 | © |
® | 注册商标 | ® |
™ | 商标TM | ™ |
· | 间隔符号 | · |
" | 双引号 | " |
& | &符 | & |
< | 左尖括号(小于号) | < |
> | 右尖括号(大于号) | > |
半角空格 | | |
× | 乘号 | × |
÷ | 除号 | ÷ |
10、标签一定要正确嵌套,标签一定要闭合。
11、用div等标签布局;表格型数据,table首选。
12、代码风格采用树形结构,提高可读性;避免冗余嵌套。
13、模块之间必须保持独立,区块化布局,方便随意增删改,多人协作维护。
下面给出html模版:
<!DOCTYPE HTML>
<html>
<head>
<metacharset="utf-8">
<metaname="renderer"content="webkit|ie-comp|ie-stand">
<metahttp-equiv="X-UA-Compatible"content="IE=edge"/>
<metaname="viewport"content="width=device-width,initial-scale=1,user-scalable=no"/>
<title>网站标题,控制在25个字、50个字节以内</title>
<metaname="keywords"content="关键词,5个左右,单个8汉字以内">
<metaname="description"content="网站描述,字数尽量空制在80个汉字,160个字符以内!">
<linkrel="Bookmark"href="favicon.ico">
<linkrel="Shortcut Icon"href="favicon.ico"/>
<!--[if lt IE 9]>
<script type="text/javascript" src="Lib/html5.js"></script>
<script type="text/javascript" src="Lib/respond.min.js"></script>
<script type="text/javascript" src="Lib/PIE_IE678.js"></script>
<![endif]-->
<linkhref="style.css"rel="stylesheet"type="text/css"/><!--自己的样式-->
<!--[if IE 6]>
<script type="text/javascript" src="Lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('.pngfix,.icon');</script>
<![endif]-->
</head>
<body>
<header>网站头部</header>
<div>内容部分</div>
<footer>页脚</footer>
<scripttype="text/javascript"src="lib/jquery.min.js"></script>
</body>
</html>
【03】Html书写规范的更多相关文章
- oracle过程书写规范
ORACLE存储过程编码规范 1.1 变量规范 Ø 变量名全部采用小写,局部变量名使用“v_”开头,输入参数以“i_开头,输出参数以“o_”开头,输入输出参数用io_开头 ...
- CSS书写规范、命名规范、网易CSS框架NEC
网易CSS框架NEC:http://nec.netease.com/ NEC框架的CSS规范: CSS规范 - 分类方法 CSS规范 - 命名规则 CSS规范 - 代码格式 CSS规范 - 优化方案 ...
- html和css书写规范
HTML 规范 分离的标记.样式和脚本 结构.表现.行为分离 在可能情况下验证你的标记 使用编辑器验证你的标记是否正确,一般编辑器都自带有这个功能. 技术不支持的时候使用备胎,如canvas 编码格式 ...
- 数据库DDL语句书写规范
数据库DDL语句书写规范 1.SQL语句编写说明编写SQL语句应遵循统一的规范,包括大小写.空格.换行.缩进等等,只有完全一样的SQL才能在数据库中共享,从而减少硬解析. 字段类型.长度:根据数据情况 ...
- CSS书写规范
一.CSS书写顺序 1.位置属性(position,top,right,z-index,display,float等) 2.大小(width,height,padding,margin) 3.文字系列 ...
- 推荐大家使用的CSS书写规范、顺序
写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经 ...
- 分享给大家的CSS书写规范、顺序
写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经 ...
- css命名书写规范小结。
单行形式书写风格的排版约束 1. 每一条规则的大括号 { 前后加空格 2. 多个selector共用一个样式集,则多个selector必须写成多行形式 3. 每一条规则结束的大括号 } 前 ...
- CSS书写规范及顺序
CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3. ...
随机推荐
- _bzoj1087 [SCOI2005]互不侵犯King【dp】
传送门:http://www.lydsy.com/JudgeOnline/problem.php?id=1087 令f(i, j, k)表示前i列,二进制状态为j,已经用了k个国王的方案数,则 f(i ...
- [USACO 2011 Nov Gold] Cow Steeplechase【二分图】
传送门:http://www.usaco.org/index.php?page=viewproblem2&cpid=93 很容易发现,这是一个二分图的模型.竖直线是X集,水平线是Y集,若某条竖 ...
- MyEclipse配置Tomcat
1.在Window->Perferences->MyEclipse->Servers->Tomcat->Tomcat 7.x中启用Tomcat并配置Tomcat路径和JD ...
- 421 Maximum XOR of Two Numbers in an Array 数组中两个数的最大异或值
给定一个非空数组,数组中元素为 a0, a1, a2, … , an-1,其中 0 ≤ ai < 231 .找到 ai 和aj 最大的异或 (XOR) 运算结果,其中0 ≤ i, j < ...
- Snort里如何将读取的包记录存到二进制tcpdump文件下(图文详解)
不多说,直接上干货! 如果网络速度很快,或者想使日志更加紧凑以便以后的分析,那么应该使用二进制的日志文件格式.如tcpdump格式或者pcap格式. 这里,我们不需指定本地网络了,因为所以的东西都被 ...
- windows8.1专业版 关闭ie11总是已停止工作
该问题通常原因: 1 系统重病毒: 2 系统和安装的软件不兼容导致. 解决方案: 1 杀毒更新至最新进行杀毒,仍未解决,重新安装系统: 2 目前身边人员多数属于该情况: 1 如安装了输入法.迅雷或其它 ...
- 外文翻译 《How we decide》赛场上的四分卫 第三节
本书导言翻译 本章第二节 1982年,一位名叫Elliot的病人走进了神经科学家Antonio Damasio的办公室.几个月之前,一个小的肿瘤在它的大脑中被切除,切除点与大脑额叶非常靠近.在手术之前 ...
- 构建微服务开发环境5————安装Node.js
[内容指引] 下载Node.js: Mac下安装Node.js: Windows下安装Node.js; 查看node和npm的版本. 一.下载Node.js 访问Node.js官网:https://n ...
- 6月份最新语言排行:Java,Python我更看好谁?
文章首发于终端研发部,转载,请标明原文链接 今天的主题是:探讨一下6月份语言排行还有我的最新展望! 最近,编程语言排行榜前几天发布更新了,在最新的TIOBE编程语言排行榜中,Java依旧位居第一,但前 ...
- 一个简单的Java代码生成工具—根据数据源自动生成bean、dao、mapper.xml、service、serviceImpl
目录结构 核心思想 通过properties文件获取数据源—>获取数据表的字段名称.字段类型等—>生成相应的bean实体类(po.model).dao接口(基本的增删改查).mapper. ...