搜索
目录上一页下一页退出Dreamweaver网页制作第一单元创建个人网站主编：王树平副主编：杜大志李光宇目录上一页下一页退出任务描述：本单元将通过一个个人网站的创建，学习网站从规划到建立的流程，自己动手，打造属于自己的站点。任务完成后如下图所示：第一单元创建个人网站目录上一页下一页退出第一单元创建个人网站任务一规划个人网站任务二创建站点任务三管理站点任务四创建网站目录结构任务五使用代码创建网页目录上一页下一页退出任务一规划个人网站任务描述：了解网站的主题和规划流程，规划一个个人网站。任务分析：制作一个个人网站之前需要进行系统的规划，包括网站主题的确定、栏目板块的划分及建立相应的目录结构、选择合适的开发工具软件。第一单元创建个人网站目录上一页下一页退出自己动手：1．定位网站的主题和名称。常见的网页主题有哪些？网站主题的选择需要注意什么？2．规划网站的栏目与目录结构。设计网站目录结构需要注意哪些问题？任务一规划个人网站目录上一页下一页退出3．选择网页制作软件其他常见网页编辑软件：微软的Frontpage：MicrosoftOffice办公软件成员之一，被誉为最易于使用、功能强大的网页制作编辑入门工具。Netscape编辑器：NetscapeCommunicator和NetscapeNavigator随带的网页制作软件，是一款简单的面向初学者的网页制作入门工具。CuteHTML：美国GlobalSCAPE开发的网页制作软件。HotDogPro4.54：美国软件公司Sausage推出的网页制作软件，使用方便、功能十分强大，具有动画制作功能。现在的最新版为“HotDogProfessional7”。Dreamweaver8：一款集网站管理与网页制作于一身的“所见即所得”的网页制作软件任务一规划个人网站目录上一页下一页退出任务总结：通过完成以上任务，学习了个人网站的规划方法。任务一规划个人网站目录上一页下一页退出举一反三：1．通过互联网浏览网站，总结所浏览网站的主题类型，至少找出企业宣传、软件下载、求职招聘、专业论坛、流行时尚、互动聊天和在线销售类型的网站各一个，记录它们的网站名称填入表JYFS1-1中。A.启发思路：根据表格内的提示，使用搜索引擎查找相关类型的网站。B.分组完成任务。任务一规划个人网站目录上一页下一页退出2．相同主题类型的网站所包含的栏目不一定完全相同，搜索并浏览网络上的个人网站，看一看它们都包含哪些栏目并进行汇总。A.启发思路：不同的人制作的个人网站栏目划分会有很大的区别，不同的年龄段，不同的工作职业，不同的兴趣爱好有不同的栏目划分。在搜索过程中注意考虑这些区别，例如，电影明星的个人网站中肯定会有影迷会这样的栏目，而运动员的个人网站中一般包含荣誉奖项这样的栏目B.分组完成任务。任务一规划个人网站目录上一页下一页退出作业：1．为自己设计一个个人网站，至少包含8个栏目，参照课本表1-1画出站点的目录结构。任务一规划个人网站目录上一页下一页退出任务二创建站点任务描述：使用网页编辑软件Dreamweaver8，创建“幽幽我心的个人网站”站点。任务分析：创建本地站点首先需要运行Dreamweaver8，然后定义站点的名称、确定是否使用服务器技术、确定站点在本地计算机上的位置等。第一单元创建个人网站目录上一页下一页退出自己动手：1．启动软件Dreamweaver8。Dreamweaver8界面Dreamweaver8的起始页2．创建网站站点。创建站点的流程任务二创建站点目录上一页下一页退出任务总结：通过完成以本任务，学习了软件的启动方法以及创建网站站点的流程。任务二创建站点目录上一页下一页退出举一反三：1．新建一个站点，名称为“pra1-1”，使用“高级”选项卡完成新建过程，保存位置为“D:\pra1-1”，其他参数保持默认即可。A.启发思路：在新建站点的过程中，使用“高级”选项卡完成新建过程更为直观，需要进行设置的参数与使用“基本”选项卡完成这一操作是一致的。B.分组完成任务。任务二创建站点目录上一页下一页退出2．使用搜索引擎搜索并打开5个不同主题类型的网页，记录并分析它们的URL，将其URL中的协议类型、域名和目录结构等内容填入表JYFS1-2中。A.启发思路：使用浏览器浏览一个网页的时候，浏览器的地址栏中显示出这个网页的URL地址。B.分组完成任务。任务二创建站点目录上一页下一页退出作业：1．新建一个以自己姓名命名的个人站点，该站点使用“ASPJavaScript”服务器技术,暂不设置远程信息与测试服务器，站点保存在“D:\pra1-2”文件夹中。任务二创建站点目录上一页下一页退出任务三管理站点任务描述：使用网页编辑软件Dreamweaver8，实现站点的管理。任务分析：站点的管理功能包括新建、编辑、复制、删除、导出和导入，在Dreamweaver8中有相应的管理工具可以直接完成这些操作，大大简化了站点的管理工作。第一单元创建个人网站目录上一页下一页退出自己动手：1．导出站点。任务三管理站点站点名称目录上一页下一页退出2．导入站点。任务三管理站点注意：因为有重名的站点，所以导入的站点名称后面自动加0。目录上一页下一页退出3．复制删除与编辑站点。任务总结：通过完成以本任务，学习了软件的启动方法以及创建网站站点的流程。任务三管理站点目录上一页下一页退出举一反三：新建站点“pra1-5”，使用管理站点功能将其导出。将站点导出文件通过网络或移动存储设备拷贝到其他计算机中，使用管理站点功能将其导入。1．启发思路：在站点制作过程中，有时需要更换计算机，导出站点并导入到其他计算机中。2．分组完成任务。任务三管理站点目录上一页下一页退出作业：1．新建站点“pra1-3”，使用管理站点功能复制站点“pra1-3”，编辑复制的站点名称为“pra1-4”，之后删除站点“pra1-3”。任务三管理站点目录上一页下一页退出任务四创建网站目录结构任务描述：实现先前规划的“幽幽我心的个人网站”目录结构任务分析：创建目录结构需要在站点内新建相应的网页文件及文件夹。在众多的网页文件中有一个页面叫做首页，他作为整个网站的入口，必然要与其他的页面在设置上有所区别。第一单元创建个人网站目录上一页下一页退出自己动手：1．启动Dreamweaver，打开“幽幽我心的个人网站”。2．使用文件面板（看不到文件面板怎么办？）创建网站首页：A.如下页图所示，在文件面板中，选择“幽幽我心的个人网站”右键单击，新建一个网页文件，命名为Index.html。任务四创建网站目录结构注意：不论是使用起始页还是使用“新建”菜单创建新网页，都需要保存到准确的目录位置。所以建议使用“文件”面板直接在站点内新建网页文件及文件夹。B.在文件面板中该文件名上右击鼠标，选择“设成首页”,以区别于其他网页文件。目录上一页下一页退出任务四创建网站目录结构创建网页时网页命名有什么要求？首页文件名命名有什么要求？目录上一页下一页退出3．在文件面板双击打开首页文件、设置其页面属性任务四创建网站目录结构Dreamweaver8界面各部分的功能是什么？页面属性首页名称目录上一页下一页退出如下图所示，在首页文件index.html的页面属性中，设置左边距和上边距为0像素。任务四创建网站目录结构各选项的功能什么？目录上一页下一页退出5．新建首页图像文件夹6．新建其他页面文件夹。结果文件面板如下图所示。课堂讨论：首页文件名称可以不用index.html吗？怎样把首页文件与其他网页文件区分开来？通常把页面的左边距和上边距设置为0，为什么？4．单击“F12”键，在IE浏览器中预览生成的网页。任务四创建网站目录结构空白首页怎样管理站点目录？目录上一页下一页退出任务总结：通过完成以上任务，学习了创建首页、设置页面属性、创建并管理站点目录。任务四创建网站目录结构目录上一页下一页退出举一反三：依据前面学习的知识与掌握的专业技能，新建一个站点，网站命名为“网页制作”，存放在“D:\dreamweaver”文件夹中，使用“文件”面板新建首页文件“index.html”和首页图像文件夹“images”，在“我的电脑”中查看相应目录的变化。1．启发思路：注意要把网页设为首页2．分组完成任务。任务四创建网站目录结构目录上一页下一页退出作业：1．使用文件菜单新建ASPJavaScript类型的动态页，文件保存为D:/practice1-1.asp，使用属性面板修改网页标题为ASP网页。2．新建站点pra1-7，使用文件面板创建一个网页文件，命名为practice1-2.html，选中该文件后使用下拉菜单中的重命名选项，改名为newpage.html，同样使用下拉菜单中的选项预览页面后删除该页面。任务四创建网站目录结构目录上一页下一页退出任务五使用代码创建网页任务分析：网页是用HTML（超文本标识语言）记述的，HTML是一种编写网页的基础语言，是英文HyperTextMarkupLanguage的缩写，中文意思是“超文本标识语言”。HTML文件也可以说是一个文本文件，它包含了一些HTML标签、文本、脚本等，而且可以使用记事本等多种文本编辑软件进行编写。任务描述：使用HTML语言创建一个空白页面。第一单元创建个人网站目录上一页下一页退出htmlhead……/headbody……/body/html打开记事本输入下列代码并保存，文件名example.html，最后双击运行。任务五使用代码创建网页自己动手1．使用“记事本”创建一个空白网页文件其中各Html标签的功能是什么？目录上一页下一页退出2．使用Dreamweaver8“代码”视图创建一个空白网页文件运行Dreamweaver8，使用起始页新建一个空白页面，在“文档”工具栏中选择“代码”视图，“文档”窗口将显示如下图代码，其中包含文档类型的说明文字和页面的编码方式与标题。任务五使用代码创建网页此代码会在新建空白网页时自动生成。目录上一页下一页退出课堂讨论：分组讨论使用代码创建网页和使用Dreamweaver8创建网页各有什么优缺点。任务五使用代码创建网页目录上一页下一页退出举一反三：依据前面学习的知识与掌握的专业技能，使用word2003新建一个空白文档，保存时选择文件类型为“网页（*.htm；*.html）”命名为“wordpage.html”，保存在D盘根目录下，完成后使用Dreamweaver8打开该页面，在“代码”视图下查看其自动生成的HTML代码。1．启发思路：网页是由HTML语言编写的，保存为扩展名为Html或Htm的文本文件。任何一个文本编辑软件都可以编写。分组讨论有哪些文本编辑软件，引出Word。回忆如何使用Word创建文件。2．分组完成任务。任务五使用代码创建网页目录上一页下一页退出作业：1．使用Dreamweaver8新建一个空白文档，将“文档”窗口切换到“拆分”视图，查看“文档”面板的状态。2．meta标签是head标签内部包含的一个功能标签，使用网络查找该标签的各种属性及其作。任务五使用代码创建网页相关知识：1．常见的网页主题有：个人站点、企业宣传、软件下载、求职招聘、专业论坛、流行时尚、互动聊天和在线销售等。2．对网站题材的选择，通常要注意以下两点：A.主题要简单明确。网站的内容要紧密地围绕主题，它不可能包罗万象，也并不是把所有精彩的图像、动画、视频放在一起，就能做出好的网站，那样的结果往往会让你的网站没有特色，而且也要耗费很多的精力去维护。B.尽量选择自己擅长或者喜欢的内容作为网站的题材。比如根据所学的专业，自己的爱好、特长等去分析选择网站题材。这样的题材做起来才会有兴趣，兴趣是制作网站的动力，有热情才能设计出优秀的作品。任务一规划个人网站3．建立目录结构的一些建议：A.不要将所有文件都存放在根目录下，会造成文件管理混乱。B.按栏目内容建立子目录。C.在每个栏目目录下都建立独立的images目录保存图像资源。D.目录的层次不要太深，建议不要超过3层。E.目录使用英文名称，不要使用中文名称。F.不要使用过长的目录名称。任务