网页设计规范及脚本语言规范
|
提高网页设计制作效果,加快信息化建设工作,网页设计制作规范化是一项很重要的工作,以下网页设计制作规范以供大家参考。 一、运行环境 1 .网页制作软件平台: 网页制作可采用 D reamWeaver X.0/ FrontPage 98 (2000)/ FireWorks X.0 / HotDog X.0/ Office 97(2000) 等编辑软件,建议采用 DreamWeaver 4.0 以上版本。 2 .网络浏览软件: 浏览软件建议采用 Netscape, Internet Explorer 4.0 及以上版本。 3 .网页适用的屏幕大小: 制作网页时,显示器的分辨率设置可以为 800*600 或 1024×768 。 二、主页连接方式 1 .主页制作完成后,经部门领导审查同意后(信息安全性由信息提供部门负责),向公司业务及信息中心提出挂接申请。 2 .信息中心根据实际需求和可提供服务的能力,在主服务器上开设虚拟 WWW 目录。 3 .公司主页由技术总监负责统一管理,由网页设计制作中心统一维护,各页信息由信息部门定期提供。 4 .与公司有关主页的链接统一管理。 5 .由网页设计制作中心定期向用户通知网页连接情况。 三、制作主页的要求 1 .制作主页时,不要使用 ShareBorder ,此项功能和计数器由网页组来统一负责添加设置。 2 .网页制作允许使用 JAVASCRIPT 或 VBSCRIPT 语言, JAVA 、 CGI 、 PEEL 等设计工具。 3 .所有的图片最好都放置在 IMAGE 目录下,以便于管理和维护。 4 .指定专人负责主页的制作、维护,同时对信息的安全性、正确性和准确性进行负责。 5 .技术中心定期进行制作网页的技术培训。 另外,对于一个商业信息网站的总体的规范,也是相当重要,归纳为以下几点: 一 . 导航规范 * 每一个页面都出现的固定信息 二 . 网站框架 1. 网站介绍
* logo 及中英文标准字体 ( 包括应用范例 ) 四 . 网页制作技术要求 * 主要页面要写 其他 meta 标 记 样式表定义 客户端 Javascript 函数定义及初始化操作 补充: 2. 允许全文检索的页面,为了使 Internet 上的搜索引擎能够有效检索,在频道的首页的 html 的 之间应该加入 Keywords 和 Description 元标记,例如 :
. CSS 文件的格式样例代码 :
???这里尤其要注意的是 a:link a:visited a:hover a:actived 的排列顺序一定要严格照上面的样例代码,否则或多或少会出问题。另外我们规定重定义的最先,伪类其次,自定义最后,便于自己和他人阅读! ???为了保证不同浏览器上字号保持一致,字号建议用点数 pt 和像素 px 来定义, pt 一般使用中文宋体的 9pt 和 11pt , px 一般使用中文宋体 12px 和 14.7px 这是经过优化的字号,黑体字或者宋体字加粗时,一般选用 11pt 和 14.7px 的字号比较合适。 ???在写 |
缩进两个半角空格, | 中如果还有嵌套的表格, 而应该是这样的: ???这是因为浏览器认为换行相当于一个半角空格,以上不规范的写法相当于无意中增加一个半角空格,如果确实有必要增加一个半角空格,也应该这样写: ???属于同一个级别 的
| 处于同一行,不要换行, 如我们注意在源代码中不应有这样的代码: |
5. Width 和 height 的写法也有统一的规范,一般情况下只有一列的表格, width 写在
和 |
和 |
标记,注意,一般情况下,请不要省略
标记。 ?
8. 请不要在网页中连续出现多于一个 的 也尽量少使用全角空格(英文字符集下,全角空格会变成乱码),空白应该尽量使用 text-indent, padding, margin, hspace, vspace 以及透明的 gif 图片来实现。
9. 中英文混排时,我们尽可能的将英文和数字定义为 verdana 和 arial 两种字体。
10. 行距建议用百分比来定义,常用的两个行距的值是 line-height:120%/150%.?
11. 网站中的路径全部采用相对路径,一般链接到某一目录下的缺省文件的链接路径不必写全名,如我们不必这样: 而应该这样: ?
12 、嵌入图形文本的使用较大的字体,建议不要在图形中包括文本。
13 、“网页大小”定义为网页的所有文件大小的总和,包括 HTML 文件和所有的嵌入的对象。用户喜欢快的而不是新奇的站点。对于解调器用户,网页大小保持在 34K 以下为合适。
文 件 命 名 原 则 ?
1. 每一个目录中应该包含一个缺省的 html 文件,文件名统一用 index.htm?
2 . 件名称统一用小写的英文字母、数字和下划线的组合。
3. 命名原则的指导思想一是使得你自己和工作组的每一个成员能够方便的理解每一个文件的意义,二是当我们在文件夹中使用“按名称排例”的命令时,同一种大类的文件能够排列在一起,以便我们查找、修改、替换、计算负载量等等操作 。
4. 下面以“新闻”(包含“国内新闻”和“国际新闻”)这个栏目来说明 html 文件的命名原则
☆ 在根目录下开设 news 目 录
☆ 第一条缺省新闻取名 index.htm?
☆ 所有属于“国内新闻”的新闻依次取名为: china_1.htm, china_2.htm, …
☆ 所有属于“国际新闻”的新闻依次取名为: internation_1.htm, internation _2.htm, …
☆ 如果文件的数量是两位数,请将前九个文件命名为: china_01.htm, china_02.htm 以保证所有的文件能够在文件夹中正确排序。
5. 图片的命名原则遵循以下几条规范 :
☆ 名称分为头尾两两部分,用下划线隔开。
☆ 头部分表示此图片的大类性质,例如广告、标志、菜单、按钮等等 。
☆ 一般来说 :?
放置在页面顶部的广告、装饰图案等长方形的图片我们取名: banner?
标志性的图片我们取名为: logo?
在页面上位置不固定并且带有链接的小图片我们取名为 button?
在页面上某一个位置连续出现,性质相同的链接栏目的图片我们取名: menu?
装饰用的照片我们取名: pic?
不带链接表示标题的图片我们取名: title?
依照此原则类推。
☆ 尾部分用来表示图片的具体含义。
☆ 下面是几个样例,大家应该能够一眼看明白图片的意义:
banner_sohu.gif banner_sina.gif menu_aboutus.gif menu_job.gif title_news.gif logo_police.gif logo_national.gif pic_people.jpg pic_hill.jpg.
设计流程规范
<1> 、收集网站前期资料以及所需文档
网站策划人员先期分析网站的目的,并分析出网站的功能情况、定位以及初步栏目的规划描述。然后根据策划方案去收集相关资料
l 小组讨论开会 ----- 分析网站目的和功能情况 ------ 主要负责人签字 ------ 生效并打印文档
<2> 、将策划方案打印给小组成员人手一份,开始设计人员进行设计工作。
根据策划文档及网站设计规范,主要设计人员进行前期的首页设计。
l 小组负责人确定设计进程时间并派任务单 ------ 主要设计人员开始设计 ----- 递交审核 ------ 通过后主要负责人签字
<3> 、根据网站的模式和特点以及网站制作规范定制出最适当的标准样式
l 主要负责人与策划人员、主要网站制作人员定制标准样式 ---- 打印并小组成员人手一份
<4> 、设计人员进行二级页面设计工作
l 依照网站设计规范和标准样式 ------ 由小组负责人确定设计进程时间并派任务单 ----- 主要设计人员开始设计工作 ----- 递交审核 ----- 通过后主要负责人签字
<5> 、制作人员开始制作工作
l 依照网站设计规范和标准样式 ------ 由小组负责人确定制作进程时间并派任务单 ----- 主要制作人员开始内容建设工作 ----- 与程序方面配合人员协调工作 ------ 递交审核 ----- 通过后主要负责人签字
<6> 、程序开发阶段
l 所有工作人员开始与程序上的结合页面修改工作
<7> 、完成
网站策划人员把所有有关网站的备份文件以及原程序备份,并书写一份网站跟踪报告。说明此网站的建设工作的开始到结束所用资源人力以及执行情况。
<8> 、 QA 部门进行测试工作
注:
+ 主要负责人包括所有参与网站项目的负责人,每个负责人做到审核签字。
+ 所有工作人员进行工作时必须在规定的工作时间内完成工作,不能完成工作的有权承担一定的责任。
+ 在主要负责人通过后,任何人不得以理由修改页面设计工作,特殊情况除外。
+ 网站策划人员必须及时跟踪网站建设情况并记录下来。安排任务进程。
标签内。总之遵循一条原则:不出现多于一个的控制同一个单元格大小的 height 和 width, 保证任何一个 width 和 height 都是有效的,也就是你改动代码中任何一个 width 和 height 的数值,都应该在浏览器中看到变化。做到这一条不容易,需要较长时间的练习和思考。 一 般 原 则 ? |