[图文][分享]详解制作模板的步骤

作者:凤凰涅磐 来源:动易论坛 点击数: 发布时间:2005年04月08日


详解制作模板的步骤

  很多朋友在QQ、论坛和我站上问我是如何制作模板,考虑一下,写一个教程统一说一下吧,不会写教程,写的不好,但尽量使大家都能看的明白。
  以下是以我制做“动易V4.03”核心模板的过程,当然遵循这个思路,同样适用用其他网站核心的模板制做和自己建设网站。
1、 首先确定制做站点的类型(废话~),然后根据制做站点的类型进行选用素材和配色的思考。
2、 在制做站点前需要对这个核心相对要了解一些,比如“动易V4.03”核心的函数排列的行距是24px(象素);JS调用的行距有两个尺寸(1)普通列表式的行距19px(2)表格式的行距是24px。个人认为:在制做模板前这些都是需要知道和了解的,原因继续向下看…………….
3、 在了解了核心的结构以后,需要你对站点的安排了。比如:首页是否需要公告、需要安排多少个频道,而且每一个频道需要调用几个标题,在首页需要调用哪些频道的内容出来,这些都是需要一个良好的思路。如果记不住的话,拿笔把它写下来吧。
4、 准备的工作都做完了吗?呵呵,我们现在进入下一步,这一步也是最重要的一步了―――――制图。制图的工具有很多,比如“Fireworks”、“Photoshop”、“Illustrator”,在这里需要讲一下的是“Illustrator”,这个工具是“Adobo”公司出品的矢量工具,主要是为了处理网站Banner和Icon用的(我只是使用这个工具修改,不会手绘(汗~~)―――群众大呼“砍死…”),但最多使用的是“Photoshop”工具。好啦,开始制图吧。根据你需要的调用和安排绘制网站的页面。当然,很重要的一点,制图的时候所有的尺寸都是经过计算的(见第二步)。
比如:会员登陆需要高150PX左右,那么加上顶部标签就要180px
      最新文章频道如果调用6个组新标题的话,那么就是24*6=144px,做150PX高   肯定够。
同时您还需要一些html的知识,知道在那里需要做表格的拆分,这样才能按照您设计的模板达到最快的访问效果。
下面以“模板263”第五版为例:
这个页面采用的是左右两列式的排列,拆分的位置如下:
在会员登陆做一个拆分;
然后下一个本站资源再做一个拆分;
然后是成功案例一个;
推荐文章、站内统计友情连接是一个拆分;
网站联盟是一个拆分;
页脚一个拆分;这些所有的拆分都是横向的拆分。



5、 效果图画好以后,准备开始排版。有一些朋友喜欢在做网站之前,就把效果图做切图,然后排版,我个人的方法是根据需要,一块一块的裁。无论那种方法,适合自己就可以了。现在我们进入Dreamweaver进行排版。
比如:banner位置的左右是采用图片的形式,而banner背景的蓝色采用背景颜色。该采用背景的位置就采用背景,该使用图片的位置就使用图片。然后在你调用的位置填入调用的函数或代码就可以了。
6、 其他的就都是一些表格的排版了,这里就不再多说了。大家可以去看一些Dreamweaver表格应用的书籍和帖子。但记住一点的是,表格尽量嵌套要少,表格嵌套多的网页打开速度同样是慢的。

自此。模板的制做过程基本完成。如果还有什么问题,请各位朋友提出来,我继续补充。教程写的不好,请各位朋友指正。

                               模板263  凤凰涅磐