页面制作注意事项.doc

页面制作注意事项 V1.1 目 录 1. 引言 2 1.1. 编写目的 3 1.2. 适用的工作人员 3 1.3. 编写的范围 3 1.4. 适用的产品范围 3 2. 页面制作注意事项 4 2.1. 代码嵌套合理 4 2.2. 标签的语义化 4 2.3. 注释内容不能使用 “--” 4 2.4. 页面宽度的定义 4 2.4.1. 采用百分比设定页面宽度 4 2.4.2. 采用固定值设定页面宽度 5 2.5. 页面内容分部显示 5 2.6. 其它CSS文件的引入 6 2.7. 属性缩写的规则 6 2.8. Hack使用规则 6 2.9. DIV+CSS中常见问题 6 2.10. CSS文件压缩优化的方法 6 2.11. 站点文件的管理 7 2.12. Frame框架的使用 7 2.13. Templates模板的使用 7 2.14. Library库文件的使用 8 2.15. 超级连接定义 8 2.16. 图片的应用格式 9 2.17. 主题类的图片切割 10 2.18. 标题类的图片切割 10 2.19. 背景类图片切割 11 2.20. 图标类的图片切割 11 2.21. 圆角矩形类的图片切割 11 2.22. 渐变效果类的图片切割 12 2.23. Flash制作方法注意事项 12 2.24. 搜索引擎优化（SEO） 13 2.24.1. 站点外的SEO 13 2.24.2. 站点内的SEO 13 3. 意见反馈 14  引言 编写目的 适用的工作 本文档主要面对WEB页面制作人员页面设计，阅读本文档需要掌握相关基础知识： 掌握html4.0和Xhtml1.0相关标准和用法； 掌握css2.0相关标准和属性； 对script脚本的作用和用法有一定程度的了解。 的范围 本文档对。对于一些需要掌握的技术和技术知识本文不做详细描述，请阅读相关技术文档。 适用的产品范围 本文档适用于基于HTML页面的产品。 代码嵌套合理嵌套附件\附件：XHTML嵌套规则.doc”文档。 【示例内容】 div a href=”#”…../a /div 标签的语义化 每一个标签都有自己的语义，所以在定义内容时请正确使用。 【规则内容】使用语义化的标签来定义内容 【补充说明】如有不明的可以参阅“附件\附件：XHTML语义化标签.doc”文档。 【示例内容】 h1标题/h1、table表格/table、 ul无序列表序列表 注释内容不能使用 “--” “--” 【补充说明】无 【示例内容】 代码格式：!--Invalid and so is the classic separator below. -- 错误：!--Invalid -- and so is the classic separator below. -- 页面宽度的定义 采用百分比设定页面idth：100%； 采用固定值设定页面idth：1004px； 页面内容分部显示 不要把一个页面中的内容全部放在一个table或div等标签中。应该按内容分段排版。 【规则内容】页面内容要一部分一部分的显示，不要等一段时间再全部显示出来 【补充说明】无 【示例内容】 错误写法： div div class=”header”…./div div class=”content”…./div div class=”footer”…./div /div 正确写法： div class=”header”…./div div class=”content”…./div div class=”footer”…./div 其它CSS文件的引入 【规则内容】可以将多个CSS文件引入至一个CSS文件中。 【补充说明】代码格式：@import name.css； 【示例内容】无 属性缩写的规则 通过使用CSS缩写以及其他的一些简单技巧，可以在很大程度上减少样式表的大小，从而提高页面加载样式文件的速度，进一步提高网站运行速度。附件\附件：CSS常用缩写语法.doc”。 【示例内容】无 Hack使用规则 由于不同的浏览器，比如IE 6,IE7, Firefox等，对CSS的解析不一样，因此会导致生成的页面效果不一样，得不到我们所需要的页面效果这个针对不同的浏览器写不同的CSS code的过程，就叫CSS hack,也叫写CSS hack。CSS 代码。 【补充说明】有关CSSHack详细内容请参阅：“附件\附件：CSS Hack汇总.doc”。 【示例内容】无 DIV+CSS中常见问题 在制作过程中经常会遇到一些问题，我把其中所知的问题汇总一起，方便大家迅速查看，从而能更高效得解决问题，进一步提高工作效率。 【规则内容】汇总了一些DIV制作时常见问题及解决方案。 【补充说明】详细情况请参阅“