background image

出学校的标志性建筑,体现了学校的人文理念和浓郁的文化氛围。各级栏目的标题图片用
Flash 制成,带有线性红白过渡的圆角矩形图案,以及灰白过渡的圆角矩形图案,用于分页
显示页面标题栏的设置。网站的文本内容主要是自己编辑或者是课本上基础知识的概要,少
数是网上下载的内容,要求就是篇幅简短、简明扼要。教学视频主要是自己使用多媒体网络
教室中的教师教学软件录制而成,这样录出的视觉效果清晰,便于学生观看。录像尽可能分
章分节,时间较短,步骤简单,便于学生模仿尝试。学生作品取自学生平时上交的作业,展
示时尽可能点明班级和作品特点。

 

  

3 网站的搭建 

  网站建设初期可以使用静态页面,这样能够更加快捷地观看显示效果。笔者使用的是
Dreamweaver cs3,这一款软件的特点就是可以随时切换设计视图和代码视图,编辑起来非
常方便。这对于对代码还处于盲区的初学者来说非常有用,可以一边看设计一边学代码。读
懂代码对于网页设计非常有利。如果一开始就直奔代码,很多人是会头痛,难以继续学下去
的。笔者先在

D 盘中建立一个名为 myweb 的网站,然后启动 Dreamweaver 进行新建网站,

建立了一个首页,三个文件夹分别是

images、web、org,分别用于存放图像素材、各分类网页

文件和源文件,当然可以根据需要建立音乐素材文件夹和视频素材文件夹,将素材分门别
类地加以保存更能有效地管理文件,查找起来会更加快捷。

 

  

4 网站的制作 

  首先制作的是首页文件,首页制作得好坏决定着网站整体功能的实现与否,决定着网
站的发展命运。笔者在网站首页的制作上花费了大量的精力。

 

  其次是网站的

top 页面,非常关键,从 logo 的设计制作、banner 的制作,以及二者的颜

色搭配,到

Flash 技巧的应用等,融入多人智慧的结晶。导航条的制作也是费尽一番心思,

最初使用

spry 菜单栏,总是出现一些显示上的问题,最后只好简单地换成直接的文本输入,

主要是因为根本就没有二级栏目,用不着分类设置了,毕竟是单科网站,没有必要那么花
哨。这样做丝毫没有影响到链接功能的实现,只要选中文本,在链接后输入网址或者是搜索
网页,就可以跳转到相应的页面上,也能够非常地快捷,修改也方便。

 

  接着开始设计

left 页面,在这个页面里,主要设计的是分栏目的内容,让读者对分栏

目有一个大致的了解。网页的主体部分也是网站主要内容的显示区域,在这里又划分成两部
分,一是放置正文的部分,二是几个二级栏目。正文部分对于网站的意图做了一下介绍,又
介绍了一下信息技术课学生应该注意的事项。右侧的分栏目中第一栏就是榜上有名栏目,在
这里应用了一个

jif 的图像,内容为抖动花瓣的花枝,随着花瓣的飘洒,上榜学生的名字徐

徐上升。在这里应用了

marquee 的特效功能,让学生的名字沐浴鲜花而冉冉升起,这样学生

的心底就会涌现出一种自豪感,内心就会充满激情和活力。动态显示的画面更会吸引学生的
目光,让学生感到新鲜好奇,有一种期待和等候,盼望着出现自己的名字。榜上有名的下面
是基础知识,列出初中阶段必须掌握的基础知识,以利于学生时时复习巩固增强印象。再下
一个栏目是常用软件,让学生对其应会的软件有一个整体的认识,以便于查漏补缺,看到
自己还有哪些不足,以明确努力方向。

 

  最后是网站的

bottom,在这里设计了一个 marquee,它引导着一个表格,表格中放置 7

幅校园风光的图片,当然这里也可以放置学生的图片作品或者摄影作品,这样做的话,更
能充分展示学生的个性和成绩,与学生产生更加亲密的感情。

 

    课 本 中 讲 的 是 用

Office 套 装 软 件 中 的 FrontPage 制 作 网 站 , 但 是 笔 者 认 为 还 是

Dreamweaver 更专业,实现的功能更多,虽说比较复杂,但更能激励学生探索其实用的功
能,制作出更加富有特色的网页。教师应富有探索精神,多尝试新的软件,以便应用于教学。