设计与制作网站首页界面项目教学设计.docx

《设计与制作网站首页界面项目教学设计.docx》由会员分享，可在线阅读，更多相关《设计与制作网站首页界面项目教学设计.docx（4页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、设计与制作网站首页界面项目教学设计一、任务描述网站是众多企业、团体和个人宣传产品、主张和树立良好形象的主要途径和重要手段。据不完全统计，当前100%的大型企业、60%的中小企业都已经或将要在互联网上建立的自己的网站，要使我们的网站在众多网站中脱颖而出，其界面的设计就显得十分重要。网页界面设计其实是一个系统工程，它包括网站页面布局、设计，颜色的搭配、尺寸的大小和风格的定位等。网站首页界面是整个网站的“面子”工程，首先突出的是功能，使用户只要看一眼网站，就能够知道该网站的类型。其次就是能够给访问者带来一种视觉享受，特别是展示、宣传型的网站需要更加注重艺术设计。在本任务就是要求学生使用Photosh

2、op CS6软件设计、制作设计制作网站首页界面。二、任务目标学生通过完成本项目，达成以下目标：知识与技能：能够使用切片工具处理图像；了解优化图像命令选项优化Web图像的使用方法；了解界面设计与制作；尝试使用动作处理图像。方法与过程：能够根据任务的要求，确定完成任务的所需要的技术，并较熟练的完成任务；能对自己和他人的活动过程与结果进行评价与交流，能归纳利用信息技术解决问题的基本思想与方法。情感、态度、价值观：通过完成本任务，能够感受到信息技术对社会发展、工作效率的影响。三、任务分析房地产宣传展示型的网站内容不多，架构不复杂，更注重的是形象和标的（楼盘）的展示。因此，我们将“怡海新城”的实景图处理

3、成宽幅画面作为主题放置在首页中间的位置，占据一半以上的版面。网站分类栏目按钮放置在主题图下面，当用户需要进一步了解详细内容时，单击按钮即可进入二级页面。同时将公司的名称、楼盘名、经营理念和联系方式分别放置在页面的上下端，给用户更多的信息。根据网站的特点，本首页采用800像素520像素大小，使用图像自动合并、色调调整等技术进行整体设计，然后采取切片的方法分别保存文件，有利于网页的编辑和浏览。四、活动策略在本任务活动的过程中，教师首先要引导学生认识网站首页，知道网站首面构思、设计的一般方法。然后引导学生尝试自动命令拼合图像，使用切片工具切分图像的操作。当学生具备了设计与制作网站首页界面的知识与技术

4、后，即可引导其完成本项目网站首页界面的设计与制作活动。在本任务活动过程中，学生技术方面的获得，大部分内容从阅读教材、观看操作录屏、教师演示示范即可达到目标，教师还需要引导学生了解网页中图像相关规则、颜色搭配、文件格式、设计创意等方面的知识。因此，教师可以结合本项目，引导学生收集、阅读网页设计方面的书籍或资料，观看比较成功的网页设计作品，从而启发迪设计创作思维，提高其综合设计的素养。完成本任务的过程中，需要较长的时间。学生通过多次操作，更进一步熟练使用已经会使用的工具与技术，使学生达到自动化的目的。因此，我们采取“创设情境任务分析找出问题（知识储备）解决问题任务实施活动评价拓展提高”的流程，达到

5、完成任务的目标。五、活动过程任务名称设计与制作网站首页界面建议课时4课时预设环节学生活动教师活动创设情境激发兴趣（5） 融入情境，产生完成本项目的欲望。创设一个真实的任务情境，激发学生完成本项目的兴趣。情境既可使用本教材中“任务描述”，也可在本“任务描述”的基础上，使用图像、音视频，精选一些该软件制作的作品，引导学生欣赏，以激发其兴趣。分析任务找出问题（10）学生小组讨论，可能会提出以下问题： 如何合成全景照片？ 如何根据网页布局，切分图片？ 网页用图有什么特殊要求？ 在学生讨论的基础，教师有针对性地引导学生，将需要解决的问题收集、整理出来（针对性也就是围绕本任务目标进行梳理，取其精要。）典型

6、引导解决问题(20)阅读文本，尝试操作，掌握新知。引导学生参照教材的“任务准备”，了解切片工具和图片拼合命令。当学生操作有难度时，教师需要适时示范、指导。尝试操作任务实施（60）参照教材中“任务实施”，尝试操作，完成任务。当遇到困难时，可以观看课程教学资源网“录屏”文件。学生在操作的过程中，教师要适时巡查，发现问题，引导学生解决。同时，鼓励小组同学之间相互帮助，积极交流，解决问题。展示作品活动评价（15）参照教材中“活动评价”表中的项目进行。教师鼓励学生在小组内积极展示、交流作品，并交流创作的体会。同时，教师适时参与到部分小组，有针对的进行点评，提出进一步完善意见和建议。再次修正完善作品（20

7、）根据学习情况，寻找不足。有针对性的辅优补差。综合练习拓展提高（45） 参照教材中“拓展提高”，引导学生更进一步认识切片工具、裁剪工具、透视裁剪工具、切片选择工具和合并照片命令、像素尺寸、画布大小、Web安全颜色、颜色匹配命令、曲线命令、优化图像、动作面板处理图像。 完成教材中的“思考练习”，将本次项目成果通过网络或其他途径提交给教师。 根据教师评价结果，反思学习行为，提高能力。“拓展提高”在技术上有一定拔高，教师根据实际情况，有针对性示范操作。评价作品，将评价结果反馈学生。六、设计反思根据教材安排来看，本项目作品需要处理过程比较繁琐，需要综合已有知识（比如文字工具、参考线、图层样式等）等都是前些项目中经常用到知识与技术），结合新知识与技术完成项目元素的处理。在操作的过程中，一些相同项目需要重复处理，将花费较长的时间，教师适时引导学生，使其他通过反复练习，掌握技术，形成能力。在学生活动的过程中，教师要适时鼓励学生之间相互交流，共同探讨解决操作过程中的技术难题，教师也需要适时指导。在完成本任务的过程中，学生在实际操作的过程，虽然有网络资源（范例录屏）作为支撑，但是，仍然需要教师适时的操作与示范和个别辅导。