任务一了解网站的基本结构.ppt

1,第二节网站建设,网络技术应用PPT电子讲义,2,新课引入,学习做网页之前，我们首先要知道网页是什么，一般来说网页是用在网络上的htm文件，通过网页可以很方便的实现网络资源的共享，上网分为三个步骤；1、输入正确的网址2、找超级链接3、后退按钮,3,1、输入正确的网址,1）在桌面上找到InternetExplorer，双击打开，出现浏览器窗口，一般会自动进入微软的网站；2）找到地址栏一个长白条，里面有一串以http打头的字符，这就是地址栏3）在地址栏里头点一下鼠标左键，然后删除里面的字符，输入自己的的网址，网址一般是英文的以http打头，然后是一个冒号和两个斜杠（双斜杠），然后是www（三W），后面跟一个点，最后一般是com结尾，例如输入输完检查一下，没问题就按一下回车键，这时窗口右上角的小图标就开始运动，也就是正在搜索；4)一切正常就会进入到搜狐网站的首页；,4,2、找超级链接,网页上的内容是一页一页的，一般都藏在一个叫超链接的后面，所以第二步就是要找到超链接；超链接有三个特点，首先文字的颜色是蓝色的，非常醒目，其次文字下面有一条下划线，便于查找，最关键的是当鼠标移过去以后，指针会变成手形，这一点很重要；找到超链接以后就可以鼠标左键单击，进入相应的内容了；,5,3、后退按钮,看完一页后如何返回呢？在窗口的左上角有一个后退按钮，点一下就可以回到上一页，这样就不会迷失方向了；其他还有浏览、下载、另存为等等也都是网络的功能；本节学习了上网的基础知识，学习了上网的三步曲，网址超链接和后退，那么接下来我们继续学习网页制作软件FrontPage2003。,6,本章学习目录,4.1FrontPage2003概述4.2网页基本元素编辑4.3网页布局4.4表单应用4.5网站发布及管理思考题,7,4.1FrontPage2003概述,4.1.1功能特点4.1.2窗口界面4.1.3基本操作,8,4.1.1功能特点,FrontPage让初学者无需掌握HTML语言或具备编程基础知识便能够编写出界面优美、功能完善的网站。下面简单介绍一下FrontPage的特点。“所见即所得”的网页编辑环境，也就是说，用户在网页编辑窗口中看到的效果就是浏览器中显示的效果。易学易用的操作界面，像其它Office套件一样，在FrontPage中集成了大量的网页模板和网站向导，让用户很方便快捷地制作出优美的网页。功能强大的新版本FrontPage融合了网页管理、网页编辑、网页发布和网站维护等多种功能，利用FrontPage制作的网页支持最新的网页标准，比如DHTML、XML、CSS2等等。,9,4.1.2窗口界面,FrontPage2003主界面主要由菜单栏、工具栏、视图栏、状态栏、主编辑窗口和任务窗格等6大部分组成。,10,1“网页”视图,选择【视图】【网页】命令，打开网页视图。网页视图是FrontPage中最常用的工作界面，网页的创建、编辑、预览等基本操作都是在此视图中进行的。网页视图窗口底部有4个标签：“设计”、“拆分”、“代码”和“预览”，它们分别控制着网页的4种显示模式。在设计模式下，能够以“所见即所得”的方式编辑网页；在代码模式下，可以查看或编辑网页的HTML的源代码；在预览模式下，可以预览网页的效果；在拆分模式下，能够同时编辑网页和查看或编辑网页的HTML的源代码。,11,1“网页”视图,12,2“文件夹”视图,单击“视图”栏中的“文件夹”图标或选择【视图】【文件夹】命令，打开文件夹视图。在文件夹视图下，网站显示为一组文件和文件夹。在此视图下可以对网站中的文件夹和各种文件进行管理。,13,3“报表”视图,单击“视图”栏中的“报表”图标或选择【视图】【报表】命令，打开报表视图。通过报表视图，可以在运行报表查询后分析网站内容。,14,4“导航”视图,单击“视图”栏中的“导航”图标或选择【视图】【导航】命令，打开导航视图。导航视图用于管理网站中各网页的层次关系结构图。可以通过鼠标将结构图中的网页拖到新位置来改变链接结构。,15,5“超链接”视图,单击“视图”栏中“超链接”图标或选择【视图】【超链接】命令。超链接视图用于管理网站中网页的超链接。,16,6“任务”视图,单击“视图”栏中的“任务”图标或选择【视图】【任务】命令，可打开任务视图。任务视图可以实现网站任务的管理。网站的任务是指网站管理人员维护网站的任务，包括网页的更新和网站的检查等。,17,7“远程网站”视图,可以使用“远程网站”视图发布整个网站，或有选择地发布个别文件。还可以在两个或多个位置之间同步文件，即确保包含相同内容的网站都包含最新的更改。,18,7.1.3基本操作,1网站的规划2网站的基本操作3网页的基本操作,19,1网站的规划,首先要明确建立网站的目的。其次要明确网站的浏览者群。最后要考虑到如何能够便于网站的日常维护。,20,2网站的基本操作,1)创建网站创建一个Web网站有两种方法。第一种方法是利用FrontPage的Web网站模板和向导，这种方法操作简单、速度快，比较适合建立大、中型的Web网站。第二种方法是逐个地创建网页文件，然后创建它们之间的链接关系，这种方法适合于网页数量不多的小型网站。使用FrontPage模板创建网站的步骤：启动FrontPage应用程序；选择【文件】【新建】命令，打开“新建”任务窗格；选择网站模板，在“新建网站”栏选择“由一个网页组成的网站”，打开“网站模板”对话框，在“指定新网站的位置”文本框中输入新网站的位置及名称，然后单击“确定”按钮。,21,2）关闭网站选择【文件】【关闭网站】命令。关闭网站即关闭网站及该网站下的所有网页。3）打开网站选择【文件】【打开网站】命令，“打开网站”对话框。选择网站名称，然后单击“打开”按钮。,2网站的基本操作,22,3网页的基本操作,1）新建网页在FrontPage2003中可以直接创建一个空白网页，也可以利用网页模板和网页向导来创建。在某网站中创建新网页，在此网站的文件夹视图和导航视图方式下单击视图窗口右上角的“新建网页”按钮。创建不属于某网站的新网页，在任何视图方式下，选择【文件】【新建】命令，打开“新建”任务窗格，可在新建任务窗格中，选择一种合适的模板新建网页；或者单击常用工具栏上的“新建”按钮。,23,2）打开网页打开当前网站中的网页，在任何视图中双击该网页图标或文件名即可打开网页。打开其它网站中的网页，选择【文件】【打开】命令，在“打开文件”对话框中选择具体网页文件打开。3）保存网页保存当前网站中的网页，单击工具栏中的保存按钮，或【文件】【保存】命令即可。如果网页中有图片，则会弹出“保存嵌入式文件”对话框，提示保存图片文件。保存不属于当前网站中的网页，则需要指定保存路径。4）关闭网页选择【文件】【关闭】命令。这种方式关闭的仅是当前网页，要注意与关闭网站的区别。,3网页的基本操作,24,1文本添加,在网页中添加文本与在Word中添加文本的操作基本相同。此外，在网页中输入文本时，如果已经达到网页边界，则文本会自动回滚到下一行继续输入，这种换行方式并不会产生新行或是一个新段落，随着网页边界的变化或是编辑窗口的调整，FrontPage2003会自动调整这个回滚位置。按下+键将产生新行，即换行，新行与上一行之间没有回滚关系。按下键产生一个新段落。,25,2设置段落和文本格式,可以使用格式工具栏（如图7.2.1所示）或“字体”和“段落”对话框对文本和段落的格式进行设置。其操作方法跟Word基本相同。,26,3插入水平线,为了修饰页面，明显区分开标题与正文，可选择【插入】【水平线】命令在当前光标点插入一条水平线。双击水平线或选择【格式】【属性】命令弹出“水平线属性”对话框，可对水平线的高度、宽度、颜色和对齐方式进行设置。,27,4设置网页属性,网页属性是一个网页整体的属性，记录关于网页的非页面部分的相关信息。适当的设置可以达到增加网页美观和缩减网页文件大小的效果。方法一：右击页面，从弹出的快捷菜单中选择“网页属性”命令。方法二：选择【格式】【背景】命令；方法三：选择【文件】【属性】命令；,28,5插入图像,插入一幅关于“背景”的剪贴画的操作步骤：将插入点定位在需要插入图片的位置；选择【插入】【图片】【剪贴画】命令，打开“剪贴画”任务窗格，如图所示；在任务窗格中，用户可在“搜索文字”文本框中输入剪贴画的关键字“背景”；单击“搜索”按钮开始搜索，在任务窗格下方列表框中列出了搜索到的剪贴画；单击剪贴画右侧的下三角按钮，弹出剪贴画的快捷菜单，单击“插入”命令即可。,29,编辑图像,在网页中插入图像后，还可对图像进行编辑。用鼠标单击选取图像，在屏幕上就会出现“图片”工具栏。利用“图片”工具栏可对图片进行旋转、剪裁、冲蚀，设置凹凸效果、透明背景色，调整亮度、对比度以及在图片中加入文字等。选中图片后，拖动图片周围的控点可改变图片大小。,30,设置图片属性,选定所需的图片，单击鼠标右键，从快捷菜单中选择“图片属性”命令，弹出“图片属性”对话框。在对话框的“常规”和“外观”两个选项卡中进行设置，可以做出各种图文混排的页面效果。,31,超链接是从一个网页指向另一个目的地的指针，这个目的地可以是另一个网页或同一个网页中的其他位置，也可以是一个电子邮件、一个Word文档或者是一个应用程序。创建超链接的步骤：选择链接的载体；选择链接的目标；指定目标窗口。,6.超链接创建,32,验证超级链接,上面的三个步骤设置完成后，超链接的创建便完成了。接下来有必要验证一下超链接是否正确，可用如下的方法来验证：网页的设计视图中，把鼠标移到已经创建了超链接的载体上（文字、图