html静态页制作规范

《html静态页制作规范》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、HTML静态页制作规范一、总则21.1目的及效力21.2页面制作工作的原则2二、文件及文件夹22.1文件夹32.2图片文件32.3页面文件32.4样式表文件42.5JavaScript文件4三、代码规范43.1样式表43.2HTML代码5四、页面内容54.1页面布局54.2形象页、页头页尾64.3内容显示64.4表单74.4链接74.5英文字体74.6积极沟通8五、标准代码8附录一9按住CTRL并单击目录可直接定位一、总则1.1目的及效力1.制订本规范的目的是使静态页面制作工作标准化，便于阅读、理解和程序合成，实现流水化作业，以期提高代码质量、提升开发效率、减

2、少错误。2.页面制作人员必须严格遵守此规范。3.本规范应用于2015年9月1日以后制作的项目中，不溯及以往。4.本规范随时根据需要修订，请注意版本号的变化。当前为2.0版。1.2页面制作工作的原则1.页面制作人员应有手写代码的能力。2.页面制作必须在规定的时间内完成。3.页面制作必须按照合同规定完成，如使用table/div布局等。4.页面制作要遵循设计人员制作的效果标准，对设计效果有疑问的要和设计师协商明确，不得随意更改设计效果。页面制作完成后需检查是否与设计效果一致，然后提交设计师确认，确认完毕后安排程序制作。5.设计人员设计的所有页面效果都必须制作成静态

3、页面，不得缺漏。6.所有网站中需要用到的功能性页面都必须制作，不得缺漏。7.多语言版网站，所有语言版的页面都必须制作，不得缺漏。8.使用统一的样式表文件、统一的文件和文件夹命名，标准模块使用公司统一的静态代码。9.页面制作时使用的文字和图片资料尽量使用客户的真实信息。无法获得客户相关资料的，可以使用安徽安搜信息技术有限公司的相关资料代替。页面中严禁出现其他客户的名称、标志及联系方式等信息。10.页面制作必须要保证在多分辨率下的显示效果。11.页面制作必须要保证在多浏览器下的现实效果。至少保证在IE6.0，IE7.0，IE8.0，FireFox，360等常用浏览

4、器下的显示效果。12.页面制作时必须考虑到以后维护内容时可能出现的各种特殊情况，如：新闻或栏目名称标题较长、暂无内容或内容较少、页数较多、日期长短不一等。13.在不增加代码复杂度、不降低显示效果的情况下，应尽量缩减图片和页面尺寸。14.必须遵守互联网相关法律法规，如备案信息的处理、网页内容的健康等。二、文件及文件夹2.1文件夹1.静态页面制作完成后，所有的工作结果需放置在一个项目文件夹内。2.项目文件夹命名：中文拼音首字母_中文名，其中字母一律小写。1.图片文件、flash文件统一放置在images文件夹内，css样式表文件放在css文件夹内，js放在js文件

5、夹内。普通企业网站原则上不再分设子文件夹；对于复杂的门户型网站，根据需要将图片放在images文件夹的不同子文件夹内。所有测试图片均放于uploads文件夹。2.2图片文件1.图片文件的命名应清晰、明了，有明确含义。2.严禁使用中文字符、纯数字序列、汉语拼音、单个字母、含义不明确的缩写等命名图片。3.在保证图片质量的前提下，尽量减小图片的文件大小, 以减少加载时间。依据实际情况灵活使用jpg，gif，png格式，透明图片可以使用png。4.尽量避免使用半透明的png图片。5.图片命名要有规律，避免后来增补的图片直接更新会覆盖原有图片的情况。6.图片命名的一般原

6、则，【位置单词_功能单词_文件单词_数字.扩展名】常用单词有head、top、left、right、bottom、footer、banner、nav、title、menu、logo、pic、bg、btn、ico等等；对网页中后台可维护的图片，可以简单取用p1、p2、p3等名称。对不同文件中相同位置、相同功能的图片，名称应保持一致性，如：left_menu_about.jpg、left_menu_news.jpg、left_menu_contact.jpg；banner_about.jpg、banner_news.jpg；导航图片的替换图：默认状态为banner

7、01.jpg当前状态为banner1.jpg。7.运用css sprite技术集中小的背景图或图标， 减小页面http请求。2.3页面文件1.页面文件统一使用UTF-8编码保存，请在软件工具中做好设置。2.页面文件依据其内容和功能，尽量使用标准文件名。没有标准文件名的，可取用含义贴切的英文单词，或取用页面效果的文件名。严禁使用中文或拼音命名文件。注意除news外，其他英文单词结尾一般不加s，如使用product.html，不使用products.html。3.页面文件使用html为后缀名。4.形象页：default.html5.首页：index.html6.关

8、于我们、公司介绍：about.html