第一篇:网页设计与制作课程的研究与应用论文
[摘要]本文简要叙述了O2O教学模式的概念及特点,调查分析了在高职院校中采用O2O教学模式的必要性和可行性,从《网页设计与制作》课程应用O2O教学模式的背景出发,对使用O2O教学模式的改革方案进行了详细的叙述。
[关键词]O2O教学模式;网页设计与制作;教学改革
一、O2O教学模式的概念及特点
O2O教学模式,是利用互联网技术,综合线上、线下的优质教学资源,构建双向互动的新型教学模式。其具有的特点如下。(一)对学生实现了个性化学习。学生对于线上学习时间的安排比较自由,可有选择性的对教学视频进行观看。(二)对教师实现了素养的提高。对于每一堂课,教师都必须以基于线下来做线上,以及基于线上来改进线下为原则来准备线上和线下教学资源,且线上线下教学资源必须相互融合。线下教案的设计,线上教学视频的录制与编辑等课前准备工作,教学资源的完成对教师的素养实现了本质的改变。(三)学习资源的丰富性及共享性。为了能更好地利用O2O教学模式进行教学,在网络平台上必须上传丰富的学习资源。(四)能实现师生间的多向交流性。教师与学生、学生与学生之间可以在线上、也可以在线下、同时还可以从线下到线上,再从线上到线下等进行交流讨论,大大的突破了时间与地点上的限制。
二、采用
O2O教学模式的必要性和可行性
(一)必要性
现在的高职院校学生生源主要来自两个渠道,一是通过高考录取进来的专科生,另一部分是通过中考录取为五年一贯制的专科生,生源素质普遍较低,学生学习兴趣不高,自学能力较差。本文作者通过问卷和实地访问调查发现,在传统的教学模式课堂上学生喜欢玩手机,课外时间更是玩得不亦乐乎,甚至达到忘我的境界。为了能达到理想的教学效果,学院管理人员和教职人员齐抓共管,针对问题制定了一系列的对策用以阻止学生玩手机。鉴于此,何不利用学生痴迷于手机这种心态,充分发挥手机移动端的最大作用,结合移动互联网技术,采取O2O模式进行教学。
(二)可行性
通过调查分析,免费无线WIFI已覆盖全院,人人都拥有至少一台移动终端设备,学院机房课外时间都为学生开放。我院已购买了支持手机端学习的超星慕课平台,这些软硬件设备都为开展O2O教学提供了良好的基础。此外,通过调查发现教师很愿意尝试利用这种与互联网关系密切的具有创新的现代信息技术教授方式,学生也很愿意接受这种具有自由灵活性的学习方式。
三、《网页设计与制作》课程应用
O2O教学模式的背景《网页设计与制作》课程的特点是理论难度较大、实践性强。课程的知识点较多且比较抽象,课堂上大多数知识点学生能听懂,但不能将各个知识点融会贯通,遇到实际的WEB页面设计工程时便是无从下手。在传统的教学模式课堂上,教师通过举例展现实际效果将知识点解释清楚,并对各个知识点的关系进行梳理。但由于课时的原因,学生听完之后就没有更多的时间进行下一步讨论,在没有听懂的情况下也没有时间向老师请教,就更不用说对本堂课的知识进行扩充延伸。为了改变传统教学模式教学效果和效率低下问题,2016年5月,我院引进了超星慕课平台,将《网页设计与制作》课程作为试点进行教学改革,探索出一套适合我院的O2O教学模式,然后在全院范围内推广至其他课程。
四、基于O2O教学模式在《网页设计与制作》课程改革与实践
(一)线上网络平台资源的建设
在超星慕课平台上建立网页设计与制作课程,在平台上发布多种教学资源供学生观看与下载。教师通过appMaker富媒体编辑器对教学视频中知识点的重点、难点进行回放、放大等编辑操作,用以强调内容的重要性。
(二)线上与线下课堂教学模式的改革
在传统教学模式课堂中,教师讲课的基本流程为复习导入新课、新课讲授、课堂小结、布置作业、课后小结五个环节。一堂课45分钟,每个环节分别占用的时间大概为:5-8分钟,30-35分钟,3-4分钟,2-3分钟(课后小结是利用课外的时间完成)。一堂课下来,教师与学生、学生与学生之间基本没有互动环节(除了教师提问环节),这样不利于学生对知识的吸收与内化。而利用O2O教学模式进行教学,教学环节与时间分配都必须重新设计。
(三)O2O教学模式的教学环节设计
通过探讨总结分析,将O2O教学模式学习时段分为课前、课堂、课后三个时段,具体工作如下:
(1)课前时段:课前时段即线上学习时段。在每堂课上课之前,老师都会通过超星慕课平台推送下节课学习内容的消息到学生的移动端。学生收到消息后首先进行的是课程预习及视频的自主学习,学习过程中遇到的问题,可以通过平台中的互动课堂版块进行在线提问和讨论,也可以记录在纸质笔记本上,带到线下课堂上请教老师或与同学进行交流。学生在完成课前时段作业的同时,相应的对下一节课内容已完成记性和理解两个过程,为课堂时段提供充足的准备。
(2)课堂时段:课堂时段即线下学习时段。在课堂上,老师首先利用10-15分钟的时间对视频中的知识点、重难点进行梳理,并对学生进行提问以了解学生课前学习的情况。其次利用15-20分钟的时间让学生提问,通过老师或学生(已完全理解该内容的学生)进行解答。再剩下的10-15分钟,学生通过分组的形式讨论老师布置的案例。老师参与程度或分组形式以具体内容而定,最后由每组的组长向老师表述讨论结果,进而老师对每组讨论结果进行总结点评。课堂时段的进行能增强人与人情感上的交流、教师面对面个性化的指导、教师和学生及学生和学生之间的即时讨论等,是很重要的一个环节。
(3)课后时段:课后学生再利用时间去观看上一堂课的教学视频,把之前遇到的问题(课堂时段已解决的)再梳理一遍,以达到温故而知新的目的。再完成老师发布在平台上的在线作业,如有疑问,可以利用超星慕课平台所提供的讨论交流模块在线咨询辅导老师,也可以与同学进行交流,同时对自己的学习效果进行在线测试等。
(四)适应O2O教学模式的教师队伍建设
传统的教学模式中,所有的教学工作基本都是一人完成。而利用O2O教学模式进行教学,虽然老师从主要讲课“降”为只辅导学生、与学生讨论、交流问题的角色,但是平时的工作量不但没有减少,反而成倍增加。老师除了要做在传统的教学模式中准备的工作外,课前必须把教学视频录制编辑好,把教学素材上传到教学平台上,还须与学生保持紧密联系,掌握其学习动态,根据学生的学习效果优化课程教学内容,时刻在线为学生解答问题等。由于一名老师精力有限,是很难独立完成这么大的工作量的。因此,教学团队经过探讨,对团队老师进行分工,将工作量进行分解,明确每个老师在O2O教学模式中各个教学环节的角色、任务及相互协作的关系。将团队分成主讲教师和辅导教师两部分。主讲教师主要由具有丰富的教学实践经验的教师组成,主要负责课前教学视频的录制编辑,课堂时段的讲课并组织学生讨论交流。而辅导教师主要负责课前消息的发布、课后答疑、题目发布、作业收集与批改等工作。大家都把自己的工作任务做好,有事情积极沟通,抱着相互协作的态度完成课程教学工作。
(五)O2O教学模式的考核机制
O2O教学模式的考核机制以培养学生实践创新能力目的,以平时的学习态度为基础,依据教学环节进行设计,以期末考试总成绩100%进行计算。平时学习态度占10%,包括线下上课和实训考勤;实训作业和报告完成情况占10%;课前时段学习占10%,包括教学视频观看情况,线上任务点的完成等;课堂时段学习占15%,包括问题的提出、讨论的积极性等。课后时段占10%,包括在线测试、作业完成情况、复习观看教学视频等。最后必须按照要求完成一个综合型的网站作品,这是考查学生综合实践及创新能力的代表作,包括图像的处理、动画的制作、审美观等,所占的比重很大,占45%;期末总评分为以上六环节项分数的总和,只要有一项环节分不及格,课程总评成绩为不及格。
五、O2O教学模式的实施效果
在O2O教学模式的实践过程中,我们设置2015级计算机应用技术专业一班为试点班,二班为对照班。其中一班人数为35人,二班人数为38人。两个班之前的网页设计与制作前导课程均有同一个老师执教,各门课程期末考试成绩统计情况基本一致。通过一个学期的学习,对两个班教学效果进行总结分析。(1)从交上来综合型的网站作品分析,一班学生设计出来的作品在颜色搭配、代码使用、美观整洁度明显优于二班学生;(2)从省级大学生科技创新与职业技能竞赛网页设计与制作项目获奖率分析,一班学生获奖比往年高,而二班基本持平。此外,通过对试点班进行无名问卷调查,85%的学生认为在新的教学模式下,自我控制能力和自学能力得到了很大的提高,75%的学生认为新的教学模式更有趣,82%的学生认为自己的团队协作能力、语言表达能力和自信得到了提升,90%的学生认为自己的实践创新能力得到了提高。
六、总结
实践证明,采用O2O教学模式进行教学,能够提高网络优秀资源共享率,改变了教师的教学方式和学生的学习方式,在教学过程中取得了良好的效果。但也遇到一些不可预测的问题,需要我们一线教学工作人员在以后的教学过程中不断地探索与改进.参考文献:
[1]井靖,何红旗,王志刚,殷冠英.O2O教学模式”在大学计算机专业教学中的应用原则[J].计算机教育,2016(2).
[2]胡小华.O2O电商模式下服务营销课程教学模式的创新思考[J].长春教育学院学报,2015(11).
[3]张颖.“O2O模式”在高职院校技能操作类课程项目化教学过程中的适用性研究[J].无线互联科技,2016(10).
第二篇:网页设计与制作课程学习论文
《网页设计与制作》课程学习论文
作为一个二十一世纪的大学生,学习如何设计与制作网页变为一个必不可少的过程。经过这几个星期的学习,我开始对网页设计与制作有了初步的认识,并且学习了一些网页设计与制作的基础。随着时代的发展,网站建设越来越接近于一门艺术而不仅仅是一门技术。网站设计日有必要的益被重视,学习网页设计与制作这门学科是非常。
作为网页设计的初学者,我对网页设计非常感兴趣,一心想设计出一个美观、实用、内容丰富的个人网页。我通过自己动手、动脑,通过网络资源,老师的指导,在不断发现问题和解决问题的过程中学到了很多知识,也增强了我的创作能力和动手能力,在网页设计过程中,从构思到设计、完善、维护,整个过程我都全身心投入,使我真正学到了网页设计的知识。
互联网成为人们快速获取、发布和传递信息的重要渠道,它在人们政治、经济、生活等各个方面发挥着重要的作用。网页设计伴随着网络的快速发展而快速兴起,作为上网的主要依托,由于人们使用网络的频繁而变得非常的重要。网页讲究的是排版布局,其功能主要就是提供一种形式给每个上网者,让他们能够了解网站提供的信息。
网页设计与制作包含视听元素于版式设计两项内容,以主题鲜明、形式与内容统一、强调整体为设计原则,具有互交性与持续性、综合性、版式的不可以控性、艺术与技术的结合的紧密型等特点。美和功能都是为了表达网站的主题。我认为在一个网站中,最重要的页面当属主页,所以在此以主页为例,说明在网页制作中版面设计的问题。从版面设计来讲,一个有特色的主页,必须包含有四个要素:文字,图片,排列方式和主色调,这四者相辅相成,缺一不可。图片要素
要设计出漂亮的主页,首先要成为计算机图形高手,仅这一点就可以让初学者花上一年半载的时间。排列方法要素,主页的第二个要素是排列方法,即网页布局。色彩在网页所占比重很大。有了合理清新的色调,会弥补主页上的其它不足。页面的色彩搭配是与网站的主题分不开的,一个网站必须有一种或两种主题色。不至于让浏览者迷失方向,也不至于单调乏味。一般来说,页面的主体文字应尽量使用黑色等较深的颜色,与背景对比明显,按钮、边框等使用彩色。例如教育类网站使用蓝色为主题色,再用红色和黑色作为配色,就能表达出严肃、稳重的效果。网页作为一种版面,既有文字,又有图片;文字有大有小,还有标题和正文之分;图片页有大小而且有横竖之别。图片和文字都需要同时展示给观众,不能简单地将其罗列在一个页面上,否则会搞得杂乱无章。关于具体的网页布局,常见的有“国”字型、拐角型、标题正文型、左右框架型、上下框架型、综合框架型、封面型、Flash型、变化型等,关于它们,在网页设计的相关书籍中或者在网络上都可以看到详细的叙述
网页作为传播信息的一种载体,同其他出版物如报纸、杂志等在设计上有许多共同之处,也要遵循一些设计的基本原则。但是,由于表现形式、运行方式和社会功能的不同,网页设计又有其自身的特殊规律。网页的艺术设计,是技术与艺术的结合,内容与形式的统一。一般的来说,绝大多数普通受众图形,插件,applets和其它有关的高级Web浏览器特性。对我们来说,页面的实用可能比漂亮更重要,对于用户来说,没有什么比页面能够快速下载更重要了,简而言之,精简你的站点,这是一条最佳的捷径。就站点设计而言,的确能够通过成功的图形设计招徕或者丢失访问者。并非所有的访问者可以完全看到图片,某些人为了加快存取网络的速度已经关闭了浏览器端的图形。简而言之,图形并不能正确的在客户端加载。然而,图形经常被用来作为导航按钮。使用可以把一个浏览器分成几个不同的窗口,对于站点的结构的把握是一个不错的方法。但是,你还是必须知道,还是有人在使用不支持帧的浏览器。在你开始打算设计一个帧的时候,你该仔细的考虑考虑你是否的确真的需要。经常,你这样的需求可以通过表格来组织站点的结构。网页设计涉及到对多种软件、多种知识的学习和应用,以及个人的审美观等等。所以要想制作出漂亮的网页,需要一个逐步学习和经验积累的过程。
随着互联网的不断发展和中国网络人口的日益增长,建立个人网站,不但可以很好的展示自己,而且可以提高自己在计算机应用方面的能力。个人在设计时考虑的多为个人的兴趣喜好,而不注重商业的展示。内容以反映个人为中心,从而使个人网站真正的成为展示自己的网络名片。一张完美的主页设计需要积累丰富的知识以及掌握大量的技巧。
由于平时课程比较繁忙,学习时间比较少,对于网页设计软件的强大功能运用得还不够。不知不觉网页设计的课程将要结束了,这门课程所包含内容的丰富是让我从没有想到的。在整个的学习过程中,我学习了Flash、Fireworks、Html语言、IIS、网站建设的基本思想等重要内容。在网页设计过程中,由于没有网页制作代码的知识,所以在设计时也遇到了很多麻烦,有时插入一个特效脚本也是很麻烦。在网页制作过程中,想提高设计水平,想有个理想的网页,必须学会代码的运用,我将在以后的学习过程中不断加强这方面的学习,希望老师能简单介绍一下代码,让我也对它有个初步的认识,以后再加强学习也才会有所提高。
总体来说,通过今次的对网页设计的学习,有收获也有遗憾、不足的地方,但我想,我已经迈入了网页设计的大门,只要我再认真努力的去学习,去提高,凭借我对网页设计的热情和执着,我将来设计出的网页会更加专业,更完善。也希望老师在今后的日子里多指导。网页设计还有更多的技巧,有待于我们去挖掘和研究。
第三篇:网页设计与制作课程教学大纲
网页设计与制作课程教学大纲
1.课程设计的指导思想
(一)课程性质
1.课程类别:专业选修课 2.适应专业:软件工程 3.开设学期:第二学期
4.学时安排:周学时2+2,总学时72 5.学分分配:
(二)开设目的
本课程是计算机类专业的专业选修课,它是一门操作性和实践性很强的课程。本课程开设的主要目的,是为了适应web技术的飞速发展,为学生今后在学习、工作中建立网站及网页制作打下基础。通过本课程的学习,让学生了解一定的网络应用基础知识;能够熟练掌握网页制作工具——网页三剑客Dreamweaver、Fireworks、Flash的使用,能自行设计各种网页、编辑一定的平面图像、网络动画。具备网站的建立、规划、管理、发布的相关技术及网页制作的操作技能,能独立设计 WEB 站点。
(三)基本要求
1、知识要求:
(1)网页设计基础知识(2)DREAMWEAVER 的使用(3)FIREWORKS 图像处理(4)FLASH 的使用(5)网站制作实例
2、能力要求:
(1)学会熟练运用 Dreamweaver、Flash 和 Fireworks 应用软件;(2)熟练掌握使用绝对和相对 URL,创建超链接,图像链接;(3)熟练掌握设置颜色、文本格式和列表;(4)掌握在网页中添加 CSS 的方法
(5)掌握在网页中嵌入图像、声音、多媒体信息的方法;(6)熟练掌握表格的使用方法,学会利用表格布局网页;(7)掌握框架制作网页的方法,会使用框架设计网页;(8)掌握用 Fireworks 处理矢量图和位图。(9)掌握用 Flash 制作网页动画。
3、素质要求:
(1)具有勤奋学习的态度,严谨求实、创新的工作作风;(2)具有良好的心理素质和职业道德素质(3)具有高度责任心和良好的团队合作精神
(4)具有一定的科学思维方式和判断分析问题的能力(5)具有较强的网页设计创意思维、艺术设计素质。
(四)主要内容 计算机网站基础知识、网页三剑客DREAMWEAVER 的使用、FIREWORKS 图像处理、FLASH 的使用。
(五)先修课程 计算机基础
(六)后继课程 Web 程序设计
(七)考核方式 上机考试
(八)使用教材
(九)参考书目
1、《网页设计与制作技术教程》 作者:王传华、段青玲、马钦? 清华大学出版社?第二版.2、网页和网站制作基础操作与实例教程.陕西科学技术出版社
3、Dreamweaver8PhotoshopCS2Flash8网页制作教材.陈笑;李景池.清华大学出版社
4、《使用网站技术基础》作者:德力、卢明波、王化宇.内蒙古教育出版社 教学内容
第一部分 网页设计与制作基础知识 教学目的
使学生了解什么是网页,网站,网页元素等概念 主要内容 什么是网页,网站;2 Html语言基础; 构建网站的一般过程; 教学要求
了解:网站设计与制作的前期准备 掌握: 绘制网站首页效果图 第二部分 网页制作软件Dreamweaver 教学目的
使学生了解网站设计概念;掌握软件界面及站点建立,Dreamweaver的基本功能,表单和CSS样式表的应用及网页制作的高级技术。主要内容
1、网站设计概念,要求达到“了解掌握”程度 网站的主题定位
网站的风格和创意设计 准备材料和结构规划 页面布局
定义站点、申请域名、空间 认识HTML语言
2、初识软件界面及站点建立,要求达到“了解掌握”程度 Dreamweaver软件界面 对象控制面板的使用 建立本地站点 建立远程站点 站点的更新和管理
3、Dreamweaver的基本功能,要求达到“掌握”程度,添加文本 插入图片 插入表格
超级链接和导航条的创建 插入多媒体
4、表单和CSS样式表的应用,要求达到“了解掌握”程度 插入表单
插入表单对象
创建并链接到外部CSS样式
5、网页制作高级技术,要求达到“了解掌握”程度 创建层 设置层
层与表格的相互转换 创建框架 行为操作 创建模板 模板的应用 教学要求
了解:网站设计概念
掌握:软件界面及站点建立,Dreamweaver的基本功能,表单和CSS样式表的应用及网页制作的高级技术。
第三部分 图形制作与处理软件Firewoks 教学目的
使学生了解Fireworks软件界面;掌握图像的绘制和编辑,文本与颜色的使用,层与元件的使用,滤镜和特效的使用,按钮和动画的制作。主要内容
1、Fireworks简介,要求达到“了解掌握”程度 Fireworks概述
Fireworks的系统需求 Fireworks的新增功能 Fireworks窗口界面 创建新文档
导入和导出文档
2、图像的绘制和编辑,要求达到“掌握”程度 绘制图像 编辑图像
3、文本与颜色,要求达到“掌握”程度 文本的使用 颜色的使用 设置画布
4、层与元件,要求达到“掌握”程度 层的使用 元件的使用
5、滤镜和特效,要求达到“了解掌握”程度 使用滤镜 使用特效
6、按钮和动画,要求达到“了解掌握”程度 按钮 动画
教学要求
了解:Fireworks软件界面
掌握:图像的绘制和编辑,文本与颜色的使用,层与元件的使用,滤镜和特效的使用,按钮和动画的制作。第四部分 动画制作与编辑软件Flash 教学目的
使学生了解Flash基本工作环境;掌握Flash绘图工具的使用方法,Flash动画基础及FIash影片制作和发布。主要内容
1、初识Flash,要求达到“了解”程度 Flash基本工作环境 认识舞台与时间轴.认识不同作用的面板
2、Flash绘图工具,要求达到“掌握”程度 矢量图与位图 线型与颜色
线条的绘制与修改 填充图形的绘制,选取工具 文本
变换工具 其他工具
3、Flash动画基础,要求达到“掌握”程度 层 帧 元件
Flash的基本操作
4、FIash影片制作和发布,要求达到“掌握”程度 动画基础 逐帧动画 形状渐变 动作渐变 蒙板
运动导线 按钮
轨迹追踪 导入声音 加入视频 测试发布 教学要求
了解:Flash基本工作环境
掌握:Flash绘图工具的使用方法,Flash动画基础及FIash影片制作和发布。第五章 综合实例 教学目的
使学生能够熟练掌握网页制作工具Dreamvwaver、Fireworks、Flash的使用,能自行设计各种网页、编辑一定的平面图象、网络动画。具备网站的建立、规划、管理、发布的相关技术及网页制作的操作技能,能独立设计 WEB 站点。主要内容
综合实例,要求达到“掌握”程度 网页设计准备工作
用Fireworks设计网页结构 用Dreamweaver生成网页 用Flash制作网页动画 整理网页
完成小型WEB站点网页的规划、设计、管理与维护 教学要求
掌握:Web网站建设的基本方法,掌握网页制作工具的使用方法和技巧,培养学生设计网站的能力。课时分配及其它
(一)课时分配
课程总教学时数为90学时,安排在第二学期,每周3+2学时,上课18周。具体分配如下
教学内容 讲授学时数
章次
第一部分 网页设计与制作基础知识 4 第二部分 网页制作软件Dreamweaver 12 第三部分 图形制作与处理软件Firewoks 8 第四部分 动画制作与编辑软件Flash 8 第五部分 综合实例 4 合计
实验学时数 10 8 2 36
(二)考核要求
平时成绩(含考勤、作业与实验)占50%,期末(上机考试)成绩占50%。
第四篇:网页设计与制作课程作业任务书
广新09级《网页设计与制作》课程作业任务书
一、目的与任务
《网页设计与制作》课程作业是《网页设计与制作》课程教学中的一个重要的环节,是对学生进行的一次较为全面的网页设计与制作的训练和考核。其基本目的是:
(1)培养学生理论联系实际的设计思想,训练综合运用所学的基础理论知识,结合生产实际分析和解决网页设计与制作中问题的能力,从而使基础理论知识得到巩固和加深。
(2)学习掌握网站的一般设计过程和方法。
(3)对学生所学知识的程度进行考核。
二、教学基本要求
(1)确定设计网站的主题和风格。
(2)合理设计网站结构图。
(3)根据网站结构图,对各个页面进行布局和样式设计。
(4)完成课程作业报告。
三、课程作业题目具体要求
1、网站有一个主题,比如:个人网站、购物网站等;
2、每个网站至少包含5个以上的html文件;(网站的首页统一名称为:index.html)
3、最后提交两个内容:
1)打印纸质报告(具体要求见报告模板);
2)网站源文件。
做完后找老师验收通过后发到365109338@qq.com。邮件主题上一定要写明:学号+班级+姓名+网页设计与制作
第五篇:网页设计与应用
网页设计与应用
专
业: 班
级: 学
号: 姓
名: 指导教师:
计算机网络技术
20***031 蔡依婷 杨艳慈
邯郸职业技术学院 2017年11月21日
摘要
网页设计与应用
摘 要
本论文将对个人网页设计与制作的方法、工具等展开研究和探讨。在介绍网页设计与制作语言的基础上,着重使用JavaScript作为工具语言进行网页设计与制作的实际操作,分别对基于对象的JavaScript语言、内部对象系统的使用及WEB页面信息交互——窗口和框架进行详细描述,并利用具体的实例进行验证。
本论文主要章节如下,第一章:绪论,本章主要介绍网页设计的相关知识。第二章:网页设计语言概述,本章主要介绍网页设计的语言——HTML,以及用于编辑HTML语言的软件,为后续工作奠定基础。第三章:基于对象的JavaScript语言,本章介绍了基于对象的JavaScript中常用内部对象属性、方法的使用。第四章:内部对象系统的使用,本章主要介绍使用浏览器的内部对象系统,可实现与HTML文档进行交互。第五章:WEB页面信息的交互——窗体与框架,本章主要介绍实现网页的动态交互,必须掌握有关窗体对象(Form)和框架对象(Frames)更为复杂的知识。
关键词: 网页制作;网页设计;HTML;ASP
目 录
1.1 网页设计概述............................................................................................................................................4 1.2 网页设计的要素........................................................................................................................................4 1.3 大作业目的和意义.....................................................................................................................................4
第二章 HTML网页设计技术的应用...........................................6 2.1 HTML语言介绍........................................................................................................................................6 2.1.1 HTML语言的特点...............................................................................................................................6 2.1.2 HTML语言的编辑软件.......................................................................................................................6
第三章 色彩在网页中的应用..............................................7 3.1色彩在网页中的应用...............................................................................................................................7 3.2主页色彩的处理........................................................................................................................................7 3.3常用的配色方案........................................................................................................................................7
第四章 WEB页面信息的交互——窗体与框架..................................8 4.1窗体基础知识..............................................................................................................................................8 4.1.1窗体对象.................................................................................................................................................8 4.1.2 窗体对象的方法....................................................................................................................................9 4.2 窗体中的基本元素.....................................................................................................................................9 4.3窗体对象实例...........................................................................................................................................11 4.4 框架..........................................................................................................................................................13 4.5 框架的访问...............................................................................................................................................14 4.6本章小结...................................................................................................................................................17 第五章 结 论...........................................................18 致 谢................................................................19 参考文献................................................................20
绪论
第一章 绪论
随着21世纪的到来,人们更深切地感受到计算机在生活和工作中的作用越来越重要,越来越来的职业需要具有计算机的应用技能。掌握计算机是职业的需要,更是事业发展的需要。网页设计与制作是计算机能力的具体表现,本章主要介绍网页设计的相关知识。
1.1 网页设计概述
网站是企业向用户和网民提供信息(包括产品和服务)的一种方式,是企业开展电子商务的基础设施和信息平台,离开网站(或者只是利用第三方网站)去谈电子商务是不可能的。企业的网址被称为“网络商标”,也是企业无形资产的组成部分,而网站是INTERNET上宣传和反映企业形象和文化的重要窗口。
1.2 网页设计的要素
网页设计的两大要素是:整体风格和色彩搭配。
一、确定网站的整体风格
在这里,我提供给大家一些参考经验:
1.将你的标志logo,尽可能的放在每个页面上最突出的位置。2.突出你的标准色彩。
3.总结一句能反映贵站精髓的宣传标语!
4.相同类型的图像采用相同效果,比如说标题字都采用阴影效果,那么在网站中出现的所有标题字的阴影效果的设置应该是完全一致的!
二、网页色彩的搭配
1.用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,这样的页面看起来色彩统一,有层次感。
2.用两种色彩。先选定一种色彩,然后选择它的对比色。
3.用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。
1.3 大作业目的和意义
本大作业主要是对网页设计与制作的语言基础上进行探讨,主要内容如下:通过已经做好的网页,分析html网页设计技术、XML技术、Java Applet技术和Javascript技术在网页设计中的应用。
绪论 5
第二章
第二章 HTML网页设计技术的应用
2.1 HTML语言介绍
HTML(HyperText Mark-up Language)即超文本标记语言或超文本链接标示语言,是目前网络上应用最为广泛的语言,也是构成网页文档的主要语言。
HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部(Head)、主体(Body)两大部分,其中头部描述浏览器所需的信息,而主体则包含所要说明的具体内容。
2.1.1 HTML语言的特点
HTML文档制作不是很复杂,且功能强大,支持不同数据格式的文件镶入,这也是WWW盛行的原因之一,HTML语言的特点如下:
1、简易性,HTML版本升级采用超集方式,从而更加灵活方便。
2、可扩展性,HTML语言的广泛应用带来了加强功能,增加标识符等要求,HTML采取子类元素的方式,为系统扩展带来保证。
3、平台无关性。虽然PC机大行其道,但使用MAC等其他机器的大有人在,HTML可以使用在广泛的平台上,这也是WWW盛行的另一个原因。
2.1.2 HTML语言的编辑软件
HTML的本质是文本,需要浏览器的解释,HTML的编辑器大体可以分为三种:
1、基本编辑软件,使用WINDOWS自带的记事本或写字版都可以编写,当然,如果你用WPS来编写,也可以。不过存盘时请使用.htm或.html作为扩展名,这样浏览器就可以解释执行了。
2、半所见即所得软件,这种软件能大大提高开发效率,它可以使你在很短的时间内做出Homepage,且可以学习HTML,这种类型的软件主要有HOTDOG,还有国产的软件网页作坊。
3、所见即所得软件,使用最广泛的编辑器,完全可以一点不懂HTML的知识就可以做出网页,这类软件主要有Frontpage,DREAMWEAVER、Delphi、Eclipse、UltraEdit。
第三章 7 第三章 色彩在网页中的应用
3.1色彩在网页中的应用
色彩是艺术表现的要素之一。在网页设计中,我们的设计师根据和谐、均衡和重点突出的原则,将不同的色彩进行组合.搭配来构成美丽的页面。根据色彩对人们心理的影响,合理地加以运用。
先选定一种色彩,然后调整透明度或者饱和度,这样的页面看起来色彩统一,有层次感。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。
在网页配色中不要将所有颜色都用到,尽量控制在三至五种色彩以内。背景和前文的对比尽量要大以便突出主要文字内容。
3.2主页色彩的处理
色彩是人的视觉最敏感的东西。主页的色彩处理得好,可以锦上添花,达到事半功倍的效果。色彩总的应用原则应该是“总体协调,局部对比”,也就是:主页的整体色彩效果应该是和谐的,只有局部的、小范围的地方可以有一些强烈色彩的对比。在色彩的运用上,可以根据主页内容的需要,分别采用不同的主色调。因为色彩具有象征性,例如:嫩绿色、翠绿色、金黄色、灰褐色就可以分别象征着春、夏、秋、冬。其次还有职业的标志色,例如:军警的橄榄绿,医疗卫生的白色等。色彩还具有明显的心理感觉,例如冷、暖的感觉,进、退的效果等。另外,色彩还有民族性,各个民族由于环境、文化、传统等因素的影响,对于色彩的喜好也存在着较大的差异。充分运用色彩的这些特性,可以使我们的主页具有深刻的艺术内涵,从而提升主页的文化品位。
3.3常用的配色方案
1.暖色调。即红色、橙色、黄色、赭色等色彩的搭配。这种色调的运用,可使主页呈现温馨、和煦、热情的氛围。
2.冷色调。即青色、绿色、紫色等色彩的搭配。这种色调的运用,可使主页呈现宁静、清凉、高雅的氛围。
3.对比色调。即把色性完全相反的色彩搭配在同一个空间里。例如:红与绿、黄与紫、橙与蓝等。这种色彩的搭配,可以产生强烈的视觉效果,给人亮丽、鲜艳、喜庆的感觉。
第四章
最后,还要考虑主页底色(背景色)的深、浅,这里借用摄影中的一个术语,就是“高调”和“低调”。底色浅的称为高调;底色深的称为低调。底色深,文字的颜色就要浅,以深色的背景衬托浅色的内容(文字或图片);反之,底色淡的,文字的颜色就要深些,以浅色的背景衬托深色的内容(文字或图片)。这种深浅的变化在色彩学中称为“明度变化”。当然,色彩的明度也不能变化太大,否则屏幕上的亮度反差太强,同样也会使读者的眼睛受不了。
第四章 WEB页面信息的交互——窗体与框架
要实现网页的动态交互,必须掌握有关窗体对象(Form)和框架对象(Frames)更为复杂的知识。
4.1窗体基础知识
窗体对象可以使设计人员能用窗体中不同的元素与客户机用户相交互,而用不着在之前首先进行数据输入,就可以实现动态改变Web文档的行为。
4.1.1窗体对象
窗体(Form):它构成了Web页面的基本元素。通常一个Web页面有一个窗体或几个窗体,使用Forms[]数组来实现不同窗体的访问。
在Forms[0]中共有三个基本元素,而Forms[1]中只有两个元素。窗体对象最主要的功能就是能够直接访问HTML文档中的窗体,它封装了相关的HTML代码:
4.1.2 窗体对象的方法窗体对象的方法只有一个--submit()方法,该方法主要功用就是实现窗体信息的提交。如提交Mytest窗体,则使用下列格式:
document.mytest.submit()4.2 窗体中的基本元素
窗体中的基本元素由按钮、单选按钮、复选按钮、提交按钮、重置按钮、文本框等组成。
在JavaScript中要访问这些基本元素,必须通过对应特定的窗体元素的数组下标或窗体元素名来实现。每一个元素主要是通过该元素的属性或方法来引用。其引用的基本格式见下:
formName.elements[].methadName(窗体名.元素名或数组.方法)formName.elemaent[].propertyName(窗体名.元素名或数组.属性)下面分别介绍:
(1)Text单行单列输入元素
功能:对Text标识中的元素实施有效的控制。基本属性:
Name:设定提交信息时的信息名称。对应于HTML文档中的Name。Value:用以设定出现在窗口中对应HTML文档中Value的信息。defaultvalue:包括Text元素的默认值 基本方法:
blur():将当前焦点移到后台。select():加亮文字。主要事件:
onFocus:当Text获得焦点时,产生该事件。OnBlur:从元素失去焦点时,产生该事件。Onselect:当文字被加亮显示后,产生该文件。onchange:当Text元素值改变时,产生该文件。例:
...第四章
(2)textarea多行多列输入元素
功能:实施对Textarea中的元素进行控制。基本属性
name:设定提交信息时的信息名称,对应HTML文档Textarea的Name。Value:用以设定出现在窗口中对应HTML文档中Value的信息。Default value:元素的默认值。方法:
blur():将输入焦点失去 select():将文字加亮后 事件:
onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后,产生该文件 Onchange:当文字值改变时,产生该事件 Onselect:当文字加亮后,产生该文件(3)Select选择元素
功能:实施对滚动选择元素的控制。属性:
name:设定提交信息时的信息名称,对应文档select中的name。Length:对应文档select中的length options:组成多个选项的数组 selectIndex;该下标指明一个选项
select在中每一选项都含有以下属性: Text:选项对应的文字
selected:指明当前选项是否被选中 Index:指明当前选项的位置 defaultselected:默认选项 事件:
OnBlur:当select选项失去焦点时,产生该文件。onFocas:当select获得焦点时,产生该文件。Onchange:选项状态改变后,产生该事件。(4)Button按钮
功能:实施对Button按钮的控制。属性:
Name:设定提交信息时的信息名称,对应文档中button的Name。Value:用以设定出现在窗口中对应HTML文档中Value的信息。方法:
click()该方法类似于一个按下的按钮。事件:
onclick当单击button按钮时,产生该事件。例 :
10第四章 11........4.3窗体对象实例
下面我们演示通过点击一个按钮(red)来改变窗口颜色,点击“调用动态按钮文档”调用一个动态按钮文档。
test8_1.htm
调用动态按钮文档