《《网站设计与网页制作》电子教案.docx》由会员分享，可在线阅读，更多相关《《网站设计与网页制作》电子教案.docx（35页珍藏版）》请在课桌文档上搜索。
1、苏州工业职业技术学院教师备课首页SuzhouInstituteOfIndustrialTechnology,W*4sRx第1页课题子项目一第1讲网站建设的整体流程课型新授授课班级授课时数2教学目标1 .对网页制作工具有一个基本的认识，知道它的功能、用於和使用的广度等。2 .了解网站的开发步骤.为接下来的学习打基础。教学重点1 .按照工作的规格对学生提出学习本课程的具体要求。2 .网站的开发步骤，以及一些规格数据。教学难点使学生能够明确自己学习本课程的最终目标，并从整体上了解网站开发流程,为后面的学习打基础。学情分析教学效果教后记第1讲网站建设的整体流程引入：随着网络的发展因特网已成为了人们生活
2、的部分，这都是网页的功劳。通过网页浏览者可以得到各种信息，可以交换思想可以通过网络进行购物，目前的网页种类繁多，归纳来可以分成这么几种：堆纯根据兴趣而制作的个人网页、由具有共同爱好的人所组成的团体、以宣传企业为目的的企业用网页、成为因特网商店的大型购物中心以及门户网站等。而那些视觉效果比较好的网站往往会收到我们的青睐。那么这些网页是如何制作出来的呢？在目前市面上众多的网页编辑软件中，有的重视效率，有的强调版面设计，而DreamWeaVer可以很方便地实现这两方面的完美结合。另外，Dreamweaver的网页动态效果与网页排版功能都优一般同类软件，即使是初学者也能制作出相当水准的网页，所以Dre
3、arnWeaVer是网页设计者的最佳选择，已成为目前最为流行的网页设计工具。网页设计好学吗？网页设计好学。只要学会操作网页三剑客，人人都可以制作出网页来.网页设计不好学。（列出两个差异巨大的网页）同样是设计公司，但在网上展示出的效果却如此的不同。假设大家是客户，在经费许可的情况下，你会优先选择哪一家来做设计呢？当然是第一家了。这就是网页设计域能体现出效益的地方。但是，同样是做网页的，为什么差距如此之大呢？原因就在丁网页设泞是平面设计、动画设计、音效设计、配色等各个方面结合的产物。因此,学会网页设计虽然不难，但是要做好网页，却需要不断地学习和积累，在不断的探索和实践中进步。新授：一、认清两个名词
4、一网页和网站以学校网站为例：性看一一杳看源文件（纯文本文件）.在互联网上应用最广的功能应该是网页浏览。浏览器窗口中显示的一个页面被称为一个网页，网页实际上就是一个文件，这个文件存放在世界上某个地方的某一台计算机中，而且这台计算机必须要与互联网相连接。当我们在浏览器的地址栏中输入网页的地址后，经过一段复杂而又快速的程序解析后，网页文件就会被传送到我们的计算机中，然后再通过浏览器解择网页的内容，最后展现在我们的眼前。文字和图片是构成网页的两个最基本的元素。除此之外，网页中还包括动画，表雌，视频和音频等内容。那网站呢？网站是众多网页的集合。不同的网页通过有组织的链接整合到一起，为浏览者提供更丰宾的信
5、思。网站同时也是信息服务类企业的代名词。如果某人在网易或者在搜狐工作，那他可能会告诉你，他在一家网站工作1网页和网站的关系：假如网站是一本-E的话，网页就是这本书中的一HTM1.文件的基本结构HTM1.文档的结构网页标aMM-W1.AVHEAD：头”分IHTM1.网页HelIO.Fd!网页内容.可以是文本、BM卜VBoDYA主体,分VHTM1.VHTM1.标签标记HTM1.文档的开始和结束I网站的开发不仅仅只是把网页制作出来那么筒单二、网站的开发步充I.网站的前期策划a）确定网站的用户群和定位网站的主题（确定网站的名称）b）整理客户提交的资料（文字、图片）在制作网页时代码视图讲。O网站结构图（
6、网站导航设计）d）网站形象设计i. 网站的标志（Sgo）ii. 网站的色彩搭配iii. 网站的标准字体iv. 网站的宣传标语e）网页布局图（版式风格）2 .首页页面设计3 .其他二级页面效果设计4 .在PhotOShOP中裁切设计稿5 .站点的规划与建立6 .在网页编辑软件中制作网贞7 .测试与发布上传8 .后期更新与维护具体分析一“网上书店，i.确定网站的名称网站的名称很重要，它决定着你的网站是否更容易被人接受。【举例】：“网上书店”这个网站，名字读起来JR琅上口、能反映出网站的题材、且易记。讨论主题：你能列举出一些你所喜欢的网站名字并说明你喜欢它们的理由吗？ssFlashfBanner）制
7、作.总结：素材的整理与再加工.网站的名称应该简短、有特色、容易记，最电要的，它应该能够很好地概括你的网站主题,网站命名的原则：（1）要有很强的概括性，从网站的名称就能反映出网站的题材。（2）要合理、合法、易记，最好读起来琅琅上口。（3）名称不宜过长,要方便其它网站链接.（4）有个性，体现出一定的内涵，能给浏览者以更多的想像力和冲击力。2,整理客户提交的资料在做网页之前，我们要尽可能多地收集与网站主题相关的素材（文字、图像、多媒体等素材）,再去先存菁.取其精华为我所用，界的情绪.赏心悦目的网页，色彩的搭配都是和谐而优美的。【举例】：1 .主色调：蓝+白+黑2 .辅助色：球+橙+黄+灰6 .网站的
8、标准字体网站的字体也是网页内涵的一种体现，合适的字体会让人感觉到美规、亲切、舒适。一般的网页默认的字体是宋体，如果你想体现与众不I可的风格，可以做一些特效字体，但特效字体最好是以图像的形式体现，因为很多浏览者的电脑中可能没有你所设置的特效字体O【举例】：1 .正文：宋体、12像素、行高16像素、深灰色2 .标题：宋体、14像素、加粗、深灰色3 .版块标题：特殊字体(迷你简稚艺)处理成图片的格式7.网站的宣传标语讨论主题：请大家列举出生活中给你留下深刻印象的宣传标语，并分析标语的优劣.【举例李宁切皆有可能8、网页布局图网页布局元素一般包括：网站名称(logo).广告区(banner)、导航区(m
9、enu)、新闻(whatsnew)、搜索(search)、友情链接(links)版权(copyright)等。网页版式：我们常见的布局结构仆国”字形布局、“匡”字形布局、三”字形布局、川字形布局、封面里布局、FlaSh布局、标题文本型布局、框架型布局和变化型布局等。首页，三字型上、中、下)：中：分三栏(左、中、右)9.首页及二级页面设计贞面设计主要包括创意、色彩和版式:个方面。创意公使网页在众多的竞争对手中脱颖而出；色彩可以使网页获得生命的力量：版式则是和用户沟通的核心，所以这三者缺一不可.使用Photoshop设计首页效果图，首页设计完之后，其他页面的设计就没有主页那么或杂了。主要是和主页风
10、格保持致，页面设计美观，要有返【可主页的链接等.【阚】：1 .首页设计图:.网上书店-E-B(X)KSTORE用户赞录新书上紫站长推苍用户名:网上调杳DicaavcaveiIX2004从入DtIWIII怅*：n”汇出3社：DWaFitlUXtfBOI:oxi2)g门典书专业39书Photosbopcsz技术”押与特效设Htt:WEax3Ji:+g*eIi金日Ie:御。月*t*RPBt祖?UnAJOYO；M*amaxoncn友情链接156.1I书!学ItMR?生而士“站所用!三MaTF%.加有侵&行加皿MHwXMA町第X，般方太：兴肯村芒（css住港交密后与网GI怅，：2Q&或Ii:人反“电匕9
11、11土*日用：怎088月V50.1天天IRliT*3E2BNg；rerYedMxXXJMl1.r业审业技*eaxa天夭特价SAVE4W1,fU三QMACmazsA11eA*a)1RRiH3ruAAMHAfMM*RttWttGesSKmg细*c户Ie4VAJ及KHYW.-1三三Cv90.1HU宏EJUi嚅tiE-BOOKSTORE“国tu*UiUNgMWGN#fIi悴TKA告什1ttK湾:；efMra:ir;iarr”；“、：后画白ef2oo4UWI5BT；HU)三rX于二tn4z三ttdUtr!D)J”三.UM20l；，思川行冷GtHwt展(SmAjnx(UUxrnJZ.*4.Rlt-1RM标
12、题文本型h.框架型布局采用框架布局结构，常见的有左右框架型、上下框架型和综合框架里.由于兼容性和美观等因素，这种布局目前专业设讦人员采用的已不多，不过在些大型论坛上还是比较受音睐的，有些企业网站也有应用。变化型三、形象设计打开个网站，给用户留下第印象的既不是网站丰富的内容，也不是网站合理的版面布局，而是网站的色彩。色彩对人的视觉效果非常明显,一个网站设计成功与否，在某种程度上取决于设计者对色彩的运用和搭配。因为网页设计属于种平面效果设计,在排除立体图形、动画效果之外,在平面图上，色彩的冲击力是最强的，它很容易给用户留下深刻的印缴。因此，在设计网页时，我们必须要高度重视色彩的搭配。1、色彩的基础
13、知识色彩五颜六色、千变万化，我们平时所看到的白色光，经过分析在色带上可以看到，它事实上包括红、橙、黄、绿、青、蓝、紫等七色，各颜色间自然过渡.其中，红、黄、蓝是：.原色，：.原色通过不同比例的混合可以得到各种颜色。色彩有冷暧色之分，冷色（如蓝色）给人的感觉是安静、冰冷：而暖色（如红色）绐人的感觉是热烈、火热。冷暖色的巧妙运用可以让网站产生意想不到的效果。色彩与人的心理感觉和情绪也有一定的关系，利用这一点可以在设计网页时形成自己独特的色彩效果，给浏览者留下深刻的印象.一般情况下,各种色彩给人的感觉是:红色代表热情、活泼、热闹、温暖、幸福、吉祥货色代表光明、华明、兴奋、甜蜜、快乐黄色代表明朗、愉快
14、、将出、希望绿色代表新鲜、平静、和平、柔和、安逸、青春黄色主题绿色主题蚯色主题第I页课题子项目一第4讲承写网站策划书课型实践授课班级授课时数2教学目标1 .了解什么是网站策划、什么是网站策划书网站策划书的重要性，以及其未来的发展。2 .掌握如何撰写网站策划书教学重点了解什么是网站策划、什么是网站策划书、网站策划书的重要性，网站策划书书写的格式、注意点、内容教学难点了解什么是网站策划、什么是网站策划书，网站策划书书写的格式、注意点、内容学情分析教学效果教后记命名文件或文件夹注意点：1 .使用英文或拼音；2 .不能包含空格等非法字符：3 .要有一定规律，以便日后的管理：4 .文件名应该容易理解，看
15、了就知道文件的内容，建议用小写的文件名:5 .合理分配各种类型的文件：6 .合理安排文件的目录，不要将所有文件都存放在根目录卜7 .按栏目（导航）内容建立子目录：8 .在每个一级目录或二级目录下都建立独立的ImagCS目录：9 .目录的层次不要太深，建议不要超过3层，以方便维护管理.：10 .不耍使用中文目录及过长的目录.公共文件夹命名约定如下：/images公共图片/styles样式表/common脚本语言/ftps上传、下载Zdoc网站相关文字资料、文档/media动画、视频多媒体文件/backupM站数据备份Zbbs论坛文件夹 模仿操作模仿给定的素材，完成本地站点的构建及文档素材的整理归
16、档。 归纳总结对于站点的构建，一开始的规划很重要。有了一个清晰的规划，可以为以后的制作做很好的铺垫.站点的命名也是一个重点，切忌不要用中文. 项目完善根据策划书中定好的站点规划进行站点创建和文档素材的整理归档,项目分析，一开始制作网站的时候，可以观察一些网站半成品，删除所有图片，看看它的构成部分是什么？表格是比较流行的网页构造布局的方法，它主要用于排列内容和整体布局，只有熟练掌握了表格的使用方法以后，才能随意构造出各种形状的布局。技能要求；1 .学会表格创建、结构调整与美化方法：2 .学会设置表格与单元格的主要届性；3 .学会使用布局表格及图像跟踪进行网页布局。项目展示用户登录999网上S曾网
17、上汨店E-B(M)KSWKE天天特价SAuU心n3mUnMH-i-,ild加2上.VWI本同VMI3i加严(o/dmaw.Qear、IMmId摩:X三m)iHHlMff*rCMAnUJ操作演示1.准备工作，设计效果图一切图，PS切片一整理图片、文字、多媒编辑一一首选参数一一文件类型/编辑器一一进行相应的设置。图像标记图像，也就是images,在html语法中用im来表示，其基本的语法是：#=图像的IR1.关于Url就是指的是图像在网上的地址。imgalt=纷#=在浏览器尚未在全读入图像时,在图像位四显示的文字：也是图像显示以后，当鼠标放在图片上时所显示的文字。图像在页面中的对齐/布局；语法：C
18、imgalign=Qgleft,center,right,使用图像的align属性,其实这一属性布置在这里用到，以后我们在学习表格的时候也会遇到align,它的值left,center,right就是他的中文意思，left居左，cer11er居中，right居右。例子：图像和文字的对齐：语法：#top,middle,bottom,这里的align利上边的实现的效果不一样，大家从它的值可以看出，它所显示出来的是文字在图片的靠上边、中间、底端。图像的边框：ingborder=#=YalUe数字，指的是这个图像的边的宽度！示例：模仿掾作1 .填充内容：将首页中的文字部分补全。2 .用CSS设置文本的
19、格式。3 .分段或分行.4 .排列图片和文本。5 .在网页文档的最下方输入版权信息。6 .在网页相应的位置插入图片。2.使用范例:网站破接好站好站电子邮件三写鹏朋友Jn4fiWIZt即跳接下我档案a%七仁13:厮.30：1必肥1下我档案心new、胶接SeedneInews服务ccdnrtnews版gopher住技sccdncigopher服务sccdncgopher服务3Nh链接MXdnctgopher服务ahref=*sccdncbbs很【链接标志的参数】1 .使用方法：在链接后面加入Iargel=一参数2 .标志解说：链接的参数并不多，常见的大概就屈target这参数了，target的意思
20、是f目标，也就是网页链接的指向目标，这参数在框窗(frame)里尤为重要！3 .使用范例：IargeI=框窗名称：这在框架标志中也有提到，而且也只有在框架(框窗Orframe)中才用得到。正常而言，框窗有各自的名称，因此，我们可以利用此标志，来指定链接的内容显示到哪个框窗中。IargeI=_b1ank：将链接的画面内容，开在新的浏览窗口中“target=_ParCnt：将跳接的画面内容，当成文件的上一个画面。target=_self：将链接的画面内容，显示在目前的窗口中。targct=top:这个参数可以解决新链接的画面内容，被旧框窗包用的困扰,1 .扩展DW功能的插件Extension（插件
21、）就是DW的外挂混镜，可以从外部卜载DW中不支持的功能后安装到M中使用。通过这种方式，可以使初学者轻松制作出只能用笑杂的JaVaSCriPt或样式表实现的效果.2 .插件种类根据插件的功能和保存位置可以对插件进行分类DW中使用的插件可以分为行为、对象、命令等三种类型，通过运行插件管理器可以安装、删除插件。$MaaomedaExtensionManager3 .插件的获得访问MaCrOmedia网页（httpwu,.nacro4 .安装可以通过插件管理器来进行安装.二、常用插件的介绍和使用1 .在固定位显示横幅和图标在网上冲浪仃时可以看到，即使改变浏览罂大小或上下移动滚动条也会一直保持固定位迎的
22、横幅广告或图标.【制作过程】）打开素材文件夹，安装插件。启动DW。B）在网页中插入图层，并调整到适当大小。并插入张横幅图像。C）选择body标签,添加行为（Persistent1.ayerS）D）设置【Persistent1.ayers】对话框1 .选择图一名称：Iayerl2 .选择SIiCktothepositionspecifiedbythefollowingoptions3 .图层定义到左恻：horizontal:left,与窗口的间距IoPX4 .图层定义到左上侧:VertiCa1：top,与窗口的间距指定为150px5 .可以根据自己的需要来改变横幅的位置和定义它的超链接。2 .制
23、作漂浮图像户名,是否在ASP,JSP,JAVAscript,VBscript等脚本语言里有设置可以访问服芬曙的语言，是否使用了安全套接字层协议SHnP,若使用了这种协议，那么在网页中是否有备份替换的页面。二、判断某个网站是否正常的一些标准在成功的网站和被人.忽略的网站,答案是不相同的！通过以下的清单，您可以确认您的网站是否正常。K你回答了用户的问题么？用户浏览一个网站，是因为他们要答案.所以,你的网站是否提供了用户所需要的答案电极为重要的.2、你的导航是否清楚简单？要确定你的导航可以让用户很明确知遒他们在那里，他们可以做什么，可以去那里！3、你是否提供了链接文字？确定用户在你提示用户点击这里之
24、前，用户总是知道加些带有标SS的链接在用里。4、网站的设计够吸引人么?良好的设计，会给你带来固定的液1.h5、你是否在链接中添加关键字?在你的链接中添加关键字，这样用户可以确认他们知道了他们想要的信息。6,你的措辞够通俗易怖么？检查下你的哈古，确认它足的简单，让所有的用户都明白.7、你的作品是否看起来像一个例金字塔？通过更早的提供最重要的消息给网络用户，满足他们所要的螭间喜悦。8、你是否拥有是峙的空白?内容排列的太过紧密，可能会淡没用户我.正所要的.请留一些空修！9、你有提供联系方式么？如果用户找不到他们所要的全部，那么他们很有可使心想要同你联系.提供你的联系方式,让他们更容易联系到你吧.10
25、、你改变你的网址么？别改变！这样不仅会造成页面链接出错，还会阻码原来时你网站的链接，IK你拥有网站地图么?一个站点地图.对于大型的网站十分重要.它不仅可以帮助迷失的用户找到他们的防税，还可以让你的网站更好的被搜索引军纳入.12、你的信息看起来像个广告么？用户会忽略那”看起来像是推销的信息，请避免使用大红字体和其它看其像汪广告的元素.13、你的网站是否需要一些不必要的类目？请意识到不是每个导航栏都要布置满。只有在它很有用而且是完全必须的时候插入一个类目。14.你是否启用优雅降级？确定即使您的网站不能显示某些特定的元素,但其它的很可能起作用！15、你的1.OGOin接到主页么？用户总是期柒你的网站
26、1.oGO能接到您的主页，确认你有这到这点。的.X、你是否钺接在同一个页面？如果是，请把它取消，链接到同一个页面的不同地方，袭让浏览者感到迷惑,还会渐渐破坏他的对浏览的认识.35、你的设计是否具有一致性？别让用户去徜他们是否不小心来到了另一个网站。请在你整个网站使用相似的颜色和字体.36、你的名字和1.oGo是否每一页都有？别假定因为一个用户在你的网站上，他们就祐认识你是谁.请把你的名字和1.OGO放在你网站的醒目的地方.37、你是否鉴定过下一步？确保他们十分彻底的简单,让用户明确知道他们下一步会去到那里。38、你的FAQ里的给出我正的答案么？如果你的FAQ里充满的只是你自己想要你用户去问的问
27、题，那么你雷要去释放这些问题，确保FAQ中是你我正领繁遇到的问题，这样FAQ公很有帮助的，39、用户能否快速的找到信息？诂遵循3次点击原则，该原则说的是用户会停止使用一个网站，如果他们不能在三次点击之内找到他们所需要的信息。40、你的信息很混乱？如果你的而信息很混乱,那么你需要把这些侑息分耨到不同的区域.41、你的腐体是不是太麻烦？请对你的窗体持一种批评的态度，确保你遵循灵活输入和不要求不必要的信息。42、你的网站是否残障人士也可以轻易的浏览？不停检查,确保你网站对残疾人士的可读性,特别是白人.43、你的字体是否易读？通过避免字体太小，并允许字体变化，确保你的文本的可读性，44、你的网站是否可
28、以细分为消化块？按照七加或减二的原则,其中指出,用户在同一时间可以只保留的五到七件事情.45、你的页面是否可以快速导入？确保你的网页导入迅速，这样让你的网页对那些网速较慢的连接更友好，或者是那叫每分钟都在不停进行网络导入的人，46、你的标超是否是描述性的？确保你的标超同你提供的内容有关系.47、你的网站在不同的圻粽分辨率下是否能泌正确浏览？如果你的网站的设置只是1024x767.你设置的页面对于很多的浏览者来说都不能正确显示.48、提供搜索的功能.提供一个搜索器，让用户可以寻找信息玳以祝信地荷单，49、你是否有对隐私政策进行描述？将用户的联系信息外泄,并且不知道会进行怎样处理,会让你的用户疯狂
29、.做个特别明确的表示:你是否会泄生用户的信息,PI时他的会有多经常会收到你的邮件.50、你的网站有动态布局么？固定的布局设计和页面宽度,会让比较人的浏览器没有办法很好的看到你的网页.同时这样的设计在打印的时候也会出现问题.51、你的内容是否有拼写错误？模仿操作模仿网站的最终效果，按要求对站点进行以下测试与调试并完成测试报告：1 .Ul测试2 .链接测试3 .表单测试4 .兼容性测试5 .网络配置测试6 .负载测试7 .压力测试8 .安全测试归纳总结Drcamweavcr提供了多项功能用来检查和测试站点，其中包括预览页面和检查浏览器兼容性，以及运行各种报告等。1 .学会对制作好的站点进行差错检测
30、2 .学会书写测试报告项目完善根据策划书中定好的站点的功能,逐个进行检查。小组讨论检查结果.商议解决方法，并写成书面报告。交给客户审核，并根据客户的需求进行修改。苏州工业职业技术学院教师备课首页项目分析：将网页制作完成之后，就需要将所有的网页文件和文件夹以及其中的所有内容上传到服务涔上，这个过程就是网站的上传，既网页的发布。技能要求：1 .上传站点时链接站点的准备工作。2 .学会申请空间的方法3 .学会上传网站的方法操作演示1 .申请空间2 .站点设置：远程信息3 .站点的上传两种方式：通过HTTP方式将网页发布、使用FTP方式发布网页模仿操作1 .按要求做好上传站点时链接站点的准备工作2 .
31、申请空间3 .将站点上传到空间归纳总结当选中本地文件所有的文件并上传，在远端站点中出现与本地文件完全相同的列表的时候，网页（网站）就上传成功了。在浏览潜中输入您的域名，享受一下成功的喜悦！1 .上传站点时链接站点的准备工作。2 .学会申请空间的方法3 .学会上传网站的方法顼目完善根据策划书中的要求，申请空间，聘站点上传。交给客户审核，并根据客户的需求进行修改。宓苏州工业职业技术学院教师备课首页SuzhouInstituteOfIndustralTechnology=mWs第1页课题子项目七第1讲文档的书写与整理课型实践授课班级授课时数2教学目标1 .明确文档写作的作用2 .规范文档写作的格式要
32、求3 .明确文档写作的内容4 .会进行文档的整理教学重点1 .规范文档写作的格式要求2 .明确文档写作的内容3 .会进行文档的整理教学难点1 .明确文档写作的作用2 .明确文档写作的内容3 .会进行文档的整理学情分析教学效果教后记项目分析，文档是在网站开发过程中不断生成的，在开始进行接手项目时的网站建设策划书，在进行网站制作过程中小组会议的记录、工作进程的记录，在网站制作完成后的网站说明书，都属r文档的范脂“文档是一种交流的手段，也是网站建设逐步成型的体现。文档的书写以及整理在整个网站开发过程中也有若其必不可少的作用。技能要求；1 .规延文档写作的格式要求2 .明确文档写作的内容3 .会进行文
33、档的整理文档写作，网站作品说明写作方向网站名称：作者：班级：学号：软硬件条件说明：网站基本功能说明：网页设计创意（创作背景、目的、意义）创作过程：1,在DreamWeaVer中运用了哪些技术和技巧2、文字处理是否有特殊方面3,图形处理方面运用了哪些技术，技巧4、其他5.得意之处6、原创部分文档整理网站开发完毕后对在其开发期间生成的一些文档进行整理归档。并将这些素材作为支掾材料与作品等并提交.归纳总结，明确文档在整个项目开发中的地位和作用，不要认为文档是可有可无的。通过文档的书写掌握文档书写的规范。项目完善：1 .每人写份学习本课程后的心得体会。2 .每个小组整理好网站开发中的文档，并进行装订.
34、族配呈需螭%鬻教师备保首页第1页课题子项目七第2讲作品展示、总结交流课型交流总结授课班级授课时数4教学目标1 .培养学生的文字表达能力2 .培养学生的分析能力3 .培养学生协作与交流能力1.培养学生实事求是的精神和慢折感教育教学重点1 .培养学生的文字表达能力2 .培养学生的分析能力3 .培养学生怖作与交流能力1.培养学生实事求是的精神和挫折感教育教学难点1 .培养学生的文字表达能力2 .培养学生的分析能力3 .培养学生协作与交流能力1.培养学生实事求是的精神和挫折感教育学情分析教学效果教后记能力目标，1 .培养学生的文字表达能力2 .培养学生的分析能力3 .培养学生协作与交流能力4 .培养学生实事求是的粘神和挫折感教行讨论交流I一、小组内部交流1 .小组交流心得，并完成网站设计与网页制作小组成员互评表。2 .通过交流修改完善网站。3 .每小组选一个代表展示本小组的作品并简单介绍其设计思想、内容、特色等.4 .小组合作完成作品介绍的演讲稿。二、小组间交流1 .由每个小组的代表上济台展示并简单介绍作品。2 .各小组发表自匕的意见，以供参考。3 .各小组完成G网站设计与网页制作小组互评表。归纳总结通过组内与组间交流，可以集大家的智慧对开发的网站进行完善。同时可以发现自身的不足之处。提交作品完成对作品的修改后，将整理的文档、作品等一并提交给老肺。
