admin 管理员组文章数量: 1086019
2024年5月8日发(作者：在线登录页面免费下载)
ＣＥＴＥ技术在线
１０．３９６９－
静态网站建
／ｊ．ｉ ｓｓｒ１．１６７１—４８９Ｘ．２０１３
．设初 ０５．０６３ 探
■何洪刚
网站建设是初中信息技术教学的重点内容，也是当今
社会各行各业走向网络化的一种主要的途径。从网站的设
计构思、网站素材的制作与收集、网站制作中的关键步骤
等几方面介绍静态网站的初步搭建。
在社会逐渐迈向现代化的同时，各行各业也纷 它直接或者间接地展示给读者。其他的网页都是通
纷为展现自我，而融入互联网大家庭之中。方式之 过链接主页，从而实现分层次地展现内容。设计者
一
就是纷纷建立自己的网站，并在网站上充分地利 首先要规划出一张设计草图，并清晰地标明主页的
用各种方式展现自我特色和优势，与其他同行、广 布局，如网站的ｌｏｇｏ、ｂａｎｎｅｒ和导航条，网站的分
大网友进行交流。在教育领域，各个学校也纷纷建 栏目和主要表达的信息，网站的主体内容等。另外
立了自己的网站。通过网站收集教学资源，发布重 要预留出网站的注册和登录入口、网站的管理入口，
要通知公告，展现学校的风采。在网站中，专门设 这些都非常关键，因为只有通过这些入口才能达到
立了教师博客和教师论坛，以彰显教师个性，剖析
对网站的有效管理，比如说网站各导航详细页面内
教育现象。各个班级也纷纷建立了自己的主页，专
容的添加、修改和删除。
门介绍本班的风貌，展现学生的创作。因此说，网
笔者在设计初中信息技术网站的时候是这样设
站的搭建和制作也成为人们交流的话题和信息技术 想的：要向学生全面展示信息技术学科的知识和技
教学重要的一部分内容。 能，同时与学生的自学形成良好的互动状态。网站
笔者通过制作学科网站的经验，与大家交流一
要适合不同学生的自主学习和独立创新，要对学生
下网站制作过程中的重要环节及注意事项。笔者是
的每一份精彩成果予以展示，表现出色的学生要在
一
名新手，网站制作只是处于尝试阶段，本文中提
醒目的地方给予表彰，让学生在体验收获中不断地
到的观点可能不太客观，或许存在很大的漏洞，望 演绎他们精彩的人生。这些对学生大张旗鼓地肯定
各位网站制作高手加以点拨。 与鼓励，可以让他们充分体验生命中的每一分辉煌，
１网站的设计与构思
让他们对前途充满希望和幻想。因此，笔者专门设
网站的设计非常关键。在制作网站之前，设计
计了这样几个导航内容：基础知识（让学生对信息
者头脑中要有一个清晰的目标，就是你制作的网站 知识有一个整体的概念）、常用软件（初中生必须
是要向谁传递什么样的信息，最终目的是为了实现
学会的几种应软件，如Ｗｏｒｄ、Ｅｘｃｅｌ等）、教学视频（教
什么。将读者和目标确定好之后，就要想如何将自
师课堂教学演示，方便学生模仿学习，尤其适合上
己的想法准确地传递出去，达到与读者的无障碍沟 课领悟慢的学生的学习，通过反复观看教师演示以
通。你的每一种想法都要有一种载体相承托，你想 达到真正地掌握软件的使用技巧）、信息题库（检
法的每一步就构成了不同的网页主题。这就是网站 测学生对于基础知识和应用技能的掌握程度）、信
的流程图，流程图的每一步都要环环相扣、相互转 息论坛（通过学生交流学习常用软件的体会，以达
化，每一步都要有明显的分工。构思好方案之后，
到精通掌握的目的，合作交流，共同进步）、榜上
就可以设计主页和分页了。主页非常关键，它就像
有名（贴出光荣榜，鼓励优秀学生，通过点击其姓名，
一
个人的整体形象，外貌不吸引人，就不会吸引多
进一步观看其作品，以达到吸取精华、互促互进的
少观众。主页就像一个窗口，所有的信息都是通过
目的）。
２０［３年２月中第０５期（总第２９９期）
中国教育技术装备
一
６３—
ＣＥＴＥ技术在线
２网站素材的收集与制作
为了更好地制作出版面新颖、富有本校特色的
网站，笔者用数码相机拍摄了大量的体现校园风光
的图片，精选出几幅图片，使用Ｐｈｏｔｏｓｈｏｐ加以修饰
么花哨。这样做丝毫没有影响到链接功
能的实现，只要选中文本，在链接后输
入网址或者是搜索网页，就可以跳转到
相应的页面上，也能够非常地快捷，修
改也方便。
与裁切，缩小成所需要的大小的图片，放在首页的
底部予以动态地展示。网站ｌｏｇｏ使用了学校的校徽
融入信息技术网站的特点设计而成。Ｂａｎｎｅｒ使用数
接着开始设计ｌｅｆｔ页面，在这个
页面里，主要设计的是分栏目的内容，
码相机连续拍摄了几张相片制成了一个全景图，中
间突出学校的标志性建筑，体现了学校的人文理念
让读者对分栏目有一个大致的了解。网
页的主体部分也是网站主要内容的显示
２０１３年２月中第０５期（总第２９９期）
中国教育技术装备
一
６４—
和浓郁的文化氛围。各级栏目的标题图片用Ｆｌａｓｈ制
成，带有线性红白过渡的圆角矩形图案，以及灰白
过渡的圆角矩形图案，用于分页显示页面标题栏的
设置。网站的文本内容主要是自己编辑或者是课本
上基础知识的概要，少数是网上下载的内容，要求
就是篇幅简短、简明扼要。教学视频主要是自己使
用多媒体网络教室中的教师教学软件录制而成，这
样录出的视觉效果清晰，便于学生观看。录像尽可
能分章分节，时问较短，步骤简单，便于学生模仿
尝试。学生作品取自学生平时上交的作业，展示时
尽可能点明班级和作品特点。
３网站的搭建
网站建设初期可以使用静态页面，这样能够更
加快捷地观看显示效果。笔者使用的是Ｄｒｅａｍｗｅａｖｅｒ
ｃｓ３，这一款软件的特点就是可以随时切换设计视图
和代码视图，编辑起来非常方便。这对于对代码还
处于盲区的初学者来说非常有用，可以一边看设计
一
边学代码。读懂代码对于网页设计非常有利。如
果一开始就直奔代码，很多人是会头痛，难以继续
学下去的。笔者先在Ｄ盘中建立一个名为ｍｙｗｅｂ的
网站，然后启动Ｄｒｅａｍｗｅａｖｅｒ进行新建网站，建立了
一
个首页，三个文件夹分别是ｉｍａｇｅｓ、ｗｅｂ、ｏｒｇ，
分别用于存放图像素材、各分类网页文件和源文件，
当然可以根据需要建立音乐素材文件夹和视频素材
文件夹，将素材分门别类地加以保存更能有效地管
理文件，查找起来会更加快捷。
４网站的制作
首先制作的是首页文件，首页制作得好坏决定
着网站整体功能的实现与否，决定着网站的发展命
运。笔者在网站首页的制作上花费了大量的精力。
其次是网站的ｔｏｐ页面，非常关键，从］ｏｇｏ的
设计制作、ｂａｎｎｅｒ的制作，以及二者的颜色搭配，
到Ｆｌａｓｈ技巧的应用等，融入多人智慧的结晶。导航
条的制作也是费尽一番心思，最初使用ｓｐｒｙ菜单栏，
总是出现一些显示上的问题，最后只好简单地换成
直接的文本输入，主要是因为根本就没有二级栏目，
用不着分类设置了，毕竟是单科网站，没有必要那
区域，在这里又划分成两部分，一是放
置正文的部分，，二是几个二级栏目．．正
文部分对于网站的意图做了一下介绍，
又介绍了一下信息技术课学生应该注意
的事项。右侧的分栏目中第一栏就是榜
上有名栏目，在这里应用了一个 ｊ｛ｆ的
图像，内容为抖动花瓣的花枝，随着花
瓣的飘洒，上榜学生的名字徐徐上升。
在这里应用了ｍａｒｑｕｅｅ的特效功能，让
学生的名字沐浴鲜花而冉冉升起，这样
学生的心底就会涌现出一种自豪感，内
心就会充满激情和活力。动态显示的画
面更会吸引学生的目光，让学生感到新
鲜好奇，有一种期待和等候，盼望着出
现自己的名字。榜上有名的下面是基础
知识，列出初中阶段必须掌握的基础知
识，以利于学生时时复习巩固增强印象。
再下一个栏目是常用软件，让学生对其
应会的软件有一个整体的认识，以便于
查漏补缺，看到自己还有哪些不足，以
明确努力方向。
最后是网站的ｂｏｔｔｏｍ，在这里设
计了一个ｍａｒｑｕｅｅ，它引导着一个表格，
表格中放置７幅校园风光的图片，当然
这里也可以放置学生的图片作品或者摄
影作品，这样做的话，更能充分展示学
生的个性和成绩，与学生产生更加亲密
的感情。
课本中讲的是用Ｏｆｆｉｃｅ套装软件
中的ＦｒｏｎｔＰａｇｅ制作网站，但是笔者认
为还是Ｄｒｅａｍｗｅａｖｅｒ更专业，实现的功
能更多，虽说比较复杂，但更能激励学
生探索其实用的功能，制作出更加富有
特色的网页。教师应富有探索精神，多
尝试新的软件，以便应用于教学。一
（作者单位：河北省唐山市丰润区
丰润镇中学）
版权声明：本文标题：静态网站建设初探 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://roclinux.cn/p/1715174126a686146.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论