高中信息技术教学论文 Frontpage网页制作

用心 爱心 专心1 FrontpageFrontpage 网页制作网页制作 摘要 Frontpage 更以其功能强大 容易上手 界面亲切而著称 它采用所见即所得的 方式编辑网页 利用它可以轻松的组织 编辑网页并将其发布到指定的站点上 而且在发 布之后还能对更新情况进行监控以更新站点的内容 关键字 Frontpage 创建站点 新建页面 文字 超链接 现在流行的网页制作软件有很多 如 Macromedia 公司的 Dreamweaver 微软公司的 Frontp age 还有 Adobe Pagemill 3 0 制作多框架 表单和 Image map 图像的网页工具 Netsc ape 等等 其中 Frontpage 更以其功能强大 容易上手 界面亲切而著称 它采用所见即 所得的方式编辑网页 利用它可以轻松的组织 编辑网页并将其发布到指定的站点上 而 且在发布之后还能对更新情况进行监控以更新站点的内容 工具准备好了 可根据你的个人喜好来选择一些素材 如图片 喜欢的文章等 现在就让 我们从第一步的建立站点来踏上建造网上家园之旅 用 FRONTPAGE 创建站点是很容易的 首先 我们来看一下创建一个只包含一个网页的 站点 选择 文件 菜单的 新建 选项 单击 站点 命令 这时新建站点对话框就弹 出来了 在 指定新站点位置 文本框中输入新站点的位置 单击 只有一个网页的站点 图标 单击 确定 按钮 这就建立好站点了 我们现在来看一下新的站点里有什么 单击 视图 工具条的 文件夹 按钮 在文件夹列表里有一个网页文件 名字叫做 in dex htm 我们知道 每一个站点都要有一个主页 这个主页也是一个网页文件 浏览者 访问站点时首先进入的就是站点的主页 主页的名字在一般情况下就叫做 index htm 就是说我们新建只包含一个网页的站点时 FRONTPAGE 就自动为我们创建了站点的主页了 这个新建的站点主页时空的 我们可以向里面添加内容 在文件列表里除了主页之外 还有文件夹 新建站点时 FRONTPAGE 都会在站点所在 位置下新建两个文件夹 一个是 images 另一个是 private 我们在编辑站点时可 以在 image 文件夹里放置站点用到的图片 private 文件夹比较特殊 其中的文件 对浏览者来说是隐含的 我们可以把一些不想让浏览者看到的网页文件放在这个文件夹里 比如 我们可以在这个文件夹里存放注册用户的个人信息 尽管每一个站点都要有一个主页 不过创建站点时我们仍然可以从一个空站点开始 选择 文件 菜单的 新建 命令 单击 站点 选项 在 新建站点 对话框里 我们 可以选择 空站点 图标来创建一个空站点 新建站点 对话框中还有许多其他图标 这是 FRONTPAGE 提供的用来创建站点模板或向导 我们创建只有一个网页的站点或者创建 空站点 都是从头开始来创建一个站点 这就好像盖房子一样 首先画图纸 然而 有许 多的房子都具有相似的结构和用途 所以我们可以用一张图纸盖很多相似的房子 这样就 节省了许多工作 同样的 尽管站点的风格千差万别但是有许多站点的功能和结构都是一样的 如果我 们从头开始建立站点的话 就要做许多重复劳动 这时 我们就可以使用模板或向导来建 用心 爱心 专心2 立站点 模板和向导的作用就好像盖房子的图纸一样 我们不必每次建立站点时都从头开 始 我们单击 个人站点 图标 用它可以迅速创建一个个人站点 输入站点所在的位 置 单击 确定 按钮 这样我们刚就创建了个人站点 个人站点模板已经为我们规划好 了站点的目录和建立了相关的页面 现在我们点击一下 文件夹 按钮 双击 index ht m 图标 看 这就是我们的个人站点的主页 哎 好象有许多文字都不对 没关系 这些文字都是 可以改变的 现在写的是文字的用途 比如 主题 文字就是用来写网站标题的地方 我 们只要把它改为自己喜欢的标题就可以了 返回到 文件夹 模式 双击 photo htm 也 可以把风景图片换成自己的照片 只要在新建站点的基础上进一步修改就可以做出自己的 个人站点了 这不仅节省了许多力气 同时也给了初学者一个良好的出发点 那么模板和向导有什么区别呢 我们安装软件时 一步步的用对话框提示我们完成安 装过程的程序就是一个向导 在 FRONTPAGE 里 向导也是一种模板 不过它是一种特殊的 模板 它会以对话框的形式辅助你完成站点的创建过程 现在我们选择 文件 菜单的 新建 选项 单击 站点 命令 你看 FRONTPAGE 提供了两个向导 公司展示向导 讨论站点向导 使用起来都很方便 你有兴趣也可以利用向导建立一个站点 创建页面最简单的方法就是单击 FRONTPAGE 常用 工具栏的 新建 按钮 它的右方有 一个向下的小箭头 它是用来选择要新建什么 可以用 新建 按钮新建网页 站点 文 件夹和任务 默认状态下是新建网页 如果要新建网页 可以不用向下箭头键选择 而直接单击 新建 按钮 不过使用文件菜 单的 新建 命令来新建网页能够有更大的选择 单击文件菜单的 新建 命令 选择 新建网页 在 新建 对话框里 可以看到 FRONTPAGE 提供的许多网页模板 我们可以 用这些模板来建立相应的网页 在右下角的预览框里可以看到选中模板的外观 选择 两 栏正文 网页 这样就创建了一个新的分为两栏的网页了 然后点确定 使用模板可以不 用总是从空白网页开始编辑 这样就省力很多 网上几乎所以的网页都使用图片加以点缀 在网页中插入适当的图片 能够产生图文并茂 的效果 如果有一个图形 怎么把它放到网页上呢 首先要看你的图形是什么格式的 也就是它扩展名是什么 只有扩展名为 GIF 和 JPEG 的图形文件才能成为我们的页面的一部分 因为这两种图形格式不仅应用广泛 而且有利 于节省存贮空间 如果图形不是这种格式 使用了其它格式的图形文件 在保存网页时 FR ONTPAGE 会提示做格式转换 FRONTPAGE 可以自动进行格式转换 现在可我们看看怎么插入图形 选择 插入 菜单的 图片 命令 单击 来自文件 按钮 在默认情况下 FRONTPAGE 认为你要插入的图片总是放在你建立的站点的目录或它的子目 用心 爱心 专心3 录下的 可以说 站点就是一个目录 我们把编辑的许多网页文件放在同一个目录下 我们 称这个目录为站点的主目录 这些网页引用的图形一般也放在这个目录下 当然 我们也 可以在这个目录下建立其他的子目录 再把所有的图形放在子目录里 所以搜索下拉列表 只允许在主目录和主目录下的子目录进行选择 如果要插入的图片不在主目录下 在 选择文件 对话框中进行选择 选择好文件以 后 单击 确定 按钮 回到 图形 对话框 单击 确定 按钮 图形就插入了 现在 单击 常用 工具栏的 保存 按钮 在 另存为 对话框中输入新的 web 页文件的名字 单击 保存 按钮 出现了一个对话框 因为我们刚才插入的文件不在站点内 现在 FR ONTPAGE 要把它复制到站点内 可是使用什么名字 放在站点的哪个目录下呢 就要在这 设置了 单击 改变文件夹 按钮 另外这儿还在需要时对图形的格式进行转换 单击 位置 按钮 在默认情况下 图形被保存在站点的主目录下 现在我们选择 IMAGE 目录 单击 确定 按钮 回到 嵌入式文件 窗口 再单击 确定 这样 图形就保存在站 点内了 我们还可以从 INTERNET 上插入一个图形 选择 插入 菜单的 图片 命令 在 URL 栏 内输入图片的地址 单击 确定 按钮 由于是插入网上的图片 因此在插入图形以后 应该保存一下网页 使图形存到站点内 您可能说 我不会画画 插入图片容易 可是编辑图片就不容易了 没关系 FRONTPAG E 自己带有许多剪贴画 你可以把它们插入到自己的网页 选择 插入 菜单的 图片 命令 选择 剪贴画 你看 各种剪贴画都分类放好了 你可以自由地选择 不过 插入后别忘了保存网页 把剪贴画复制到站点目录下 一般我们插入的图形总是和文本在一起的 所以调整图形和文本的对齐方式很重要 在默 认情况下 图形自动与文本的底部对齐 这一个网页 由于默认的对齐效果 页面出现了 大量的空白 这时就要调整图形的对齐属性 在图形上单击鼠标右键 选择 图片属性 选择 外观 选项卡我们把对齐方式调整为 左对齐 使用图形可以使网页更加丰富 多彩 而且我们还可以用图形来建立超链接 使网页相互联系起来 怎么用图形来建立链 接呢 其实图形超链接只要在建立超链接时选择图形就可以了 首先选中超链接的图形 单击箭头图形 单击 常用 工具栏 超链接 按钮 选择主页文件 页面 1 htm 单 击 确定 按钮 在普通模式中 按住 CTRL 键 单击箭头图形 就跳到主页页面了 如果我们要在图片上加上文字 单击图形工具栏 文本 按钮 现在图形中就出现了一个 文本框 输入 计算机软件 按一下 Esc 键 取消文字编辑 就选中文字框了 调整文 本框到合适的位置 单击页面其他区域 文字就添加成功了 如果我要修改 单击一下要修改的文字 这时文字作为一个整体被选中了 再点一下文 字 这时文本框里有光标闪烁 你可以编辑文本了 重新输入 计算机硬件 在页面 其他区域单击 文字就修改完成了 怎样使文字更丰富 活泼呢 一个简单的方法就是使用 格式 工具栏 用心 爱心 专心4 字体设置 选上文字 打开格式工具栏的 字体 下拉列表框 在里面选择相应的字体就 可以了 如果浏览网页的人使用的计算机没有设置的字体 浏览器会用系统默认的字体代 替你设置的字体 不过 使用常用字体是一个好习惯 字号设置 在 格式 工具栏 字号 下拉列表框中选择相应字体就可以了 工具栏上的 B I U 图标的作用是 按下 B 按钮 被选中的文字就会变为粗体 按下 I 按钮 被选中的文字就会变为斜体 按下 u 按钮 被选中的文字就会带下画线 字的颜色 单击 格式 工具栏 字体颜色 按钮旁的向下箭头 选择适当的颜色 字的 颜色就改变了 还可以对字体进行一些其他设置 选择 格式 菜单的 字体 命令 在这里我们还可以 作进一步的设置 这里除了 格式 工具栏可以做的设置以外 还可以设置许多效果 字符间距 选项卡 它是用来设置文字的间距的 单击 间距 下拉列表 可以选择字 符的间距是普通 扩充还是紧缩的 选择扩充 这时预览框的文字间距就变大了 也可以 调整间距大小来改变间距 输入 10 文字的间距就更大了 定位 下拉列表 在 FRONTPAGE 中每一行都有一个底线 定位就是指文字相对于底线的 距离 也就是把文字上下移动 现在选择 上移 文字就向上移动了 预览框中的黑线 就是行的底线 设计好的页面 应该检查它在浏览器中是否显示正常 方法是 一般只要切换到预览模式就可以了 单击 预览 选项卡 在这个预览模式下的 显示和在浏览器中的显示是一样的 但这并不意味着我们就不必用浏览器来检查编辑的网 页了 因为即使是同一个页面 可能在不同的浏览器中显示会不太一样 比如在 INTERNET EXPLORER 中是这样显示的 但是在 NETSCAPE 中又是那样显示的 所以 我们要在自己的 机器上多装几个浏览器 用来检查网页的兼容性 那么为什么不用不同的浏览器来检查呢 选择 文件 菜单的 在浏览器中预览 选项 在浏览器列表框中选择不同的浏览器 以 INTERNET EXPLORER 5 0 为例 单击 确定 按钮 就可以看到新建页面在浏览器中的效果了 怎样才能自己做的网页相互联系起来呢 也就是说让别人点页面上的图形或文本就跳转到其 他页面呢 在网页里 我们把这种点击后会进行页面切换的网页界面元素叫超链接 先来看一下用文字来建立链接 首先创建一个指向站点内其他网页的超链接 选择 插入 菜单的 超链接 命令 在文件列表框内选择 页面 1 htm 文件 注意在 U RL 文本框中显示了该文件的地址 单击 确定 按钮 超链接就制作成功了 我们切换到 预览模式 单击预览按钮 当我们把鼠标指向 主页 两字时鼠标变成手形 单击它 用心 爱心 专心5 我们就切换到主页了 那么为什么不在普通模式下试呢 因为普通模式主要是用来编辑网页的 当我们在 普通模式把鼠标指向 主页 两字时鼠标没有变成小手状 因此不能进行页面切换 不过 如果按住 CTRL 键 鼠标就变成了小手状 这时单击就可以进行切换了 也就是说在普通模 式中按住 CTRL 键才能激活超链接 我们也可以将超链接指向其他站点的网页 选中作为超链接的文本 单击 常用 工 具栏的 超链接 按钮 这和选择插入菜单的超链接命令是一样的 在 创建超链接 对 话框里 在 URL 地址栏直接输入要连接的网页或网站的地址 如果不清楚要作超链接的地 址 只要单击 URL 地址框后面的放大镜就可以用浏览器在 INTERNET 上查找要链接的网页 FRONTPAGE 会自动记录你找到的地址 单击 确定 按钮就可以了 我们还可以改变已经 设置好的超链接 首先确认是普通模式 在要改变的超链接下单击鼠标右键 选择 超链 接属性 命