第一篇:FrontPage制作简单网页(高二公开课教案)(本站推荐)
FrontPage制作简单网页
(高二信息技术公开课教学教案)
[ 教学目的 ]
了解网站的基本结构、构建网站的步骤,掌握用FrontPage制作简单网页 [ 教学重点 ]
网站规划、在网页中输入文字,插入图片和表格 [ 教学难点 ]
在网页中输入文字,插入图片和表格 [ 教学形式 ] 演示与练习穿插进行 [ 教学过程 ] [导入新课]
大家都很喜欢上网,因为网上有许多东西(学习资料、游戏、软件、音乐……)可供我们选择,而且许多都是免费的。这就是网络的一个很重要的特点――资源共享。这些资源都是放在一个一个网站中的。我们也可以构建一个网站,把你的珍藏整理好放上去。这样别人就可以分享你的东西。目前,在网上就有许多有名的个人网站,像华军软件、电脑之家、驱动之家、九天音乐等。[讲授新课]
要想在网上安家落户,大体上有以下三步:网站规划、网页制作和上传以布。今天我们就先来学习网站规划和简单网页的制作。
一、网站规划
(在制作网页之前要先建站,如果没有事先的准备及策划,只盲目的开始编辑网页,将要花更多的时间和精力在网站的整合上。所以要养成先建站再织网的好习惯)
1. 确定网站的主题
2. 网站要包含哪些咨训与服务 3. 构思每个网页的草图 4. 确定网页与网页之间的链接
演示:
1、用FrontPage中的导航来更直观地了解网站结构;
2、用FrontPage新建一个站点;
(1)打开FrontPage,选择“文件”->“新建”->“站点”;(2)单击“只有一个网页的站点”
注:在“文件夹列表”中显示该站点中所有的文件夹和文件。(一般新建站点后就有两个文件夹,我们一般将网站所需的图片放在“image”文件夹中,当然你也可以根据需要新建一些文件夹,但必须在一个站点中)练习:
1. 自己构建一个个人网站;
2. 新建个人网站(当然此时的个人网站还只是和个空白网页)二.制作网页“自我简介”(先展示一下做好的“自我简介”)
(一)在网页中输入文字和插入表格
1. 在网页中编辑工作区输入文字“自我简介”,居中;
2. 选中文字“自我简介”,选择“楷体_GB2312”,字号为“6(24)磅”,粉红色); 3. 选择“插入”->“换行符”,在弹出的“换行符属性”对话框中选择“普通换行符”,单击“确定”,光标移到下一行; 4. 单击“常用”工具栏上的“插入文件中的图片”按钮,弹出“图片”对话框; 5. 单击“剪贴画”按钮,在“比喻”类别中选择一幅图片,将此图片插入网页中; 6. 调整图片的大小,居中放置;
7. 选择“格式”->“背景”命令在网页中加入背景图片; 8. 单击“网页编辑区”下方的“预览”标签,可以预览网页的效果。
(二)制作“自我简历表”
网页中仅有一个标题和一幅图片,内容太少,下面插入一个表格 1. 单击“常用”工具栏上的“插入表格”按钮,制作一个6行2列的表格; 2. 在第一行第二列中,将单元格拆分成3列; 3. 输入“自我简历表”中的文字;
4. 选中第一、三列,将字体设为“黑体”,字号为“4(14)磅”,字型为“粗体”,选中第二、四列,将字体设为“楷体”,字号为“4(14)磅”,选中这个表格,单击“居中”按钮,选中第二、四、六行,设置颜色为“浅绿色”;选中这个表格,单击右键,选择“表格属性”命令,选择边框颜色为“粉红色”,粗细为1;单击确定。注:
1、格的边框粗细设为0,则表格不显示边框。(我们可以利用这一特点来合理安排网页的版面设置,书上163页图7.14的混合排版效果就是一例
2、“文件夹列表”中,双击某一网页,该网页就会显示在网页编辑区中,练习:
1. 在刚刚新建的站点上新建几个网页;
2. 在编辑网页时,学会使用表格来对网页进行排版。三.小结
展示和评讲学生作品
第二篇:frontpage网页制作教案
Frontpage网页制作导学案
青州一中
刘志韩
文件——新建——网页 【学习目标】
1、包括网页制作基础知识
2、站点的规划和创建
3、网页文本和图片的处理、表格和框架的应用 【学习重难点】
1、建立一个主题网站
2、建设一个网站的步骤
3、网页的美化与特效的制作 【课前预习】
思考一下多媒体信息集成的方式有哪些?
【自主学习】
1、在www中,________是信息的主要组织和表现形式。
2、用________语言编写的网页实际上是一种文本文件,以.HTML或者.HTM为扩展名,可以使用任何文本处理软件(如记事本、word等)创作或修改。
3、制作网页常用的软件有_________________和_________________。
4、网页文件的扩展名有哪些?
5、网站开发的基本过程:
网站的规划——()——()——网站的发布与管理——网站的评价 【合作探究与指导】
三、网站的制作
1、创建站点
文件——新建——站点(选择或创建存储站点的文件夹)
2、网页的创建与编辑
3、插入对象 水平线 图片 字幕 悬停按钮
4、创建超级链接
在对象上右击选择超级链接——选择链接的目标。
5、使用表格
表格——插入(在制作网页的过程中用表格来布局网页)
6、在站点中查看网页的编辑及网页之间的链接情况。
分步骤操作练习题:
1、新建一个站点,只有一个空白网页的站点。
2、在首页上插入“我最喜爱的明星”,然后进行修饰。
3、再新建一个空白网页。重新命名为“周杰伦”。
4、插入图片“周杰伦”,文本“周杰伦”,排版设置后保存网页。
5、再建立一张空白的网页,重新命名为“刘亦菲”。
6、插入图片“刘亦菲”,文本“刘亦菲”,排版设置后保存网页。
7、分别在首页和“周杰伦”“刘亦菲”网页建立超级链接。操作练习: 【拓展任务】
以环保为主题,利用文件夹“环保”中的素材,制作一个5页的网站。
【当堂检测】
1.在网页制作中,我们经常用下列()办法进行页面布局。
A.文字
B.表格
C.表单
D.图片 2.使用浏览器访问网站时,第一个被访问的网页称为()。
A.网页
B.网站
C.HTML语言
D.主页 3.网页中可使我们进行选择性浏览的称为()。
A.文字
B.图片
C.声音
D.超链接
4.在FrontPage2000中,要建立同一个网页内的链接点,让你点选某一链接后,迅速跳到同一网页内的另一个特定位置,应采用()链接。
A.单元格
B.表单
C.书签
D.表格 5.FrontPage 2000中,下述关于图片与链接的关系表述正确的是()。
A.图片不能建立链接
B.一张图片只能建立一个链接
C.图片要建立链接需经过处理
D.通过设置热区,一张图片可建立多个链接 6.在FrontPage 2000“网页”视图模式下,单击“普通”标签后,在出现的“普通”窗口中,可直接进行()。
A.网页编排
B.观察网页在浏览器中的效果
C.编辑HTML代码
D.下载图片 7.网页制作的超文本标记语言称为()。
A.VB语言
B.HTML语言
C.BASIC语言
D.ASCII 8.在Frontpage2000网页视图方式下,单击()标签可直接编辑HTML代码?
A.普通
B.HTML
C.预览
D.编辑 9.在FrontPage 2000中,我们想要文字左右交替移动的效果,是下列()效果。
A.字体
B.DHTML效果
C.字幕
D.悬停按钮 10.在FrontPage 2000表格单元格中,()项目不能输入。
A.表格
B.图形
C.背景
D.声音
作业:以我们寒假生活为主题,从互联网上搜索的素材制作一个网站。
【阅读材料】
网站设计
建立一个网站就像盖一幢大楼一样,它是一个系统工程,有自己特定的工作流程,你只有遵循这个步骤,按部就班地一步步来,才能设计出一个满意的网站。
一、确定网站主题
网站主题就是你建立的网站所要包含的主要内容,一个网站必须要有一个明确的主题。特别是对于个人网站,必须要找准一个自己最感兴趣内容,做深、做透,办出自己的特色,这样才能给用户留下深刻的印象。
二、搜集材料
明确了网站的主题以后,你就要围绕主题开始搜集材料了。常言道:“巧妇难为无米之炊”。要想让自己的网站有血有肉,能够吸引住用户,你就要尽量搜集材料,搜集得材料越多,以后制作网站就越容易。材料既可以从图书、报纸、光盘、多媒体上得来,也可以从互联网上搜集,然后把搜集的材料去粗取精,去伪存真,作为自己制作网页的素材。
三、规划网站
网站设计得成功与否,很大程度上决定于设计者的规划水平,规划网站就像设计师设计大楼一样,图纸设计好了,才能建成一座漂亮的楼房。网站规划包含的内容很多,如网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等,你只有在制作网页之前把这些方面都考虑到了,才能在制作时驾轻就熟,胸有成竹。
四、选择合适的制作工具
网页制作涉及的工具比较多,首先就是网页制作工具了,目前大多数网民选用的都是所见即所得的编辑工具,这其中的优秀者当然是Dreamweaver和Frontpage了,如果是初学者,Frontpage2000是首选。除此之外,还有图片编辑工具,如Photoshop、Photoimpact等;动画制作工具,如Flash、Cool 3d、Gif Animator等;还有网页特效工具,如有声有色等,五、制作网页
材料有了,工具也选好了,下面就需要按照规划一步步地把自己的想法变成现实了,这是一个复杂而细致的过程,一定要按照先大后小、先简单后复杂来进行制作。
六、上传测试
网页制作完毕,最后要发布到Web服务器上,才能够让全世界的朋友观看,利用这些FTP工具,你可以很方便地把网站发布到自己申请的主页存放服务器上。网站上传以后,你要在浏览器中打开自己的网站,逐页逐个链接的进行测试,发现问题,及时修改,然后再上传测试。
七、推广宣传
网页做好之后,还要不断地进行宣传,这样才能让更多的朋友认识它,提高网站的访问率和知名度。推广的方法有很多,例如到搜索引擎上注册、与别的网站交换链接、加入广告链等。
八、维护更新
第三篇:《网页制作FrontPage》教案
《网页制作FrontPage》教案
教师:张爱平
第1、2课时 网页设计概述
【教学内容】
讲解网页设计的相关术语及网站制作的基本流程。【教学目的】
使学生对网站及网页有一定的认识,激发学生学习网页设计的兴趣。【教学重点】
网页设计中的若干术语。【教学难点】
理解网页设计中的若干术语。【教学方式】
讲授式、讨论式、案例分析式。【教学参考】
1、《网页设计与制作》杨尚森 曲宏山 贾文峰等著 电子工业出版社。
2、《Internet 网页工场》Wittime工作室 重庆出版社。
3、《WEB网站设计》Joel Sklar著 高等教育出版社。
4、《HTML网页制作教程》材义语编著 铁道出版社。【新课内容】 1.1 中超级链接标志的难点。
第7、8课时HTML表格、表单与框架标志
【教学内容】
讲解HTML中制作表格、表单与框架的标志。【教学目的】
使学生掌握简单表格、表单与框架的制作。【教学重点】
* 表格中单元格的合并以及表格嵌套和叠加操作。* 框架的嵌套使用。* 表单元素标志与属性。【教学难点】
* 理解表格属性rowspan与colspan的含义以及表格嵌套实现的基本思想。
* 理解框架属性name、target的意义。* 理解表单中相应元素对应标志及属性的含义。【教学方式】 案例分析式、项目教学 【教学参考】
1、《网页设计与制作》杨尚森 曲宏山 贾文峰等著 电子工业出版社。
2、《WEB网站设计》Joel Sklar著 高等教育出版社。
3、《HTML网页制作教程》材义语编著 铁道出版社。【新课内容】 2.5 插入表格
2.5.1在网页中插入表格
表格的基本构成元素:表头,单元格,列,行
第一行第一列 | 第一行第二列 |
第二行第一列 | 第二行第二列 |
表单在Web网页中用来给访问者填写信息,从而能获得用户信息,使网页具有交互的功能。2.6.1创建表单
2.6.2用定义用户交互(1)单行文本输入区(2)密码输入区(3)单选框(4)复选框(5)隐藏区域(6)按钮
2.6.3定义下拉式菜单
你选修的课程:
2.6.4定义多行文字输入区域 请输入你的详细介绍:
2.7 框架窗口
框架把窗口划分成几个子窗口,各个子窗口可以调入各自的HTML文档,最后形成充满整个窗口的网页。2.7.1框架的定义 2.7.2框架属性设置