青岛网站建设公司,青岛网站制作公司-奈薇建站网
建站咨询热线:0532-8878113113165158935 
知识普及 » 网页设计制作规范教程

网页设计制作规范教程

网页设计制作 2014-11-06 12:11发表
阅读次数 1732
  网页设计制作规范是指一个开发规范,也称是一个脚本的语言参数,本规范并不是一个一成不变的必须严格遵守的条文,特殊情况下要灵活运用,做一定的变通。但是,请大家千万不要随意更改规范。如果有任何问题,请及时与我联系,我会及时更改本规范的相关代码样例和文档。

   主要包含以下步骤:

   一、基 本 要 求

   1. 在网站根目录中开设images common temp 三个子目录,根据需要再开设media 子目录,images目录中放不同栏目的页面都要用到的公共图片,例如公司的标志、banner 条、菜单、按钮等等;common 子目录中放css、js,、php、include 等公共文件;temp 子目录放客户提供的各种文字图片等等原始资料;media 子目录中放flash, avi, quick time 等多媒体文件 。

  2. 在根目录中原则上应该按照首页的栏目结构,给每一个栏目开设一个目录,根据需要在每一个栏目的目录中开设一个images 和media 的子目录用以放置此栏目专有的图片和多媒体文件,如果这个栏目的内容特别多,又分出很多下级栏目,可以相应的再开设其他目录。

  3. temp 目录中的文件往往会比较多,建议以时间为名称开设目录,将客户陆续提供的资料归类整理。

  4. 除非有特殊情况,目录、文件的名称全部用小写英文字母、数字、下划线的组合,其中不得包含汉字、空格和特殊字符;目录的命名请尽量以英文为指导,不到万不得已不要以拼音作为目录名称,经验证明,用拼音命名的目录往往连一个月后的自己都看不懂

  二、一 般 原 则

  1. 在排布表格之前,请大家一定要好好思考一个最佳的方案,表格的嵌套尽量控制在三层以内,并且应该尽量避免 <colspan> <rowspan> 两个标记,经验表明,这两个标记会带来许多麻烦。

  2. 一个网页要尽量避免用整个一张大表格,所有的内容都嵌套在这个大表格之内,因为浏览器在解释页面的元素时,是以表格为单位逐一显示,如果一张网页是嵌套在一个大表格之内,那么很可能造成的后果就是,当浏览者敲入网址,他要先面对一片空白很长时间,然后所有的网页内容同时出现。如果必须这样做,请使用 <tbody>标记,以便能够使这个大表格分块显示。

  3. 排版中我们经常会遇到需要进行首行缩进的处理,不要使用   或者全角空格来达到效果,规范的做法是在样式表中定义 p { text-indent: 2em; } 然后给每一段加上 <p> 标记,注意,一般情况下,请不要省略 </p> 结束标记 。

  三、文 件 命 名 原 则

  1. 每一个目录中应该包含一个缺省的html 文件,文件名统一用index.htm

  2. 件名称统一用小写的英文字母、数字和下划线的组合。

  3. 命名原则的指导思想一是使得你自己和工作组的每一个成员能够方便的理解每一个文件的意义,二是当我们在文件夹中使用“按名称排例”的命令时,同一种大类的文件能够排列在一起,以便我们查找、修改、替换、计算负载量等等操作。

  4. 下面以“新闻”(包含“国内新闻”和“国际新闻”)这个栏目来说明html 文件的命名原则

  四、脚 本 编 写

  我们应该有一个脚本整体风格一致的概念,意思是一个月后和一个月前的你写的脚本风格保持一致,以及同一个工作组中不同的开发人员编写的脚本风格保持一致,因为我们不可能永远孤立的开发,你随时都有可能和三个月前的自己合作(你的客户要求改版),也经常要和工作室中不同的同事共同开发一个项目,还有可能被要求修改已经离职人员开发的脚本,当然你自己也有可能会扔下一个项目给后来的同事。

  1. Html 文件的通用模板:
  <html>
  <head>
  <title> 文档标题 </title>
  <meta http-equiv="content-type" content="text/html; charset=gb2312">
  <meta name="author" content="eastline">
  其他meta 标 记
  <link rel="stylesheet" type="text/css" href="style/style.css">
   样式表定义
   客户端Javascript 函数定义及初始化操作
  </head>
  <body bgcolor="#ffffff">
  … …
  </body>

  补充:
  为了保证网站能够与下一代的web 语言xml 标准兼容,所有的HTML 标签的属性都要用单引号或者双引号括起,即我们应该写 <a href=”url”> 而不 是 <a href=url>.

  2. 允许全文检索的页面,为了使Internet 上的搜索引擎能够有效检索,在频道的首页的html的<head></head>之间应该加入Keywords 和Description 元标记,例如 :
  <meta name=”keywords” content=”东方新干线,汽车,买车”>
  <meta name=”description” content=”东方新干劲线,全球中文汽车信息第一站”>

  3. CSS 文件的格式样例代码 :
  <style type="text/css">
  <!—
  p { text-indent: 2em; }
  body { font-family: "宋体"; font-size: 9pt; color: #000000; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px}
  table { font-family: "宋体"; font-size: 9pt; line-height: 20px; color: #000000}
  a:link { font-size: 9pt; color: #FFFFFF; text-decoration: none}
  a:visited { font-size: 9pt; color: #99FFFF; text-decoration: none}
  a:hover { font-size: 9pt; color: #FF9900; text-decoration: none}
  a:active { font-size: 9pt; color: #FF9900; text-decoration: none}
  a.1:link { font-size: 9pt; color: #3366cc; text-decoration: none}
  a.1:visited { font-size: 9pt; color: #3366cc; text-decoration: none}
  a.1:hover { font-size: 9pt; color: #FF9900; text-decoration: none}
  a.1:active { font-size: 9pt; color: #FF9922; text-decoration: none}
  .blue { font-family: "宋体"; font-size: 10.5pt; line-height: 20px; color: #0099FF; letter-spacing: 5em}
  -->
  </style>

  这里尤其要注意的是a:link a:visited a:hover a:actived 的排列顺序一定要严格照上面的样例代码,否则或多或少会出问题。另外我们规定重定义的最先,伪类其次,自定义最后,便于自己和他人阅读!

  为了保证不同浏览器上字号保持一致,字号建议用点数pt和像素px来定义,pt一般使用中文宋体的9pt和11pt,px一般使用中文宋体12px 和14.7px 这是经过优化的字号,黑体字或者宋体字加粗时,一般选用11pt和14.7px 的字号比较合适。

网页设计制作规范教程相关标签:企业网站制作网页设计网站建造做网站
相关热点推荐
设计网页页面内容要新颖
未来CEO必备十大IT
网站工作者必须掌握的技
怎样设置关键字才可以被
从网页设计开始
青岛网站制作成本大解密
网络营销,搜索引擎营销
奈薇建站网推出移站通为
微信小程序继续发力为开
网络信息安全
2016年各种微信推广
政府网站建设要按照“一
如何有效管理与交换友情
企业网站如何提高用户体
宣传企业形网站6大主意
交互设计模式——分页
如何做成一个好的网站设
网站改版时的顺序问题
2016年主流网页的设
中小企业如何策划电子商
青岛网站建设报价与费用
网络安全事件频发,全站
普及360浏览器的极速
制作网站该从哪怎样着手
增加反向链接的35个技
突破网站设计的最后一公
做好内外链的平衡度更利
网页设计中色彩搭配的内
网络推广:降低网站页面
高颜值的全屏导航网页设
论坛的发展与现状分析
那些即将在网页设计中被
网站SEO优化的最新趋
做网站到底是什么个概念
网站建设经验十条
动态设计在互联网时代的
如何做出一篇好的伪原创
新手建站——我们差的只
网站布局有讲究
真正成功的关键IP是坚
奈薇建站网青岛网站建设公司/青岛网站制作公司,专业提供"气质"型网站建设及精美网站制作服务,同时欢迎各地网站建设公司、网站制作公司代理我们的奈薇建站系统共同发展

热点地区:青岛网站建设价格 青岛即墨网站制作公司 开发区信息港 山东在线门户
  • 备案号
  • 鲁ICP备13010283号
建站咨询热线0532-88781131 15166683288 13963906391
版权所有© BangJianZhan.Com & Nev.Cn 青岛网站建设/网站制作公司
青岛雨后网络科技有限公司 - 青岛市市北区福州北路90号,景泰尚都6层
已经为您服务了
153个月 28