《体验网站规划与设计》教学反思范文大全

第一篇：《体验网站规划与设计》教学反思

《体验网站规划与设计》教学反思

《体验网站规划与设计》教学反思

今天上午，我在高二（1）班上了一节公开课，上课的内容是《体验网站规划与设计》。整个教学过程以师生访问分析网站为主线，采取分组讨论、小组活动进行。教学中以任务驱动、自主学习，交流学习以及引领展示的模式，将规划过程分解为几个任务，根据所学知识，完成对网站规划选题、域名、栏目及艺术风格的规划与设计进行学习，并将各小组任务完成的情况以学案—《网站规划与设计方案》的形式呈现出来。通过展示学生设计方案，对学生成果给予评价与肯定，激发学生进一步学习的兴趣，培养学生主动思考、积极参加团结协作。

成功之处，本节课教学环节完整，对三维目标把握较好，同时认真的对学情进行了分析。本节课，对学高二火箭班的学生，我注重了学生发散性思维、语言表达能力、逻辑推理思维的培养，同时引导学生学会鉴赏、学生聆听、学会尊重，学生在较短的时间内能够很好的完成教学各环节的实践，最终形成了完成的方案，且能很好的陈述。

不足之处，本节课，整个教学过程都是需要网络支撑，由于网络突然出现问题，而心中又想达到理想的课堂，希望给学生一个完整的教学过程，导致课堂的暂时中断，而此后压缩了学生讨论和展示成果的一些时间，后面的教学时间和节奏略显苍促，课堂小节也不是很到位。

经验总结：在教学过程中，我也考虑到网络和电的问题，但是心向往对课堂存理想化状态，实际上不然，不想发现的事终究发生了，以此，不管是哪种级别的公开课，都要着两种备案才可，以免出现课堂教学事故而让自己陷入囧境。

第二篇：《规划设计网站》教学设计

八年级下册

八年级下册

八年级下册

八年级下册

八年级下册

第三篇：网站规划与设计心得

第一次接触网站规划与设计，而且是自己参与设计一个网站，所以非常兴奋，从前期网站主题的确定与相关内容的分析到网站的设计，每个队员都在积极努力，出谋划策，每个人都在经历一场头脑风暴。

1.确定主题。制作网站首先确定主题，我们想做一个租书网站，所以就上网浏览了许多优秀 租书网站和有名的主题网站。

2.设计主页。主页的设计是整个网站的灵魂，构思导航栏的分类，然后是整体规划，每一版 块都有其个性的色彩，清晰明了，便于阅读浏览，我们就构思大致分几部分。首页、热门阅读、传统阅读、散文诗歌、国外文学等等，每一部分又分几小部分，内容比较充分，多样。确定导航栏的各个分类标题之后对于建立二级子网尤为重要。在页面设计时，主要考虑整体布局、视觉平衡、页面尺寸和页面框架等四个方面的因素。保持网站的整体设计风格统一一致，避免凌乱的思维方式，要做到有步骤、有计划的设计和制作。

3.素材的搜集。主页的导航栏设计好后，接下来就是对主页导航栏的各个内容进行资料的收 集，我采用大量的资料收集再对资料进行塞选，得到最适合导航栏内容的资料。网页是否生动、别具特色，还需强调文本、图片、flash小动画或gif动画的编辑以及声音和视频等的处理和加工是否保持相对的一致性。素材的选择，要符合网站的主题，然后放入站点底下，进行图文的链接和排版。

4.实现网页间的链接。做好各个子网和首页后，接下来就是通过模板的链接，将整个网站中 的网页链接起来，过程其实很简单，主要是把要链接的文字和图标选择在选择工具栏的链接按钮最后选择自己要链接的网页单击确定便可以了。

第四篇：网站规划教学设计

网站规划教学设计

一、教学准备：

1．选取一些学生制作的优秀网站，以备上课演示时用。2．配置校园网Web服务器

3．准备好校园内部BBS，为班内互评作准备。

二、教学目标：

1．以网站欣赏为主线，介绍网站设计思想,使学生初步了解网站设计的整体构思。

2．学会如何规划、构思一个网站。

三、教学重点、难点：网站的整体构思

四、教材内容分析

本节课内容为高中第二册第一章第一节内容，它是进行网页制作的前提工作，其重点在于创建网站的几个步骤，即网站设计的整体构思。在这部分内容中，要求动脑思考的内容比较多，所以对于本节课内容只在于让学生了解网站设计的完整过程，不能急于求成，暂时只要他们能够策划出简单的网站就可以了。

五、教学对象分析

本节课的教学对象为高一年级第二学期的学生。在上学期，他们已经掌握了信息技术的基础知识、windows的基本操作、字处理软件的应用，掌握了上网的相关操作（如：接入Internet、浏览网页，从因特网上获取信息、收发电子邮件等等），通过观察，他们对上网很感兴趣。很多学生曾问我：老师，这些东西是从哪里来的呀？是谁做的呀？怎样发布到Internet上的呀？那些动画是怎么做的呀？等等。由此可见，他们对网站的设计也一定有兴趣、有信心。为了使本节课内容更好的让学生吸收，我特提前（上节课）给他们介绍了FrontPage软件（包括菜单的介绍、创建站点）。

六、教学资源及辅助手段、工具：

资源：对一个下载好的优秀学生的网站进行分析、讲解 网页制作工具：FrontPage

七、教学过程：

教师活动

引入

在因特网这个信息的海洋中我们发现许许多多内容丰富、创意新颖、设计独特的网站，不知道你见到这样漂亮可人的网站是否有点心动，你是否也想动手做一个吗？

提出问题：你们是否找到了适合你口味的网站或特别能打动你的主页？选择几个学生来说说。

正课

首先打开自己先前做好的网站，一定要做的漂亮，能吸引住学生的注意力，同时也让学生表现出对你的钦佩，对你的崇拜，这样学生才有信心跟你学，并且学好。

问题1：这是一个什么样的网站？（指内容）

问题2：这个网站提供了一些什么功能？

问题3：想不想知道这个网站我花了多少时间完成的吗？

首先让学生猜猜老师花了多少时间完成的。以第三个问题引出了我们今天要讲的内容，告诉学生制作一个网站应该如何着手，需要分成多少个步骤来完成。首先要确定主题，然后查找资料，最后再动手制作。所以说，制作一个网站是一个长期的工作，而不是一朝一夕之事，只有通过不断地改进、完善才能做出一个成功的网站。

1、做好需求分析

学生活动

学生都在说着自己看到的一些优秀网站，其中包括内容方面、界面方面、设计风格方面等等。

对于亲自动手制作一个网站，学生表现出了很大的兴趣，都想一显身手。

学生的目光一下子集中到了这个网站上了。

学生通过观察，依次回答了老师提出的问题。

学生都在议论纷纷，有的说2~3天，有的说5~6天，有的说……

在建站之前首先要明确的是建站的目的和网站将要面对的对象，在课堂中做一个简单的调查，进行归纳总结。

2、确定网站的主题。

创建网站前要先确定站点的主题，只有主题确定之后才会有目的的去寻找相关的资料，否则就像一只无头苍蝇到处乱窜，所以确定站点的主题是非常重要的，同学要慎重考虑好。

思考：你们想做一个关于什么内容的网站呢？可以从自身的兴趣、特长、爱好出发来确定站点的主题。

通过这么一个小思考，活跃了课堂的学生纷纷提出了自己的想法 学生议论：

有的学生对散文诗比较感兴趣，想做一个关于散文诗欣赏的网站，有的学生是追星族，想做一个关于明星、歌星方面的网站，有的学生对军事很感兴趣，所以想做一个关于军事武器方面的网站，各有气氛，同时也为今后的工作提前做了准备。各的想法，可谓包罗万象。

小结：站点的主题最好是自己擅长或者喜爱的内容，这样制作过程中才不会觉得无聊或力不从心，制作的内容才能够丰富多彩，更能吸引人。

3、确定网站名称

将学生根据主题的选择的相似，分成小组开展活动。选择恰当的网站名称是建

让学生不断地到报刊、网上收设网站的重要步骤。列出一些让学生评价。集资料、图像、图标等素材，将学小结：给网站取名就像是给人取名、生收集到的优秀的素材放在校园给公司取名一样，第一要与主题紧密相关，网上供大家使用。第二要有意义，第三要上口、悦耳、易记。此外取名时还要注意你的名称是否合法、合理、合情。

三、布置任务：

①要根据自己的情况确定好网站的主题和名称。

②根据主题收集一些资料。

第五篇：学校网站的规划与设计

摘要：做好一个网站，可以全面宣传，展示学校风采、优点与特色，发布学校的活动安排等信息内容，使学生及家长增加对学校的了解，增强学生、家长与学校之间的联系，在Internet网上，让学生及家长及时得到学校发布的重要信息，同时也帮助了学校完成部分教学事务，提高办事效率,给学生、家长与学校最方便的联系桥梁。在这里学生及家长也可以提出意见及想法，互通教学之间的意见想法，更加有效的提高教学质量，学生需要哪样的教学方式能够更好的吸收与接纳？这些都能成为学校的参考，以便更加的提高学校的办学及教学水平。

关键字： Internet 校园网 ASP技术

Dreamweaver

一、校园网发展现状

Internet的迅速发展，极大地推动了我国的网络建设。我国先后建立了中科院互联网(NCFC)、中国教育科研网(CERNET)、中国公用计算机互联网(CHINANET)、中国金桥信息网(CH工NAGBN)等四大网络。特别是中国教育科研网(CERNET)的发展，极大地促进了学校校园网的建设。社会网络大环境的影响、有关教育部门的支持、校领导的重视以及教师和学生的积极要求，使得校园网的建设如鱼得水，非常顺利。据统计己经建成的校园网，其布点范围从几百个到几千个不等，在技术上是跟得上国际发展潮流的。校园网的开通，不仅改变了传统的教学模式、教学方法和教学手段，促进了教育观念和教学思想的转变，而且拓宽了教师和学生的视野，有利于培养学生的创造性思维，提高学生获取信息、分析信息、处理信息的能力和适应现代社会的能力。校园网的开通，从根本上促进了教学、科研人员之间的信息交流、资源共享、科学计算和科研合作，成为学校教育和科研工作最重要的基础设施。

中国教育和科研计算机网的建设直接引导和推动了校园网。截至目前，这一网络已经通达内地的160个城市，联网的教育机构和科研单位达900多个，联网主机120万台，网络用户800多万，成为国内仅次于中国电信的第二大互联网络。中国教育和科研计算机网己经成为世界上最庞大的‘校园网’。

在这样的一个背景下，我校本着从实际出发、节省的原则，在条件具备的前提下，决定组建校园网络，与Internet互连，并自行建立自己的校园网站（http://www.xiexiebang.com）为满足我校日益增长的办学、科研、培训的需要。

二、规划原则

经过一学期的准备，本着以学校教育教学需求为前提，讲究方便、实用和易管的原则，现初步将学校网站栏目做如下规划和设置：

（一）首页规划

网站首页，就是用户进入网站看到的第一个网页。首页是网站的门面，首页制作质量直接影响到用户对网站的整个印象。一般首页制作占整个制作时间的30%左右，所以在首页制作时要多花些功夫。按照网页设计的版块、字体和色彩搭配方案对首页进行“精雕细刻”。使首页达到简洁明快的风格，简单的表格，令人愉快的色彩搭配，协调的文字，浏览速度快，易于导航，经常保持新鲜感，使访问者赏心悦目。网站主页采用静、动互相结合的方式，即静态的主画面和动态的图片相结合，体现学校的勃勃生气，静态主页方式介绍学校风采、优点特色、信息发布，对于新闻留言等，就得利用ＡＳＰ与数据库结合的技术建立数据库查询管理系统，采用交互式的动态的web画面来实现。

（1）、首页内容模块。

首页分模块进行制作，一般的站点有这样一些内容模块：站点名称、动态广告条、主菜单、新闻、校长寄语、网站导航、校园公告、友情链接等。首页选择哪些模块，实现哪些功能，是否需要添加其它模块，这都根据学校网站主题和内容来确定。内容模块确定后，按照首页设计的版面，发挥网页制作人员的创意和想象力，制作出比较满意的网页。

（2）根据上面的设计思想进行分析，按照系统开发的基本观点对网站进行分解，从内容上可对网站作如下划分：

学校概况：包括学校概况、学校荣誉、领导风采、校园快讯以及部分图片

等内容。

教学动态：包括学期计划、考试信息、教研动态、实验安排、教学总结等

子项栏目。

教学资源：包括教学研究、教学论文、教学课件、经验交流等子项栏目。

教师之窗：包括教工生活、教师主页、教师风采、教育信息、教研组信息

等子项。

学校天地：包括校园生活、校园之星、学生风采、学生作品、学习交流等

子项。网络德育：包括规章制度、德育科研、心理辅导、社会活动、教育法规、学生评语、住校生管理、国旗下讲话等子项。

卫生保健：包括送你健康、生活保健、生活急救、健康课程、心理茶室等栏目。

电脑学堂：包括新手学堂、软件应用、硬件知识、网页制作、软件下载等

栏目。

校园留言：通过留言板与学生家长联系，有利于家校沟通，意见互换。

三、开发工具的选用及介绍

Active Server Pages：“动态服务器网页”，一般简称为“ASP”，ASP之所以能受到大家的重视与使用的原因，主要在于所产生的执行结果都是标准的HTML格式，而且这些程序是在网络服务端中执行，使用一般的浏览器（如IE 或Netscape）都可以正确地获得ASP的“执行”结果，并且将这ASP执行的结果直接在浏览器中“浏览”，不像VBScript或 JavaScript是在客户端（Client）的浏览器上执行，若使用VBScript来设计程序，客户端（Ｃlient）在ＩＥ浏览器中可以显示程序执行的结果，可是，客户端（Ｃlient）若使用Netscape浏览器就无法显示VBScript的执行结果。

常用的一般代码编辑程序，如Windows记事本，就可以编辑。当然，其他网页发展工具，例如，FrontPage Express、ＦrontPage、Dreamweaver等也都可以；不过还是建议你用记事本来编写，既省时又方便，调试可选用Dreamweaver等可视编辑软件。当然你若全是静态页面。可不用asp动态服务器技术。而我校编写的网页功能较多，所以我选择了ASP结合Dreamweaver组建了本网站。

四、制作技巧

（一）版面设计

版面设计是整个网站构思过程中最重要的一部分，因为好的版面布局给浏览者不但会留下好的第一印象，而且还会带来一个好的心情。学校站点的版面设计可以是明快、亮丽型；可以是古朴、大方型；可以是凝重、整齐型等。

就像传统的报刊杂志编辑一样，可以将网页看作一张报纸、一本杂志来进行排版布局。虽然动态网页技术飞速发展，但是静态的网页版面设计基础依然是必须学习和掌握的。它们的基本原理是共通的，领会要点，便可举一反三，触类旁通。

（1）创意草案

草案的形成决定着将来网页的基本面貌，类似一个设计创意。它往往来自于一些现有设计作品、图形图像素材的组合、改造、加工。其思维方式有两种：借鉴模仿和逆向重组。

构思伊始，设计者可能会受现存的一些网页设计的影响，借鉴现有的设计样式是很自然的事，但不能照抄照搬。吸取成功作品中的一些视觉元素及其组合方式，加入自己的新元素，形成新的组合，这种借鉴模仿可以比较顺利地产生网页方案的雏形。逆向重组是利用反向思维来完成设计和创作，把现有作品的视觉元素的性质加以改变、重组，与自己的素材结合而产生新的设计作品。比如，原有作品的背景色是黑色的，你把它改成白色，就会变成另外一个样子。也就是说将某一视觉元素中的某一描述参数加以改变，从而实现新的设计作品。

由此可见，设计者的工作很像作曲家创作音乐作品，需要从民间音乐中寻找素材，把一首歌谣创作成一首乐曲，把单独的乐曲发展成一个乐章。应该说明的是，借鉴模仿和逆向重组都是对视觉元素的量的改变，至于变化到什么程度，需要有专业的眼光、素养才能把握住。你可以用一张白纸和一支铅笔，把你最初的创意画出来。这属于创造阶段，不讲究细腻工整，不必考虑细节，只以粗陋的线条勾画出创意的轮廓即可。尽你的可能多画几张，最后选定一个满意的作为继续创作的脚本。

（2）粗略布局

在草案的基础上，将你确定需要放置的功能模块安排到页面上。功能模块我们在前面已提过，主要包含学校标志、主菜单、新闻、校长寄语、网站导航、校园公告、友情链接等。注意，这里我们必须遵循突出重点、平衡协调的原则，将学校标志、主菜单等最重要的模块放在最显眼、最突出的位置，然后再考虑次要模块的排放。

（3）最后定案

将粗略布局精细化、具体化。在布局过程中，我们可以遵循的原则有： ①平衡：指画面的图像文字的视觉效果在左右、上下几个方位基本相等，分布匀称。

②呼应：在不平衡的布局中的补救措施，使一种元素同时出现在不同的地方，形成相互的联系。

③对比：利用不同的色彩、线条等视觉元素相互映衬，造成画面的多种变化，达到丰富视觉的效果。

④疏密：疏，是指画面中元素稀少(甚至空白)的部分；密，是指画面中元素繁多的部分，在网页设计中就是空白的处理运用，太满、太密、太平均是任何版式设计的大忌，适当的疏密搭配可以使画面产生节奏感，体现出网站的格调与品位。

以上的设计原则，虽然枯燥，但是如果能运用到页面布局里，效果就大不一样了。比如，网页的白色背景太虚，则可以加些色块；版面零散，可以用线条和符号串联；左面文字过多，右面则可以插一张图片保持平衡；经过不断的尝试和推敲，一个崭新的设计方案便完成了。若你的美学差一点，也可请个美学好点的老师帮助你。

（二）图文及页面的制作

网页制作要图文并茂，很多文字性的内容如标题、主菜单栏目名都可以处理成图像形式，这不但克服了不同平台上的文字兼容性问题，而且页面也显得非常美观、精制，引人入胜，对访问者有较强的吸引力。

文字处理方法和Word 相同,在这里就不再多述。图片可以通过扫描仪或数码相机获得，再复制到网页上直接使用，也可以将图片经过Photoshop 或Fireworks艺术加工后再使用。动画可以自己动手用Flash 制作，也可以在互联网的动画宝库中下载。当然使用的前提是要和自己做的色调一样。

制作时应该注意：为了使页面浏览下载速度快，就要尽可能地减少页面的数据量，减少图像和动画的数量，特别是大的图像和动画；尽量减少表格嵌套，不要把所有的内容都放在一个大表格里；页面保存必须在根目录下各建和页面名称相同的文件夹，以存放每一页的图片等网页素材，这也方便了我们以后的管理和维护。

子页的制作，其方法和首页制作相同，都要遵循首页制作一些规则。在制作一级子页时，首先要考虑子页的个数和每个子页的名称，然后将制作好的首页分别另存为每个一级子页的名称，把它们作为新建的一级子页面，这样，一级子页面的标题和导航以及版面信息就设置完毕。只需要在相应的子页面里修改相应的内容即可，从而大大地提高了子页面的制作速度。一级子页页面的显示尽量采用新建窗口的形式，这使用户在等待页面下载的同时还可以继续浏览其它内容。

在网页制作方面还有许多技术细节，诸如如何适应不同的浏览器，在不同的分辨率下保持网页不变形，如何减少垃圾代码等等。首页相比其它页面来说，技术上要求更加严格，决不能出错。现在有不少网站教学类的网站，如：网页教学网（http://www.xiexiebang.com）可多多参考，不断提升自己的制作水平。

五、网页（站）的调试 一切前期工作做好后，我们要做的事就是要调试网页，看看有没有做的不理想，不成功的地方，网页的调试，我们经常使用的方法有多种，如直接本机预览、在网络上应用网页代码调试器在线预览（http://www.tool.la/WebDebugger）、安装iis服务器组件调试。现为大家介绍其中两种我们经常用的方法。

（一）本机直接预览

本机直接预览就是在制作时直接按预览按扭。如在Dreamweaver中，选择“文件”→“在浏览器中预览” →“iexplore”即可。或直接按快捷键“F12”亦可。还可在根目录中找到想要预览的htm文件，双击就可预览。

（二）安装iis服务器组件调试

IIS（Internet Information Server，互联网信息服务）是一种Web（网页）服务组件，其中包括Web服务器、FTP服务器、NNTP服务器和SMTP服务器，分别用于网页浏览、文件传输、新闻服务和邮件发送等方面，它使得在网络（包括互联网和局域网）上发布信息成了一件很容易的事。

IIS组件的添加我们在此不再赘述，安装好iis后，点击“开始”→“程序” →“管理工具” →“Internet信息服务”，选择“默认网站”右击，选择“属性”修改主目录。转到“主目录”窗口，再在“本地路径”输入（或用“浏览”按钮选择）好自己网页所在的“D:Wyweb”目录。若是动态首页要自行添加首页文件名：转到“文档”窗口，再按“添加”按钮，根据提示在“默认文档名”后添加自己网页的首页文件名“index.asp”。否则无法预览。

安装好后，我们打开IE浏览器，在地址栏输入http://127.0.0.1或http:// localhost之后再按回车键，此时就能够调出你自己网页的首页，则说明设置成功！这时便可像在Internet上一样访问自己的页面。若有想要修改的地方，找到相应的htm文件名重新修改即可，直到满意为至。

总之，做好一个网站，可以全面宣传，展示学校风采、优点与特色，发布学校的活动安排等信息内容，使学生及家长增加对学校的了解，增强学生、家长与学校之间的联系，在Internet网上，让学生及家长及时得到学校发布的重要信息，同时也帮助了学校完成部分教学事务，提高办事效率,给学生、家长与学校最方便的联系桥梁。在这里学生及家长也可以提出意见及想法，互通教学之间的意见想法，更加有效的提高教学质量，学生需要哪样的教学方式能够更好的吸收与接纳？这些都能成为学校的参考，以便更加的提高学校的办学及教学水平。