下面是小编为大家整理的网页设计教学，本文共13篇，仅供参考，喜欢可以收藏与分享哟!
篇1：网页设计教学毕业论文
【摘要】
本文以就业信息管理平台为例，研究网页设计中表格与层的应用，提出表格与层可以让网页的布局整齐美观，将网页中的文字、图片、动画等众多元素有条理地统一组织起来。虽然表格的使用整体上是好的，但在一些细节的美化上表格的设计就难以做到，这就要采用层来搭配表格的设计解决相应的排版美化问题。
【关键词】网页设计；表格；层；就业信息管理平台
随着信息技术的日新月异，网页设计的重要性也逐渐凸显，如何快速、方便地设计出相关的网页、网站就显得非常重要。在网页设计与制作的教学过程中，如何让学生快速地掌握网页设计的一些排版技巧是非常有必要的。因此，笔者结合网页设计与制作教学中的一些体会，并通过就业信息管理平台的设计案例，探索网页设计中表格与ApDiv（层）的排版设计技巧。
一、Dreamweavercs简介
Dreamweavercs是由Adobe公司推出的一套拥有可视化编辑界面，用于制作并编辑网站和移动应用程序的网页设计软件。目前，最新的版本为DreamweaverCC，网页设计软件的功能强大。对网页的浏览已经是我们生活中的不可分割的一部分，网页作为网络信息传播的主要载体，其设计也为大家所关注。网页设计软件的种类有很多，但最出名、最专业的网页设计工具，非Dreamweaver莫属。它是著名的“所见即所得”的可视化网站开发工具，目前的网页设计几乎都采用Dreamweaver来设计。Dreamweaver不仅提供了强大的网页编辑功能，而且还提供了网页的上传工具。利用FTP进行大文件的传输，节省了文件的传输时间，它是一个集网页创作和文件传输管理等多功能的设计工具。
二、表格与层在网页设计中的使用
在就业信息管理平台的设计中，采用程序设计，可以很好地提高网页的下载与浏览速度，但对于初学者来说，程序设计是一件头痛的事。因此，如何利用表格与层来进行设计，就非常重要。网页设计中的排版有很多种方法，其中表格结合层的使用排版是最基本也是最有效的方法。表格与层，对职业院校的学生来说，非常容易学，而且使用也非常方便，做出来的网页也非常的漂亮，因此，在网页设计中表格与层是非常重要的。
（一）网页设计中表格的使用。在网页设计中，利用表格的排版，它的整体效果好是毋庸置疑的，表格在网页中的位置可以通过表格属性来进行设置。在Dreamweaver中，页面内容的设计、排版主要是通过表格来完成。通过表格的相互嵌套、合并与拆分，可以将自己构思好的页面完整地表现出来。表格在网页中的重要作用，主要是它在不同的显示上，可以根据网页的大小、显示器的大小进行相应的变化。并始终都处于浏览的相对位置，完整地把内容显示出来，具有很好的兼容性。因此，使用表格排版比较规范，整体性强，可以让网页的设计显得非常的整齐，达到想要的效果。但由于表格的整体性，在一些细微的地方以及操作上还不够细化，在内容的设计表现上还不够丰富。
（二）网页设计中层的使用。层的使用在网页设计中也是非常的普遍，由于它的定位比较精确，又是一种可视化操作元素，它的使用让网页增加了丰富的表现。层与表格的使用基本差不多，但在位置的定位上要比表格方便很多，这也是层的主要优点。在网页设计中，文本、图像、表格等元素只能固定其位置，不能相互叠加。如果要想使多个元素进行叠加或者定位要精确，在这种情况下，就需要使用层来进行设置。层具有很多表格所不具备的特点，如层的重叠、移动、隐藏等一些功能，层还可以添加一些动作行为，让层的内容表现更加丰富，也正是基于这一点，层成了网页设计中一个重要的元素。层的这些特点有助于设计思维不受局限，从而在设计上有很大的空间。由于它是一种流元素，层在具有上述优点的同时，也存在着一些不可避免的缺陷，例如层在网页中的定位不会随着浏览器大小的变化而变化，层的位置是固定不动的，在这样的情况下就失去了层在网页设计布局中的意义。
（三）就业信息管理平台中表格与层的结合使用。表格与层的结合使用才能更好地体现出它们的优势，层也才能更好地体现出它在网页设计中的强大功能。在网页设计中，如何做到表格跟层的统一、层与表格融为一个整体，这就要用到层在表格中的插入操作，以及层的嵌套使用，下面以就业信息管理平台中制作下拉菜单为例来设计。首先，在网页中插入一个三行一列的表格，在表格的第一行插入一张图片，作为网页设计的Logo，而在第二行中插入一个嵌套的一行五列的表格作为网页的导航条，表格的第三行作为主要内容的设计与排版。
三、表格与层的正确应用表格与层
在网页设计中虽然有强大的功能，但在使用的过程中也不能太随意，如果随意地使用就会增加浏览器的负担，浏览下载的速度就会变慢，影响网页的浏览。
（一）表格布局出现的问题。在网页设计中，利用表格排版的时候，不能使用一个大大的表格铺满整个页面，这样不利于浏览器的打开。浏览器打开一个表格，是要等一个表格全部下载完成，这样就需要很长的时间来打开这个网页。在表格的嵌套中，也不能无限制地嵌套下去，一般表格的嵌套，应该控制在最多三层表格，如果嵌套的表格太多，打开时也会消耗大量的资源，不利于网页的打开。有数据统计，一般浏览者打开网页的等待时间为7秒以内。如何解决这个问题，主要采用拆分表格的方法，将一个大的表格拆分成几个小的表格，并要尽可能地避免表格的层层嵌套。
（二）层布局出现的偏差。在网页的设计中，层的单独使用没有多大的意义，因为层是流元素，不会随着网页浏览器的变化而变化，它的位置是固定的，不会产生移动。虽然有时候，我们在利用表格与层排版的时候，看起来很整齐，但一预览就完全错位了，根本不是想要的效果。如何才能使层与页面中的表格一样，能够随浏览器的变化而产生相对位置上的变化，这就需要先使用表格对整个网页的整体进行规划，然后添加一个层到表格中的一个单元格中，作为一个父层。操作的方法为：菜单栏中的插入―布局对象―ApDiv，插入后，这个层的位置左、上必须为空，没有任何内容。然后，其他的子层就通过这个父层进行嵌套，在这里必须强调的是，父层必须通过菜单栏的插入，不能通过用鼠标画出来的方式操作。采用这种方法设置层后，无论浏览器的窗口大小如何变化，它都会跟着变化，体现了与表格成为一个整体，在浏览时就不会产生位置上的移动，因此，层只有结合表格的使用才能更好地丰富网页内容。
总之，在网页设计中，表格与层是非常重要的元素，但在布局设计中，只有把表格与层结合使用，才能让网页的布局精美与丰富。网页中的内容虽然很重要，但网页中的设计与布局才是最重要的。因此，通过合理的布局设置，特别是主页设计要整齐美观，才可能更好地吸引读者。因此，在平时的网页设计中，要多看一些优秀网站的排版设计，只有这样，才能更好地提高自己的网页设计能力。
【参考文献】
［1］俞燕丹．项目教学法在《网页设计与制作》课程中的实践研究［J］．新课程研究（中旬刊），（10）
［2］韩媛媛．浅谈Dreamweaver在网页设计中的应用［J］．信息与电脑，（7）
［3］周金容．网页制作过程与技巧［J］．软件导刊，2016（15）
[网页设计教学毕业论文]
篇2：网页设计教学反思
本课的教学目标是掌握使用FrontPage制作网页的基本方法；重点是掌握在网页中插入文字和图片的方法；难点在于插入表格规划网页的结构。
课堂以自主探究的模式展开，同学们在以往的学习中已掌握了在Word中插入表格、图片等方法，在FrontPage中他们很顺利地完成了教材呈现的目标。基本掌握了单张网页的制作方法。
接下来就是突破难点的训练。问题集中到如何插入一个布局表格来实现规划好的结构。而教材上完全没有提示学生探究FrontPage “表格”与Word “表格” 功能的异同。少数同学开始试着插入适合自己网页结构的框架表格，而大部分的同学则完全没有考虑结构问题，做起直接的搬移，将FrontPage当成Word来用。直到出现无法将图片，文字放置到设想位置时，才意识到教材P20中“FrontPage通常用表格来安排网页中各种内容（文章、图形等）的版面位置。”这问话的含义是否明确。急着寻求解决的办法。我便让哪些意识到要先插入适当结构框架表的学生来说说他们的想法。并及时出示与学生思维一致的演示片，将探究FrontPage “表格”功能的提示呈现给他们。同时利用极域教室的功能，向全体同学展示同伴的探究结果，让学生不同的思绪方式及智慧产生碰撞，相互启示，顺利突破教学难点。
看到同学们找到解决问题的方法后，抑制不住的兴奋与喜悦，也让我产生了如下的思考：这节课，反映出大多数学生的自主学习能力较弱，而这与学生的学习体验是分不开的。自我从事教育工作，观摩学习的课，几乎整节课直到最后练习才会有要求学生打开课本的时候。有的甚至根本一节课不需要学生打开课本。所有知识都在老师的板书或演示文稿中。这或许是大班教学为确保进度和质量的无奈吧。多年来，我一直在思考课本对于学生的作用何在。书籍是人类智慧的结晶，如果学生没能学会自己从书籍中获取知识的方法，训练出举一反三的能力，对于他们的终身学习应该不能不说是缺失吧。
教师的指导是灌输或诱导，也应该成为教师备课设计时需仔细考量的要点。稍有欠缺，就会陷入灌输的泥沼。一定要对学生情况进行充分的分析，预计到课堂将会出现的情景，找准切入点，呈现适当的提示和点拨，让他们体验到只有积极自主探究和吸纳同伴智慧才能成就自己智力开发和知识积累。成为一名会学习的学生。
篇3：网页设计教学反思
今天上午，我在高二（1）班上了一节公开课，上课的内容是《体验网站规划与设计》。整个教学过程以师生访问分析网站为主线，采取分组讨论、小组活动进行。教学中以任务驱动、自主学习，交流学习以及引领展示的模式，将规划过程分解为几个任务，根据所学知识，完成对网站规划选题、域名、栏目及艺术风格的规划与设计进行学习，并将各小组任务完成的情况以学案—《网站规划与设计方案》的形式呈现出来。通过展示学生设计方案，对学生成果给予评价与肯定，激发学生进一步学习的兴趣，培养学生主动思考、积极参加团结协作。
成功之处，本节课教学环节完整，对三维目标把握较好，同时认真的对学情进行了分析。本节课，对学高二火箭班的学生，我注重了学生发散性思维、语言表达能力、逻辑推理思维的培养，同时引导学生学会鉴赏、学生聆听、学会尊重，学生在较短的时间内能够很好的完成教学各环节的实践，最终形成了完成的方案，且能很好的陈述。
不足之处，本节课，整个教学过程都是需要网络支撑，由于网络突然出现问题，而心中又想达到理想的课堂，希望给学生一个完整的教学过程，导致课堂的暂时中断，而此后压缩了学生讨论和展示成果的一些时间，后面的教学时间和节奏略显苍促，课堂小节也不是很到位。
经验总结：在教学过程中，我也考虑到网络和电的问题，但是心向往对课堂存理想化状态，实际上不然，不想发现的事终究发生了，以此，不管是哪种级别的公开课，都要着两种备案才可，以免出现课堂教学事故而让自己陷入囧境。
篇4：网页设计教学反思
本课主要是让学生在Frontpage中使用页面框架来制作一个网页。利用Frontpage制作网页，这部分内容关于操作技能方面对于七年级的学生来说难度并不算大，在学习过word的基础上，大部分学生能够利用知识迁移比较快的掌握制作网页的一般方法。
课一开始，我就让学生了解使用页面框架制作网页的优点，从而激发学生学习的兴趣。在前面经过Frontpage几节课的学习后，大部分学生已经掌握了用表格制作网站的一般步骤，但是对于框架网页学生了解的不多，如果单纯的讲解框架网页概念的话，学生难以理解，因此通过对学生经常浏览的网站的介绍，让学生对框架网页产生一个比较感性的认识，有通过我的操作，让学生感受到框架网页较普通网页的优势。于是我引导学生根据内容选择合适的框架页面，由于所选的内容是“中国四大名著”和“欧洲四大名著”，选择“垂直拆分”的框架网页来得更合适。
由于时间关系，我在课前已经帮学生准备好了关于“中国四大名著”和“欧洲四大名著”的相关图片和资料。学生在选择好合适的框架页面后就可以开始制作了。制作一个完整的网页，内容是比较多的，因此学生在进行网页制作时，可以按老师提供的WORD提示来进行制作。当然学生也可以自行选择制作的方法，让学生可以发挥自己的想象，制作出个性化的网页。因为本节课内容的知识点比较多，制作网页的过程中要用到插入滚动字幕，制作超链接等内容，所以根据这一实际情况，我提供了一些小提示来供学生参考，这种形式的帮助达到了很好的教学效果。同时采取小组合作的方式来完成任务，能显著提高课堂的效率。
保存网页是最重要的一个步骤，一部分学生保存后发现，有的内容都是无法显示。因为框架网页的保存和其他普通网页的保存是不同的，所以我在一开始就让学生感受这一不同点，起到了很好的预防作用，只有很少的学生保存时发生错误。在这个任务中，除了让学生充分了解框架网页保存的特殊性，也要让学生知道，在新建框架网页时的一般方法。
通过本课的学习，班上的学生基本上掌握了使用页面框架制作网页的一般方法。
篇5：网页设计教学反思
“怎样才能调动学生的积极性与兴趣？”，“如何才能在轻松和有趣的教学环境中到达所设定的教学目标？”……，在每次上课前，我都在问自己。在信息技术教学中，我觉得最重要的一点，就是培养学生怎样学“信息技术”的“习惯”！
“操作”是信息技术教学的核心，“创新”是信息技术教学的目标，“协作”是信息技术教学的要求，“探究”是信息技术教学的方法。我紧紧围绕这四个方面去组织教学内容，培养学生各种良好的学习习惯，达到教学目的。
通过认真学习上课的内容，找出重点，难点以及学生难记，易忘，易错的步骤和操作，然后，以上面所提到的`“四点”来设计一系列的教学任务，把本节课所要传授的知识点，能力，思想，素质融入到这一个个小任务中去，争取让学生在完成这些有趣的任务的同时，学到了该学的东西。教学内容可以设计成下面五个小任务：
1：欣赏一些优秀的班级主页。（师生一起评析，讲解其中的一些技巧）
2：查找自己喜欢的网页素材。（教师已在学生机准备好各种素材，让学生自己寻找自己喜欢的素材，培养其“定位感”。）
3：班级主页设计。（允许学生之间交流）
4：小组评价。（每小组推荐一名最好的作品，然后，全班一起评价。强调协作，团结，包容，肯定他人成绩的精神）每个任务都强调培养学生学习信息技术的良好习惯，同时层层深入，直至达到目的。
首先，让学生欣赏一些优秀的班级主页，当那些精美，富有创意，图、文、声并茂的网页呈现在学生面前时，他们都“哇”的一声，学习兴趣马上激发出来，课堂氛围也活跃起来了。这时，老师再顺势引导学生如何欣赏，他们各自有什么特点，如果是你自己来设计，该怎样做等等。接下来，就安排学生自己去查找喜欢的网页素材，为下一任务做准备，同时培养学生的“探究”精神和“定位素材”的能力。而在“网页设计”任务时，允许学生交流，相互帮助，老师对有困难的学生进行个别技术上的辅导，尽量让学生发挥自己的想象力去创造出富有个人特色，与众不同的网页来。最后一个任务也非常重要，老师事先给每位学生发一张“网页评价表”，让他们对小组推荐出来的作品进行评价。引导他们形成正确的审美观，以及肯定他人劳动成果的精神，提高他们的综合素质。
篇6：网页设计教学心得体会
网页设计教学心得体会
通过一个学期的学习和课堂讲授，要我体会到要做好一个网页不容易，当然要把这门课程讲好更不容易。首先，需要足够的耐心去了解学生的学习情况；其次，老师要有深厚的功力，即在网页制作领域要能深入市场需求把握市场动向以此来决定教学方向；最后，切合实际的讲学，深入浅出的教学模式能让学生更能把握知识，并能熟练运用。总而言之，要掌握网页设计的基础知识并且成为一名网页设计师也是一个重大挑战！
分析现在的网页制作流程，基本上可以分为两大模块：前台美工和编写网站后台。针对前台美工来说，更注重的是学生的设计理念，颜色的搭配，整体的规划，以及增色的动画效果，因此要求学生有一定的艺术欣赏能力和艺术创作意识，但是针对计算机操作来说，工具的运用相对简单。因此我们在教学过程中，学生愿意钻研，也愿意学习，但是在短短的一个多月的时间内学习软件的运用况且不易，更如何谈及艺术情操的陶冶！在学生的学习过程中也出现意犹未尽的现象，像是没有学够，学的不够尽兴，特备是对于动画爱好者来说，仅仅入门对于他们来说还远远不够。而针对另外一个模块，更适合计算机专业的学生，也就是编
写网站后台，但是相对来说知识稍微枯燥，且要求学生动脑思考，有一定的逻辑思维能力和进取精神。当然也有很多学生对这个很感兴趣，热爱编程，热爱程序的学习，所以学习起来也得心应手，屡试不爽！
因此我个人认为，对于我们学生来说关键是要精于一门，精于一项，现实社会中也很缺乏所谓的专业精英。网站的制作通常都是细化分工，团队合作，共同努力实现网站的创建，所以我也鼓励学生能通于某项，深入学习，正所谓“深挖井，少挖坑”。
老师给与学生合理的引导，更要加强自身的素质修养，提高自己的知识水准。
在整个教学过程中，我自己也要检讨自己，针对网页设计来说，我仅仅是带领学生入门，没有能够让学生的学习兴趣和自身的潜力完全释放出来。我从来都是相信我的学生是最聪明的学生，我也再三强调他们是我碰到的很聪明的一批学生，只要努力，劳动总是会有收获的！但是在教学过程中，个人还缺少更高的艺术修养和艺术创造能力，但是我一直在追求艺术的完美，所以还要不断的学习，不但实现个人的理想和爱好还要完成教学的需求；另外就是技术上还需要完善，也需要和有经验的老师多交流，多沟通。我相信只有站在一定的高度去看整个项目的实现，会更通俗易懂也更有说服力，所以也不能说都是学生的原因，归结起来还是要提高自己的知识水平和业务素质！
正所谓“巧妇难为无米之炊”，所以，提高个人知识水平和业务素质也迫在眉睫。教学过程中不满足，不浮躁，努力进取，积极上进，多向有经验的老师请教。
总而言之，在我们这门课中一共涉及的知识面也宽泛，就软件来说大概就有四个，所以也加大了学生学习的难度。但这个学期结束后，访问学生的体会，基本上一致说：知识太多，难以学习精通，虽然提起很大兴趣，但是知识还有待深入。其实不仅仅是学生，对于老师来说何尝又不是呢，所有要接触的知识中，每一个软件基本上都够学习一个学期的，而我们要在短短的一个学期中接触到这么多知识也难怪学生反应知识多。整个学期像是在不断学习新的软件，一个软件刚刚入门就又要再开始另外一个软件的学习。学习强度大，虽然知识不是很难把握，但是知识零碎，需要反复学习，反复巩固，一个学期下来，基础知识基本上完，但根本没有复习时间，也没有时间要学生通过以前的知识来开发自己的网站。所以，我个人认为：这门课的学习还需要进一步加强并巩固，能有一个综合的运用，或者是通过一个网站的建设让学生能够体会到核心的东西。
针对全体学生来说，聪明程度相当，但学习兴趣层次不同，大部分学生只愿意听后选择性的接受，而没有知识的创新利用，或者是没有下去自学，巩固知识，单一的只是听和做。部分学习根据自己的作品提出一两点问题，但是程度差的同学，上完课后根本就直接把书丢在一边置之不理。综合学生的学习态度问题，个人认为还需要加强考核制度，从严制学，宽进严出，严肃考风！
另外，针对这个学期的网页制作课程，在学生的学习制作过程中我也有自己的一点意见和看法：
1.网页制作要简洁大方。网站在设计过程中以简洁大方为主，配合合理的颜色搭配和主题内容的诠释，给访问者赏心悦目的感觉；而避免过多的动画和帧的过多运用，以及不明确的导航，杂乱的颜色，没有主题的胡编乱造。
2.网站风格要统一。所有的图像、文字，包括像背景颜色、区分线、字体、标题、注脚什么的，要统一风格，贯穿全站。这样子读者看起来舒服、顺畅，也会对你的网站留下一个“很专业”的印象。知识运用中要大量配合合理的模板、CSS样式的运用而避免在网页中反复的字体样式重定义、颜色的胡乱运用，参差不齐给人杂乱的感觉。
3.网站布局合理。避免一些“拿来主义”，一些学生为了设计方便，拿网上流行的模版做网页，做出的网页几乎是千篇 一律，没有特色，虽然完成了网页的制作，但是毕竟不是出自个人之手，知识缺乏进一步巩固，且让浏览者产生厌倦。另外导航清晰化，能引领浏览者阅读网页，思路一定要清晰，避免交叉链接。
4.网站容量要小。虽然网页更加美观可以吸引浏览者，但是图片，动画容量大会影响浏览速度，所以一定要注意网络容量问题。图片尽量压缩，多采用单一色，或者简单的颜色；动画要尽量简洁实用，用最少的帧做出最漂亮实用的'动画，给网页增色。
5.网站实现严谨。动态网页的制作在这里主要是通过ASP来完成，首先数据库的设计要合理，避免反复修改，影响调用。代码的写入要严谨，比如考虑密码的安全性，以及注册用户写入一些非法字符，或者是洪水般的多用户的点击是否对服务器造成威胁等问题，尽量多方位全面的考虑问题，写出更实用的网站。
以上是在教学过程中遇到的一些知识点或是具体运用中遇到的一些问题，当然也是学生的上机过程中经常存在的问题。
但是总体来说，通过整个学期网页制作的学习，学生已经了解了网页制作所需要的基本技术，也掌握了网页制作的基本技能。但由于时间紧迫，知识点多，一些重点难点问题还需要勤加练习，比如：静态网页中的布局和CSS的定义；动态网页中对象的综合运用等等。当然也存在着遗憾，不少学生反映，他们的学习爱好更多的是动画的制作即Flash的学习，而我们只是笼统的讲解，不能完全满足学生的求知欲！当然针对网页制作来说，还需要加强学生的配色观念以及审美观的培养，以及动态网页的实现技术的把握，在很多方面还需要老师和学生们进一步配合，共同学习和实战，以达到知识运用的一定高度！
篇7：网页动态效果教学设计
【教材分析】
本节课内容为北京版初中第五册教材第七章第六节《在网页中使用动态效果》。在此之前，学生已经学习了网页中静态内容的制作，如添加文字和图片、建立超链接、使用主体和表格等等。本节课的主要内容是在学生初步认识并掌握了网页简单制作的基础上，指导学生给网页添加动态图片、滚动字幕、悬停按钮、横幅广告等动态效果，使网页变得丰富多彩。从而完成对网页的修饰和美化，培养学生审美意识和学习兴趣。在以后的课程中还要学习制作交互网页、管理与发布站点等内容。
【学情分析】
1、本课程的主要教学对象是初二年级学生。
2、在学习本课内容前，学生已经学会上网、Word和PowerPoint等软件，还会制作简单的网页，动手能较强，但审美意识较弱。
3、初二学生具有一定的逻辑思维能力，处于这个年龄段的学生思维活跃，对许多事物充满了好奇心，富有探索精神。
【教学重点】
通过学习添加滚动字幕等动态效果，使学生掌握Web组件的使用方法。
【教学难点】
使学生能够合理的使用动态效果，提高其审美意识。
【教学目标】
知识技能目标：
1、了解FrontPage中常用的几种动态效果的作用；
2、学会在网页中插入Flash动画、滚动字幕和悬停按钮，掌握在网页中使用动态效果的方法。
过程与方法目标：
1、体验在网页中使用Web组件的操作过程；
2、能够熟练灵活的美化自己制作的网页，学生初步形成探究学习和小组学习。 情感、态度与价值观目标：
1、形成对网页制作的学习兴趣；
2、提高自身的艺术修养和审美意识。
【教学方法】
教师综合演示（首先教师展示网页和PPT课件，介绍滚动字幕的插入方法） 自主探究（在学习插入悬停按钮和Flash动画的时候，学生自主探究，教师做简
单提示）
合作交流学习（在学生尝试插入Flash动画的时候，可能会遇到困难，可以通过
合作交流解决问题）
【教学资源】
1、有多媒体的计算机教室，电脑装有FrontPage、Flash等相关软件。
2、老师制作好的PPT课件，以及网页成品和教学过程中会用到的相关素材。
3、学生添加动态效果需要使用的网页框架。
【教学活动设计】
一、组织教学（3分钟）
教师通过常规方式组织教学，学生参与。
二、兴趣导入（5分钟）
教师首先做简单的自我介绍，带领学生回忆之前所学的知识。
展示教师做好的网页成品，让学生发现其特别之处，学生会发现网页中的文字图片等都是会移动的，从而引出本节课的学习内容。
设计意图：让学生自己发现问题，激发其求知欲和学习兴趣。
三、教师演示（10分钟）
教师讲解滚动字幕的插入方式，然后学生做练习，并展示学生的练习成果，老师点评。
设计意图：让学生初步接触Web组件，对其有一定了解
四、自主探究（14分钟）
插入悬停按钮和Flash动画，教师不再讲解，只进行简单提示，学生之间进行讨论，并在自己的网页中尝试加入动态效果。由做出来的同学介绍自己的做法，教师进行总结。
设计意图：让学生合作交流，培养学生的语言沟通能力和协作能力，通过自主探
究，把学习的主动权教给学生，让学生学会自己把握学习进度，并培
养其创新精神。
五、总结巩固（5分钟）
在学生基本掌握动态效果的添加方法后，教师总结本节课所讲的内容，帮学生巩固重点、难点。
设计意图：再次加深学生对Web组件的印象，巩固所学知识。
六、作业布置（2分钟）
课下尝试添加动态图片和横幅广告，并给出简单提示。
设计意图：让学生在课下独立完成，可检验其对新知识的掌握程度。
1.《院子》教学设计
2.《狼》教学设计
3.《山行》教学设计
4.教学设计答疑
5.《猫》教学设计
6.《老王》教学设计
7.《Christmas》教学设计
8.《海水》教学设计
9.黄帝教学设计
10.太阳教学设计
篇8： 《网页制作》教学设计
一、教材或教学内容分析
本章内容在本教材中的位置处于第五章,是在文字处理(Word)和网络基础及因特网应用两章之后。学生所学的文字处理软件Word和将要学习的网页制作软件Frontpage同是Microsoft公司的产品,在软件的使用上有很多的共通之处,所以在学习frontpage的时候,很多内容可以让学生自学,而不必面面俱到地在课上讲授。而第四章网络基础及因特网的应用又为学生对网页的理解奠定了基础,学生对网页中的基本元素――文字、图片、动画、声音等都有所了解,而网页的制作就是将这些元素重新组合到网页上,学生要学的就是这种组合的方法。所以说,虽然大多数学生以前都未接触过网页的制作,但有了以上这些基础,学起来就轻松多了。
本章内容按照学生已有的基础,我对教学内容分了一下类,也为教学的组织工作打下一点基础。本章内容主要由网页基础知识、网站的建立和管理、网页的制作、创建超链接、图片的处理、网页框架。
重点是网页的制作和创建超链接,学会了这些就可以开始简单的网页制作了。
难点是网页框架,这部分相互之间关系比较复杂,必要时,老师在对各组个别辅导时,可以给予分别讲解。 这个分类可以为组长安排各个组员的任务提供参考,使分工更加合理。
二、教学对象的分析
信息技术课虽然已经成为初中的必修科目,但是城乡学生之间掌握情况的差异却相当大,条件好一点的初中学生不仅已经熟练掌握了课本上的内容,还对一些常用软件有所了解;而差一点的可以说是从高中开始才正式接触到信息技术知识的学习,他们需要多锻炼、多指导,所以协作学习对学生的学习帮助很大。
三、教学策略的选择及媒体的使用
在教学策略的选择上,我使用的是任务驱动和协作学习相结合的方法。
任务驱动就是要求本章内容学习完之后,每个小组都要完成自己班级网站的制作,并在全班进行评比,选择最好的作为班级主页挂到学校主页上去,这有助于激发学生参与学习的积极性。
协作学习则是让学生在学习过程中互帮互助,用较短的时间、教少的精力学到更多的东西,完成一个集体项目,让他们在学习之后获得成就感。因此在媒体的选择上,我们使用的是TOP2000系统。TOP2000系统有利于教师进行分组教学和学生作品的点评及成果的展示。教学过程开始之前,教师把学生按座位分成四组,每个组都按学生对计算机的掌握程度平均分配,保证每个组都有计算机操作方面比较突出的,也有相对比较差的,使其形成能够互帮互助的学习小组。并由他们自己选出组长各一名,然后由组长根据组员的情况,确定在班级主页制作过程中主要完成什么任务,也就是说起到一个组织者的作用。做过网页的人都知道,做网页是一项比较费时的工作,而要学生在较短的时间内制作出像样的网页是比较困难的,而在这个过程中,网页的设计占去了相当多的一部分时间,组长把任务分到各组员头上以后,组员就可根据自己要完成的任务相对集中的做某方面的工作,做完以后,组员之间进行经验交流,告诉组员自己的网页是如何制作出来的,在完成自己的网页后,再重复一遍制作过程花费的时间的不多的。这样,其他组员就可在较短的时间之内掌握比较先进的网页制作方法,而不必再花那么多时间去探索。因为每位组员都必须自己完成一个任务,所以在这个过程中,也同样有自己探索学习的机会和介绍自己经验的机会,使组内的每个学生都在学习中获得成就感。
四、教学过程
教学进程
教师活动
学生活动
1、课前准备
课前将本章内容的基本结构、内容的归类、网页基础知识、网页素材做成一个网站,供学生参考,网站上的内容可根据学生以后在学习中的要求添加。根据学生对已有的网页制作的情况进行分组。
学生根据自己的分组情况选出组织能力较强、计算机水平较高的人做组长,协作小组形成。
2、教师布置任务,作必要讲解
第一节课,教师简单介绍网页基础知识,并给各小组布置任务――用下面的时间完成班级网页的制作,并对组长进行本章基本内容及本章内容的分类的介绍,让他们对本章内容有总体上的'把握。
在教师对网页基础知识讲解的基础上,浏览教师制作的网站,继续学习;
课后各组设计自己的班级主页,组长根据网站上教师对本章内容的分类给学生布置任务。
3、教师指导分工情况,学生开始自主学习
第二节课教师对组长对全组的分工情况给予检查,提出意见和建议。
学生根据分工制作网页,学习可以跟着课本上自学,也可根据以前学习Word的经验自己摸索制作过程,不懂之处可向会的同学请教,还可以相互之间讨论,在网页的设计方面也可以相互之间多商量,发扬互帮互助的精神。
4、学生自主学习,教师指导、监督
下面三节课,老师在每组各用10分钟时间检查他们上节课的网页制作情况,并对他们碰到的问题给予提示或解决,起指导和监督作用。
学生继续学习、制作网页。
五、阶段总结
四节课的制作以后,各组员所制作的网页都初见雏形,所以教师组织一堂课,由各组展示自己的作品。教师在学生评讲完后,给予总结。
各组分别展示自己的作品,其他组对他们可以提出意见或建议,也可从其他组的学到好的创意。由组长在课后写一份阶段总结,从而指导以后的工作。
六、学生自主学习,教师指导、监督
下面四节课,老师仍然对每组各花10分钟时间轮流检查他们上节课的网页制作情况,并对他们碰到的问题给予提示或解决,起指导和监督作用。
学生继续学习、制作网页。
七、各组将内容汇总,形成班级主页
教师对各组出现的问题提出建议或意见。
组长或组长安排人将各组的主页进行汇总,形成一个完整的班级主页,对欠缺的地方进行修补。
八、班级网站制作完成,展示与总结
老师请其他信息技术教师来做评委,对各组做的网站提出意见或建议,评出最佳网站、最佳创意等奖,让大家的付出都有所收获。
各组分别展示自己组所制作的班级主页。
课后:
大家集中各组的优势,将班级主页完成,挂到学校主页上。
篇9： 《网页制作》教学设计
一、教学目标：
1、知识与技能：
（1）了解框架结构网页的概念及在网页中的作用，了解它与表格网页的区别。
（2）掌握框架结构网页的建立、框架结构的拆分、框架的删除等。
（3）掌握框架中页面设置及保存的方法，如设置初始网页按钮、新建网页按钮等。
2、过程与方法：
（1）能够区分框架结构属性设置与网页属性设置的不同点。
（2）通过框架结构网页设计，使学生对网页的整体结构有更进一步的认识。
3、情感态度与价值观：
（1）能够将表格与框架结构网页结合使用，在创作中体验乐趣。
（2）培养学生网页设计的审美意识、创新意识。
二、教学重点难点：
1、教学重点：
（1）框架网页的作用和功能，框架的建立与属性设置。
（2）框架中各个页面之间的关联，每个框中页面的设置方法。
（3）框架网页的保存方法。
2、教学难点：
（1）框架结构网页中框架属性与页面属性的设置方法。
（2）理解框架结构的多页面存储方法及各页面之间的关联。
三、教学过程：
1、创设情境、导入新课
（1）教师展示一组表格制作的网页，引导学生找出它们的共同特点。并提问如何快捷地制作这种网页（学生回答：使用复制、粘贴快捷地制作）。
（2）教师又提问：有没有更好的方法呢？相同的区域我们能否只做一遍呢？从而导入新课――框架网页的制作。
设计意图：通过对比、比较，引导学生思考，激发学生学习的乐趣。
2、任务驱动、自主学习
（1）教师展示一个框架网页，引导学生理解框架网页的概念。
（2）出示任务一：框架网页的新建与保存。教师要求学生先阅读教材中的操作步骤，再尝试完成书本第227页的实践学习。
（3）教师讲解框架结构中的每个框都是一个独立的选项文件，即网页文件，因此当框架确定之后，需要为每个框分别指定其网页文件的来源，可以通过每个框中的“新建网页”按钮和“设置初始网页”按钮进行选择。
（4）学生理解框架网页的概念，通过阅读教材中的内容，自学新建框架网页的操作，初步了解“新建网页”和“设置初始网页”两个按钮的不同，并认真聆听教师的讲解，注意观察，按要求模仿操作。
（5）出示任务二：相关页面的制作与设置。教师要求学生先阅读教材中的操作步骤，再尝试完成书本第228、229页的实践学习。
（6）学生制作相关页面，同时也是对前面所学内容的复习和回顾。教师反馈学生的操作情况，开展评比活动，对表现好的学生给与表扬。
（7）出示任务三：框架网页属性的设置。学生自主探究学习，有问题可向教师寻求帮助。教师基础扎实的同学完成任务后可进行拓展学习。
（8）教师请学生示范操作，并说明自己设置的方法和原因。同时鼓励做的比较好的学生。
设计意图：培养学生的自主学习能力，对于课堂教学难点，学生在教师的讲解后模仿操作，有效突破难点。
3、展示作品、课堂小结
（1）教师给出一些常见的框架结构应用界面，如Web邮箱页面等，引导学生总结本课内容，并让学生分组，推进一些优秀作品在全班展示。
（2）教师点评，并鼓励完成作品比较好的学生。
设计意图：拓展学生的视野，使学生了解框架的应用方法。展示优秀作品鼓励学生，激发学生的创作欲望。
四、教学反思：
1、本节课是在学习完简单网页、表格布局网页、交互式网页的基础上，进一步页的设计方法。由于学生已经具备了一定的网页设计基础知识与技能，所以教师可以根据学生的实际情况，采用更灵活
的教学方法。教师可以简单介绍框架结构网页的功能及框架的建立与编辑方法，以及框架属性设置与网页属性设置的方法与区别。然后由学生根据教师提供的学案及演示动画，完成框架网页设计任务。
篇10： 《网页制作》教学设计
教学目标：
1、知识与技能：
（1）理解框架的概念及用途。
（2）掌握框架网页的新建、制作、编辑与保存，了解框架的拆分方法。
（3）初步掌握将框架结构与表格布局结合使用来制作网页。
2、过程与方法：
（1）通过对表格网页的分析，体验新知识（框架结构网页）的优点，从而促进其学习新知识。
（2）理解框架的概念与组成，学会分析网站的结构。
3、情感态度与价值观：
（1）通过以“人与动物”为主题的框架结构网页制作活动，了解更多有关人与动物和谐相处的知识，通过故事趣闻，增强学生关注动物的兴趣和意识。
（2）能够将表格与框架结构网页结合使用，在创作中体验乐趣。
教学重、难点：
1、重点：框架的概念、用途， 创建、编辑与保存框架网页的方法。
2、难点：框架的拆分。
教学方法：
对比教学法、探究学习法、模仿学习法。
教学准备：
整理、归类相关素材，并按要求摆放。
教学过程：
1、引入
老师展示一组利用表格制作的网页，要求学生仔细观察，找出它们的一个共同特点（学生答：网页上方和左侧内容都是相同的，仅右下部分内容不一样），并提问如何快捷地制作这种网页？（学生答：使用复制粘贴快捷地制作）
尽管复制、粘贴能为我们节省时间，但有没有更好的方法呢？相同的区域我们能否只做一遍呢？今天我们要学习的内容――框架网页制作，就能给我们带来更多便捷。（让学生明确框架网页使用的场合）
2、新授
（1）框架网页概念
由以上例子入手，再展示一个框架网页，教师引导学生理解框架网页的概念
（2）框架网页的新建与保存
教师要求学生先阅读教材中的操作步骤，再尝试进行探究操作。
任务1 创建“横幅和目录”结构的框架网页，新建top和left页面，并学会保存。
框架结构中的每个框都是一个独立的选项文件，即网页文件，因此当框架确定之后，需要为每个框分别指定其网页文件的来源，可以通过每个框中的“新建网页”按钮和“设置初始网页”按钮进行选择。在top和left页面中，单击“保存”按钮，随即开始保存。
此处为教学难点，可先由框架的概念入手，再针对保存页面中的蓝色部分，教师进行讲解，教会学生注意观察。
学生要理解框架网页的概念，通过阅读教材中的内容，自学新建框架网页的操作，初步了解“新建网页”和“设置初始网页”两个按钮的不同，并认真聆听教师的讲解，注意观察，按要求模仿操作。
设计意图：培养学生自主
学习能力，课堂教学难点在教师的讲解后模仿操作，有效突破难点。
（3）相关页面的制作与设置
框架网页中相关页面的制作，需要结合表格来布局，插入文字、图片和交互式按钮。
任务2 top和left页面的制作。
要求：
○1top页面内插入1行2列的表格，左边单元格插入logo图片，右边单元格插入banner图片。
○2 left页面内插入5行1列的表格，在每个单元格内依次插入交互式按钮（共4个），交互式按钮文字为展示介绍的相关内容概括，在第5个单元格内插入一个邮箱指示的图片。
○3调整表格边框的粗细。
○4为main区域设置初始页面。（该网页由教师提供现成的）
学生制作相关页面，同时也是对前面所学内容的复习和回顾。老师反馈学生的操作情况，开展比一比、评一评活动，对表现好的学生给予表扬。
（4）框架网页属性的设置
创建好框架网页后，可以根据实际需要改变框架的属性。
任务3 调整框架的大小、设置框架的边框、设置框架窗口中的滚动条等。
提高任务：框架的拆分。
学生自主探究学习，可向老师寻求帮助。完成设置后请同学示范操作，并说明自己设置的方法和原因。操作基础扎实的同学完成任务后可进行扩展学习。
3、总结与评价
老师可以给出一些常见的框架结构应用界面，如Web邮箱页面等，引导学生总结本课内容，梳理课堂知识，并让学生分组，推荐一些优秀作品进行全班展示。
设计意图：开拓学生的视野，使学生了解框架的应用，教会学生要善于总结，要学会学习的方法。
篇11： 《网页制作》教学设计
教学目标：
1、让学生掌握在网页中插入表格的方法以及表格的修改
2、学会利用表格来规划网页
3、培养学生创新的能力以及动手操作的能力
教学重、难点：
利用表格来规划网页，从中培养学生的创新能力
教学过程：
一、情境导入
同学们你们善于观察吗？老师先考考你们，我们一起来看一组图片，你们看看在那里看过呢？学校缓台的窗台上。你们的观察能力真的很强啊，对，这些都是我们学校美术的特色作口，盘画。其实，我们做过很多作品：有手工作品，语文课中的作文、书法等都是作品，这节课我们以绘画作口品为例，做一个学习园地网页，把我们的作品展示到自己的班级网站中，以便我们更好的努力学习。现在我们就一起来制作吧！
二、新知探究
首先我们来打开上节课的班级网站，在这个网站中新建一个网页，并保存成“学习园地”。
教师讲解：如何制作学习园地网页。
1、制作网页的标题：输入文字，并设置文字的格式。
2、插入表格：单击“表格”中的“插入表格”并对表格属性进行设置。如：行、列的操作，对齐方式等。同时讲解什么是行，什么是列，以及单元格的概念。
3、修改表格：调整表格行高和列宽。
4、在学生学会插入表格的基础上，来设计网页，展示作品。并讲解在单元格中可以插入图片、文字。那我们就一起快快去做吧！插入图片，并在图片的上面或下面进行图片的注释。
5、进一步设置单元格的背景，来美化网页。
6、设置超链接：通过导航栏目，设置文字超链接。选中文字，点击右键选择超链接在列表中选择你要链接的网页，单击“确定”按钮。
7、学生在教师的讲解后，学生自己动手操作制作网页。教师进行指导。（伴随音乐）
三、作品评价
1、生评：从网页设计上，美观程度上，知识落实上重点评价。
2、师评：对学生作品进行评价，并对其它学生的评价加以更完整的解释。
四、总结
我们这节课主要是利用了表格来设计网页，以使来美化我们的网页，通过绘画作品的展示，学习更多的知识。
篇12： 《网页制作》教学设计
教学目标：
1、知识与技能
（1）了解超级链接的含义及链接源和链接目标的含义，掌握同一站点内以及不同站点间网页超级链接的创建方法。
（2）掌握网页内书签的作用及创建书签链接方法，掌握交互式按钮、框架网页内超级链接的设置方法。
（3）理解热区链接的含义及创建方法。
2、过程与方法
（1）通过创建网页超级链接的操作，使学生了解网页中创建超级链接的基本方法，破除对网页链接的神秘感。
（2）通过对不同对象设置超级链接的操作，使学生总结出操作的规律，培养学生自主学习与操作的能力。
（3）通过网页不同的超级链接方法，拓展学生思维，创建多种形式的网页链接。
3、情感态度与价值观
（1）通过链接我国主要自然保护区网页，激发学生热爱祖国、热爱自然、热爱生命的激情。
（2）完成超级链接，使学生感受成功的喜悦和快乐。
教学重、难点：
1、教学重点：
（1）超级链接的含义及链接源和链接目标的含义。
（2）超链接的制作方法――给文字、图片制作超链接，制作书签链接，给交互式按钮制作超链接，框架页面内的超链接，图片区域制作超链接等。
2、教学难点
（1）书签链接中名称及对应链接位置的设定。
（2）在框架页面中制作超链接时，目标对象所选择的显示窗口形式。
教学方法与教学手段：
任务驱动法、讨论探究法、讲解与演示法、类比知识迁移法。
教学准备：
“动物――人类的朋友”站点，包括未链接的网页，如欢迎页、表格页、框架页，表单页等。
教学过程：
1、引入
展示两个主页，一个已经创建了链接，一个没有创建链接，让学生进行比较并找出区别，引出本课课题――超级链接。
提出：我们在先前的学习中，哪个软件中的相关操作与它类似？什么是超级链接？找一个例子，分析链接源和链接目标分别是什么？
学生展开交流，通过对比找出不同点，并积极思考，回答老师的问题。
设计意图：通过对比操作、交流，再辅以知识迁移，明确本节课教学内容。
2、新授
（1）站内超级链接
引导学生回顾PowerPoint中超链接的制作方法（教师提示：右击链接源，利用快捷菜单制作超链接），辅以教材中的内容，让学生自行探究并完成以下操作：
任务1同一站点内不同页面之间的链接
○1制作首页（欢迎页）到表格页的超链接。
○2给表格页内交互式按钮设置超级链接，链接到相关页面。
○3给框架页内交互式按钮设置超级链接，链接到相关页面。
教师巡视，及时指导，安排学生示范操作并讲解如何制作超链接。
交互式按钮的超链接制作要求在框架网页中演示操作。老师可以提问学生：演示者操作的对吗？有没有问题？
引导学生发现问题：超链接制作完成后需要检验（保存后预览）。
教师讲解，突破难点，再交由学生操作。
以上是同一站点内不同网页之间的链接，有时一个页面中内容过多，需要不断拖动滚动条实现阅读，能否实现快速跳转呢？
任务2同一站点内同一页面内的跳转（链接）：在“动物趣闻”页面内制作书签链接。
教师讲解：由生活中的书签引入，介绍“书签链接”的概念，然后再演示如何操作。
提示：书签链接的双向性问题（返回）。
学生认真听讲后模仿制作，教师巡视进行指导并反馈学生的完成情况。
（2）站间超级链接
仅凭我们课堂上制作的这些页面还不足以详细介绍我们的主题，此时我们还可以借助超链接，链接到因特网上的其他网站，以丰富我们的内容。
任务3借助热区链接，为“友情链接”页面制作超链接，链接我国一些自然保护区网站。
有了以上基础，可安排学生自学教材中有关热区链接的相关内容，学生探究操作后教师再安排学生进行演示，辅助以提问的形式检验学生的自学情况。
3、总结与评价
开展同学间的互助，检验其链接完成情况，推荐优秀同学做展示。引导学生分类总结本节课的知识点。
篇13：中职教学网页设计论文
中职教学网页设计论文
1合理调整课程教学内容，让教学设计科学合理
将整门课程分为十二个单元，这些单元基本覆盖课程需要掌握的知识点，这些单元在设计的时候遵循循序渐进的设计思想，先易后难，先主体后次要，条理清晰并且每个单元的设计又相对独立，避免学生出现一个单元学不懂，就没有心思再继续后续课程的情况，通过这样设计优势不言而喻。在实施过程中可能分阶段进行，这种课程体系结构的安排证明在实践过程中、在教学质量中都取得了良好的教学效果。
2选择教学方法，激发学生学习兴趣
在《网页设计与制作》中，主要有案列教学法和项目教学法等教学方法，案例教学是在学生掌握了有关基本知识和分析技术的基础上，在教师的精心策划和指导下，根据教学目的和教学内容的要求，运用典型案例，将学生带入特定事件的现场进行案例分析，通过学生的独立思考或集体协作，进一步提高其识别、分析和解决某一具体问题的能力，同时培养沟通能力和协作精神的教学方式。项目教学法是学生在教师的指导下亲自处理一个项目的全过程，在这一过程中学习掌握教学计划内的'教学内容。学生全部或部分独立组织、安排学习行为，解决在处理项目中遇到的困难，提高学生的兴趣，调动学习的积极性。因此“项目教学法”是一种典型的以学生为中心的教学方法。教学无定法也采用以上两个教学方法，即采用项目教学和案例教学相结合的教学方法，例如在学习表格的时候，表格这个单元就可以设计成一个项目，同时本身也是一个案例。
3教学过程中，精确实施提升教学质量
在本门课程的教学过程中，如何抓住宝贵的40min宝贵的时间，达到教学目的，提升教学质量，就必须精确的实施教学的计划，既让同学们感兴趣，爱学习也要让同学们团结协作分工明确，提升专业技能，在完成了所有的学习后，布置综合实践环节，采用6人为一个小组共同设计系部网站这一个项目，每组选出一名小组长进行总体的策划，将这一完整项目分成多个子任务，每个任务分配到小组成员中，使他们各尽其责完成自己负责的任务;另一方面小组中的每个成员必须完成一个作品，这个网站的作品是由个人独立完成的项目。网站制作结束前经过教师核准验收后，可以宣布整个项目工作结束。接下来教师要对学生制作的作品进行展示，在进行作品展示时，教师可以把班级同学集中起来一起观看，促进学生的团队意识。同时，为了更好地利用网络空间和网上资源，可以把学生的好作品上传校园网站。让全校师生都来关注学生的成果。这样，既给学生施加压力，也激发了学生的学习动力与信心，让学生享受成功的快乐，享受成果的乐趣，真正提高对所学知识的理解和掌握。因此，通过个人项目、团队项目、作品展示等教学方法与形式，不仅锻炼了学生的自我设计、制作、审美及创新能力，还锻炼了学生的团队合作能力，分析问题、解决问题的能力，在很大程度上提高了学生的学习积极性和学习兴趣。实践证明项目式教学方法可行，得到了学生的喜爱与好评，也取得了良好的教学效果。
文档为doc格式
