网站的设计教学设计.doc

“网站的设计”教学设计【教材分析】：“网站的设计”是上海科技教育出版社网络技术应用（选修）第四章第一单元“了解与设计网站”的第二课时，它是学生进行网站制作的前提工作，对后期学生利用网页制作工具具体实现网站起到重要的引导作用。本课内容在整个网站建设中是非常关键的，在这部分教学中，要求动脑思考的内容比较多，所以对于本节课内容只在于让学生了解主题网站设计的重要性。在网站设计中，一份详细的网站规划表有利于指导创作过程，而策划主题风格同样至关重要，它以显性的方式向人们展示了网站的主题、个性等，这部分内容同样也是要求学生进行深入思考的。【学情分析】：本节课的授课对象为高二年级第二学期的学生。学生在初中，高一都已使用过Frontpage来制作主题网站，对网站的制作已有了初步的了解，但对网站的开发流程没有进行系统的学习。在上学期，他们已经掌握了上网的相关操作（如：接入Internet、浏览网页，从因特网上获取信息等等），通过观察，他们对上网很感兴趣。同时也发现了许许多多内容丰富、创意新颖、设计独特的网页，也有学生在询问如何制作个人网站并把它传到网上去，达到宣扬自己的目的。由此可见，他们对网站的设计也是很有兴趣、有信心的。【教学目标】： 知识与技能：1、了解优秀网站应具备的一些特征要素；2、让学生明确“网站的设计”的重要性；3、能根据主题设计网站。过程与方法：1、通过网站的欣赏及对比，探究网站设计中应考虑的一般要素；2、初步确定小组网站的主题；3、通过同学“网站设计”主题网站的活动，使学生学会科学、合理地整理与规划信息，提高学生的信息素养。情感态度价值观：1、在分析、探讨中学会欣赏，学会客观的评价自我以及他人；2、引导学生对任务进行分解，学会适当的分工与合作。【重点难点】：重点是网站设计的过程和方法。难点是网站的整体构思，也就是依据自己的兴趣爱好，选择网站主题，创作网站名称，设计网站的栏目、结构、风格和布局等。【教学方法】：讲授法、任务驱动法、小组协作法相结合的教学方法【教学设想】：1、课前向学生调查他们平常喜欢的网站，利用截图的方式在教学课件ppt中展示出来，引起他们的学习欲望，从而了解不同布局的网站，它们的设计都是差不多的，都有各自的主题、内容、风格等；2、由于网站设计是个大任务，要建设一个网站往往需要多人合作才能完成，因而采用小组协作法充分发挥学生各自的特长，关注到每一个学生的发展。还能炼就他们良好的团队协作精神，而且小组成员的知识程度、学习能力和思维方式都有差异，可以通过讨论、交流与合作，取长补短、拓展思维。3、新课教学环节，采用新知传授和实例相结合的方式来进行。这样学生会比较感兴趣，因为这些网站都是他们喜欢的；4、由于网站设计是个大任务，要建设一个网站往往需要多人合作才能完成，因而采用小组协作法，从而充分发挥学生自己的特长，关注到每一个学生的全面发展。还能锻炼他们良好的团队协作精神，而且小组成员的知识程度、学习能力和思维方式都有差异，可以通过讨论、交流与合作，取长补短、拓展思维。5、课堂上，还要充分考虑学生的认知水平不同，给个别组的学生增设任务拓展：完成快的小组可以使用FrontPage中的表格来规划设计网站主页面。【教学环境】：网络教室 + PPT演示文稿 【教学过程】一、创设情境，引入课题：【教师活动】：在开学的第一周，各位同学已经知道我们这个学期的主要任务就是建一个主题网站，在上节课我们一起了解了网站的一些基本概念以及动态网站和静态网站的工作原理，还要求各位同学按照各自的兴趣、爱好2-5人一组，确定本学期要制作的网站主题，并收集相应的信息内容。接下来大家是不是想我们就要开始使用网页制作软件来制作我们的主题网站了呢？先请各位同学观看网上截取的一些网站截图：ppt播放几张网页的截图：（时光网、豆瓣网、新浪网、中国教育信息网、音乐极限网等）【学生活动】：观看幻灯片截图【教师活动】：看了这些截图以后，提问：1、你们记住了几个网站，分别是哪些？2、这些网站分别表达了什么主题？3、网站最吸引你的地方在哪里？（网站名称、主题内容、风格、结构、色彩、布局等方面去分析）4、各位同学都很喜欢上网，在打开一个网站的第一时间你们最关注的是网站的什么东西？是它的名称、主题、内容或是色彩等？【学生活动】：思考并回答问题【教师活动】：PPT展示几个网站的主题、风格和色彩的描述等。【教师提问】：还有就是播放截图之前问大家的一个问题：在我们认识了网站的一些基本概念之后，是否马上可以利用网页制作工具来制作网站了呢？【学生回答】：【教师总结】：经验告诉我们，建立一个网站好比写一篇文章，首先要拟好提纲，文章才能主题明确，层次清晰；也好比造一座高楼，首先要设计好框架图纸，才能使楼房结构合理。因此，在建一个网站之前必须有一个总体的设计。【设计目的】：让学生迅速集中注意力到课堂，用学生熟悉的内容创设情景，引起学习兴趣，激发学生的求知欲望。二、新知讲授：网站的策划与设计：【教师活动】：刚才我们所看的几个网站，都有自己的主题，自己的结构设计和网站的栏目，以及一部分内容等。其实，网站设计就是对网站的主题、内容、风格、布局等进行的一个总体设计。【学生活动】:学生了解什么是网站设计【设计目的】：为下面的主题网站设计打下基础【教师活动】：在对主题网站进行设计之前，我们必须先来了解学习指引中一些关于网站策划与设计的知识：网站的生存与发展取决于网站的主题、内容和布局等，因此，在正式开始建设网站之前，需要对其进行全面的策划与设计。1、 主题及内容的选择与定位网站的选题，就是要根据网站的开发目标和访问网站的用户群，确立网站的主题，并给网站起一个简练响亮的名字（与主题紧密相关、有意义）。网站的主题就是网站要表达的主要内容，在动手制作网站之前，首先要考虑的就是建个什么样的网站，放些什么内容，希望吸引哪些访问者。选择网站主题和内容应从以下几个方面考虑： 熟悉的、擅长的题材； 主题小而精、要易记有特色； 内容要有创新； 兼顾网站主要访问群体的兴趣和浏览习惯等。2、 栏目的设计：制作网站前要设计好网站的栏目，网站的栏目可以有多级，但并不是级数越多越好，以能够恰当地体现网站主题为好。此外，每个栏目应有一个大致的内容描述，以表达该栏目的设计思路。也就是说，我们在确定好主题后，需要把网站的内容按一定的方法进行分类，并设置专门的栏目，栏目设置的原则有三个：紧扣主题，尽可能删除与主题无关的栏目；尽可能将网站最有吸引力的内容列在栏目上；尽可能方便访问者的浏览和查询。3、 网站的风格设计风格是指网站的整体形象给浏览者的综合感受。有的严肃，有的温馨，有的深沉，有的活泼，有的典雅，有的豪迈。风格设计与主题是密不可分的，是为突出主题服务的。就像每个人都有自己的穿衣风格一样，有人喜欢休闲、有人喜欢时尚、也有人喜欢中规中矩、也有人喜欢淑女等。要想让网站吸引人们的注意，就必须确立自己的风格，网站的风格设计一般从色彩、图片、字体、语言风格等几个方面进行考虑。4、 网站内容的收集和筛选在创建网站时，资料收集的过程是必不可少的，资料的收集要有一个明确的界定范围，不要把与网站主题无关的内容塞到网站里，也不要收得太多太杂。5、 网站结构和超级链接的设计考虑采用哪种网站结构（树形、星形和混合形），是否需要放导航栏，导航栏放在哪里，是否需要放返回主页的链接，哪些内容要链接到主页，哪些内容要链接到其他级的页面，是否设置搜索引擎等。6、 网页的布局在网站设计中，页面的布局也很重要，导航栏的位置、文字的位置、图片的位置，都是设计者需要考虑的内容。网页布局大致可分为：国字型、拐角型、标题正文型、左右框架型、上下框架型、综合框架型、封面型、Flash型及变化型等。设计网页布局的主要参考要素有： 平衡：指页面的图片、文字的视觉分量在左右、上下几个方位基本相等，分布均匀。色彩表现也要平衡，给人一种协调的感觉。 呼应：使一种元素同时出现在不同的地方，形成相互联系 对比：利用不同的色彩、线条等元素相互并置，造成画面的多种变化，达到丰富视觉的效果。 疏密：即空白的合理运用，太满、太密、太平均是布局设计的大忌，适当的疏密搭配可以使画面产生节奏感，体现出网站的格调与品位。7、 网站建设技术和工具的选择网站的主题、风格、布局等内容的设计，决定了是否需要考虑采用动态网页及应该采用何种形式的动态网页。然后可以根据需要选择相应的网站建设技术和网页制作工具。【学生活动】:学生了解网站设计的基本要求【设计目的】：为主题网站设计提供知识点三、任务体验：【教师活动】任务布置：对网站的策划及设计了解以后，请各位同学按照上节课各小组所确定的主题、搜集的内容填写“网站设计规划表”。【学生活动】:学生讨论并填写“网站设计规划表”网 站 设 计 规 划 表班级： 组长： 编号： 主题网站名称网站主题建立网站的目的（开发目标）网站的面向对象网站结构小组长小组成员网站栏目安排栏目一内容描述栏目二内容描述栏目三内容描述栏目四内容描述栏目五内容描述栏目六内容描述小 组 分 工 情 况主题网站任务负责人设想网站设计网站制作资料收集整理网站测试网站发布于维护可能存在的困难和要求四、总结评价，任务拓展：【学生活动】：小组展示方案，介绍设计思路。【师生互动】：师生共同对填写好的网站规划表进行分析并评选出优秀的方案。【任务拓展】：完成快的小组可以使用FrontPage中的表格来规划设计网站主页面。【学生活动】：学生完成附件1（学案）的作业【设计目的】：学生通过对主题网站设计规划表的填写，体验网站的设计过程；通过小组互评、教师点评，让学生在评价过程中体验到设计网站的过程，为下节课的学习打下基础。学案作业的完成，让学生更好的掌握优秀网站的必备要素，为自己网站的建设提供参考。【活动评价】：请各小组填写任务评价表评 价 表小组编号： 得分： 网站设计规划表评价细则具体指标标准得分是否全组参与10活动过程中是否积极、主动10网站建设的目的是否明确10网站的主题是否鲜明，内容是否都和主题相关20网站的名称是否具有新意、吸引力与主题相关15网站的内容是否科学、准确、全面15网站的风格是否和主题相符10网站的栏目是否紧扣主题10附1：【学案】网站的设计班级 姓名 一、针对各自小组