《Dreamweaver网页制作》考核方案（精选9篇）
《Dreamweaver网页制作》考核方案 篇1
《Dreamweaver网页制作》课程考核方案
一：《Dreamweaver网页制作》课程的期末考试形式
基于本课程操作性较强的特点，在本学期对该课程实行上机设计考试，给出考试要求，提供操作素材，创建一个规模为5个页面的小网站（其中一个为网站的主页），分数为100分。考核重点内容有：站点的创建和组织；库项目的创建和应用；模板的创建和应用；网页的创建和页面的属性设置；Dreamweaver中网页的常用布局方法（表格、布局表格和层）；网页中文字、图像、多媒体的插入；常见的超级链接的创建；css样式表创建和应用； dreamweaver中自带的行为的创建（控制shockwave、弹出消息、弹出菜单、显示隐藏层）；制作时间轴动画等。
二：成绩评定办法
综合成绩 =平时成绩（100分）*10%+ 技能成绩（综合作业100分）*40%
+ 期末上机考试成绩（100分）×50%。
其中平时成绩为课堂考勤和课堂表现，满分为100分，打分依据是旷课、请假次数，以及课堂纪律和课堂提问情况等； 技能成绩主要是综合设计的大作业成绩，满分为100分；末考成绩是期末上机考试成绩，满分为100分。
《Dreamweaver网页制作》考核方案 篇2
优秀的交互式动画网页应具备以下特点:
1.动态性:通过醒目的动画吸引用户的注意力。
2.交互性:部分动画应当由用户的操作来触发, 并非单纯的播放。
3.链接性:部分动画可以链接到指定的网页或动画, 起到网页的最基本作用。
针对上述交互式动画网页的特点, 以及常用软件及方法的缺陷, 经我们研究及实验提出了新的解决方案:Adobe Image Ready+Macromedia Dreamweaver, 以下简称A+M方案。具体操作步骤如下:
一、动画的制作
软件:Adobe Image Ready3.0
Adobe Image Ready是由Adobe Photoshop演化而来的专门针对网页的动画制作软件。由于Image Ready与Photoshop已作为一套软件捆绑发售, 两者具有良好的数据共享交换功能, 使得Image Ready具备强大的图形处理能力。
首先使用Photoshop制作用于实现动画的图片, 由于此过程不属于本文讨论范围, 在此省略。再使用“跳转至Image Ready”功能将数据传送至Image Ready。
由于Image Ready是通过作用区域来实现交互式动画的, 所以得使用“切片”功能将图片按交互功能的作用区域分割成若干切片。对将要被用户操作的切片定义各种鼠标事件:悬停 (over) , 点击 (click) , 按下 (down) , 松开 (up) , 移出 (out) 。确定当某个切片被事件触发后将要产生动画的切片, 并对其制作相应的动画。
定义链接的作用区域, 可以对切片定义, 也可以定义为图像映射。Image Ready本身具有加入超链接的功能, 但由于其缺乏站点管理功能, 所以将这一工作留给Dreamweaver。
将动画输出为超文本文件 (html) , 这一步是决定文件大小的关键。实际上Image Ready是按切片的划分将图片分为几块, 再生成一个表格, 并将图片放入相应的表格中, 拼接成为完整的图像。所以可以将切片按性质的不同对切片进行不同的优化。Jpg格式文件较小, 但不能包含动画;gif文件较大, 但可以包含动画。所以在进行优化时应将不包含动画的切片存为jpg格式, 包含动画的存为gif格式。还要按照实际的要求对图片的质量进行有损压缩, 以取得更小的文件, 加快网页下载速度。
二、改进交互性
软件:Macromedia Dreamweaver4.0
Macromedia Dreamweaver是长期以来备受推崇的网页开发工具。Dreamweaver有以下特色功能:层 (layer) 、时间线动画 (timeline animation) 、行为 (behaviors) , 这些都是实现交互式动画的关键。
用Image Ready制作的网页还要用Dreamweaver进行再加工。最为重要的是改变鼠标事件的影响。用Dreamweaver打开网页后, 点击相应的图形区域, 在Behaviors一栏中可以看到一些鼠标点击事件所触发的代码, 将不必要的事件删去, 因为有一些动画会产生一些不必要的关联。经研究, 这一功能是通过自定义函数changeimage () 来实现的, 参数中包含的就是将要用来替换的文件。找到不必要的关联动画文件, 并记下其文件名, 在changeimage () 函数的参数中将这些文件去掉即可。
三、加入网页内容
由于图片构成了整个网页, 所以不能再在其上加入文字和web组件。此时只需要加入层, 并在其上加入文字或web组件, 然后再在需要超连接的文字或图片上加入超连接即可。对于一些需要条件才显示的内容, 则可以在事件上加入show hide-layer的方法来显示就行了。
四、需要注意的地方
当要改变图片内容时, 经常需要用Image Ready来重新生成html文件, 这样会将已加工好代码的html文件覆盖掉, 所做的代码工作就浪费了。此时只要对已经加工后的文件另存一份, 然后用Image Ready修改后再生成html文件, 并用新的图片文件覆盖原来的图片文件, 这样就可以避免代码丢失这一问题。
A+M方案可以克服常用软件和方法的缺陷, 做出交互功能强大且漂亮的交互式动画网页, 给访问用户耳目一新的感觉。该方案已在新晨网络AUTO OFFICE网站后台管理系统、四川轻化工学院学生处网站 (新晨版) 、自贡市公安局网站、重庆交通大学教学质量评估系统V3.0等B/S系统中运用, 并收到良好的效果。
摘要：本文针对Flash与Firework在制作交互式动画网页过程中的缺陷, 提出了新的解决方案, 即A+M方案。并对该方案的具体操作过程进行了准确的阐述。
《Dreamweaver网页制作》考核方案 篇3
网站的基本元素是网页，一个个的网页构成了一个完整的网站，网页也是可分的，构成网页的基本元素包括标题、网站LOGO、页眉、页脚、主体内容、功能区、导航区、广告栏等。这些元素在网页的位置安排，就是网页的整体布局。
标题
每个网页的最顶端都有一条信息，这条信息往往出现在浏览器的标题栏，而非网页中，但是这条信息也是网页布局中的一部分。这条信息是对这个网页中主要内容的提示，即标题。
网站LOGO
LOGO是网站所有者对外宣传自身形象的工具。LOGO集中体现了这个网站的文化内涵和内容定位。可以说，LOGO是一个网站的最为吸引人、最容易被人记住的标志。LOGO在网站中的位置都比较醒目，目的是要使其突出，容易被人识别与记忆。在二级网页中，页眉位置一般都留给LOGO。另外，LOGO往往被设计成为一种可以回到首页的超链接。
页眉
网页的上端即是这个页面的页眉。页眉并不是在所有的网页中都有，一些特殊的网页就没有明确划分出页眉。页眉往往在一个页面中相当重要的位置，容易引起浏览者的注意，所以很多网站都会在页眉中设置宣传本网站的内容，如网站宗旨、网站LOGO等，也有一些网站将这个“黄金地段”作为广告位出租。
主体内容
主体内容是网页中的最重要的元素。主体内容并不完整，往往由下一级内容的标题、内容提要、内容摘编的超链接构成。主体内容借助超链接，可以利用一个页面，高度概括几个页面所表达的内容，而首页的主体内容甚至能在一个页面中高度概括整个网站的内容。
主体内容一般均有图片和文档构成，现在的一些网站的主体内容中还加入了视频、音频等多媒体文件。由于人们的阅读习惯是由上至下、由左至右，所以主体内容的内容分布也是按照这个规律，依照重要到不重要的顺序安排内容，所以在主体内容中，左上方的内容是最重要的。
页脚
网页的最底端部分被称为页脚，页脚部分通常被用来介绍网站所有者的具体信息和联络方式，如名称、地址、联系方式、版权信息等。其中一些内容被做成标题式的超链接，引导浏览者进一步了解详细的内容。
功能区
功能区是网站主要功能的集中表现。一般位于网页的右上方或右侧边栏。功能区包括：电子邮件、信息发布、用户名注册、登陆网站等内容。有些网站使用了IP定位功能，定位浏览者所在地，然后可在功能区显示当地的天气、新闻等个性化信息。
导航区
如果说主体内容部分重要的话，导航区的重要性与其不相上下，甚至导航区的设计可以成为一种独立的设计，与网页布局设计分庭抗礼。之所以说导航区重要，是因为其所在位置左右着整个网页布局的设计。导航区一般分为4种位置，分别是左侧、右侧、顶部和底部。一般网站使用的导航区都是单一的，但是也有一些网站为了使网页更便于浏览者操作，增加可访问性，往往采用了多导航技术。
广告区
《Dreamweaver网页制作》考核方案 篇4
鄂尔多斯电视广播大学
毕业设计（论文）
题目：个人网站设计——个人网站建设
学 院：_鄂尔多斯电大 _ 专 业：计算机应用技术 班 级： 计算机班 姓 名：____s.____
2014年12月完成
I
鄂尔多斯电视广播大学毕业设计
摘 要
在Internet飞速发展的今天，互联网已成为人们快速获取、发布和传递信息的重要渠道，正以一种前所未有的冲击力影响着人类的活动。它在人们政治、经济、生活等各个方面发挥着重要的作用。因此网站建设在Internet应用上的地位显的格外重要，它已成为政府、企事业单位信息化建设中的重要组成部分。
现今的社会，人们已经离不开了网络，网络已经成为人与人之间交流的一种形式，它能够把事情的复杂化转为简单化，摆脱了时间和空间的限制。网站为很多人提供了一个网络生活空间，通过其网页展示了企业介绍、城市文化、校园文化介绍、招商信息、加盟程序、留言等一系列内容的介绍。为了更好的宣传和服务于经济发展，我通过制作一个网站来介绍宣传一下我的家乡。本文比较系统的阐述了有关网站建设方面的相关理论知识及该网站开发设计，充分体现了计算机技术服务于经济建设的重要思想。
关键词: 网站建设，Internet，城市
II
鄂尔多斯电视广播大学毕业设计
目录
第一章 前言...........................................................1 1．1课题来源.......................................................1 1．2 网站开发项目需求分析.........................................1 第二章 网页制作概述....................................................2 2.1 网页的类型......................................................2 2.1.1 静态页面..................................................2 2.1.2 动态页面..................................................2 2.2 网页开发技术....................................................3 2.3 网页布局........................................................4 2.3.1 网页布局的基本概念........................................4 2.3.2网页布局方法...............................................6 2.3.2 网页布局技术..............................................8 2.4网页配色........................................................9 2.5 网页设计流程...................................................10 第三章 涉及软件......................................................11 3.1 DreamWeaVer cs5介绍...........................................11 3.2 DreamWeaVer cs5操作界面.......................................11 第四章 建立网页链接..................................................12 4.1 文字链接.......................................................12 4.2 图像链接.......................................................13 4.3在HTML语言中建立网页链接......................................14 第五章 结论........................................................16 致 谢................................................................17 参考文献..............................................................18
III
鄂尔多斯电视广播大学毕业设计
第一章 前言
1．1课题来源
随着二十一世纪新兴科技的飞速发展，如今的信息产业正在经受着一个巨大的挑战，同时也面临着一个重大的机遇。就目前的科技发展水平而言，信息产业的发展已经不能够满足社会化大生产的要求，因此，各个国家集中人力、财力加大对信息技术产业的投入，以适应目前需要。可喜的是在这几十年的发展中我们有了互联网。互联网加大了我们了解世界的眼界，缩紧了人与人之间的距离，这就更容易的使我们走上信息化的道路。
互联网拉近了各个领域之间的距离，如今利用互联网来宣传已经是必不可少的工具，城市发展也需要互联网的宣传来带动自身的发展。
1.2网站开发项目需求分析
一个网站项目的确立是建立在各种各样的需求上面的，这种需求往往网站建设在Internet应用上的地位显的格外重要，它已成为政府、企事业单位信息化建设中的重要组成部分来自于客户的实际需求或者是出于自身发展的需要。在Internet飞速发展的今天，互联网已成为人们快速获取、发布和传递信息的重要渠道，正以一种前所未有的冲击力影响着人类的活动。它在人们政治、经济、生活等各个方面发挥着重要的作用。因此网站建设在Internet应用上的地位显的格外重要，它已成为政府、企事业单位信息化建设中的重要组成部分。
鄂尔多斯电视广播毕业设计
第 I 条 第二章 网页制作概述
2.1 网页的类型
网页有多种分类,我们笼统意义上的分类是动态和静态的页面,原则上讲静态页面多通过网站设计软件来进行重新设计和更改,相对的比较滞后，当然现在有网站管理系统，也可以生成静态页面~我们称这种静态页面为伪静态。动态页面通过网页脚本与语言自动处理自动更新的页面。2.1.1 静态页面
静态页面是网页的代码都在页面中，不需要执行asp,php,jsp,.net等程序生成客户端网页代码的网页。静态页面不能自主管理发布更新的页面,如果想更新网页内容,要通过FTP软件把文件DOWN下来用网页制作软件修改（通过fso等技术例外）。但是静态页面最大的好处是下载速度快，因为不需要程序运算和数据库连接。常见的静态页面以.html、.htm为扩展名的。并非网站上没有动画的就是静态页面[3]。2.1.2 动态页面
动态页面是通过执行asp、php、jsp、.net等程序生成客户端网页代码的网页。动态页面通常可以通过网站后台管理系统对网站的内容进行更新管理。发布新闻，发布公司产品，交流互动，博客，网上调查等，这都是动态网站的一些功能，也是我们常见的。动态网页是需要语言环境支持的，动态页面常见的扩展名有：.asp、.php、.jsp、.cgi 等。动态页面的“动态”是网站与客户端用户互动的意思，而非网页上有动画的就是动态页面[4]。
动态网页是最常用的网站建设的一种表达形式，其优点在于可以根据先前所制定好的程序界面，根据用户的不同请求返回相应的数据。可以说是一对多的关
鄂尔多斯电视广播毕业设计
系。从而达到资源的最大利用和节省服务器上的物理资源。如果今后需要改变站点风格，只需要重新制作前台所访问的数据即可。只要数据库结构不变，可以很快的进行改版的。
2.2 网页开发技术
动态网页开发技术介绍——HTML、ASP、JSP、CGI、PHP。
HTML（HyperTextMark-upLanguage）即超文本标记语言，是mon Gateway Interface(公用网关接口)。在早期，你可以使用不同的程序编写合适的CGI程序，如Visual Basic,Delphi或C/C++等。虽然CGI技术成熟而且功能强大，但由于编程困难，效率低下，修改复杂等缺陷，所以有逐渐被新技术取代的趋势。
ASP全名Active Server Pages，是一个WEB服务器端的开发环境，利用它可以产生和运行动态的、交互的、高性能的WEB服务应用程序。ASP采用脚本语言VB Script（Java script）作为自己的开发语言。ASP更精确的说是一个中间件，这个中间件将Web上的请求转入到一个解释器中，在这个解释器中将所有的ASP的Script进行分析，再进行执行，而这时可以在这个中间件中去创建一个*.html文件（静态网页）。PHP是一种跨平台的服务器端的嵌入式脚本语言.它大量地借用C,Java和Perl语言的语法, 并耦合PHP自己的特性,使WEB开发者能够快速地写出动态生成页面.它支持目前绝大多数数据库。还有一点，PHP是完全免费的[6]。
JSP 是Sun公司推出的新一代站点开发语言，他完全解决了目前ASP,PHP的一个通病－－脚本级执行（据说PHP4 也已经在Zend 的支持下，实现编译运
鄂尔多斯电视广播毕业设计
行）。Sun 公司借助自己在Java 上的不凡造诣，将Java 从Java 应用程序 和 Java Applet 之外，又有新的硕果，就是Jsp－－Java Server Page。Jsp 可以在Serverlet和JavaBean的支持下，完成功能强大的站点程序。
2.3 网页布局
网站主页就好象是宣传栏或者店面——对访问者产生第一印象，都希望尽量给人留下好的印象。
一般来说，好的网站应该给人有这样的感觉：
干净整洁；
条理清楚；
网页
专业水准；
引人入胜。
网页应该力求抓住而不是淹没浏览者的注意力，过多的闪烁、色彩、下拉菜单框、图片等会让访问者无所适从——离开是最好的选择，就象一些商店，播放震耳欲聋的发烧音乐，你要做的唯一决定就是离开那里，越快越好。(a)2.3.1 网页布局的基本概念
最开始，网页呈现在你面前的时侯，它就好像一张白纸，它需要你任意挥洒你的设计才思，可以创造出自己的设计方案。，虽然你能控制一切你所能控制的东西，但假如你知道什么是一种约定俗成的标准或者说大多数访问者的浏览习惯，那么你可以在此基础上加上自己的东西，这样你创造出来的网页才能更好的被别人接受。
（1）页面尺寸
鄂尔多斯电视广播毕业设计
由于页面尺寸和显示器大小及分辨率有关系，网页的局限性就在于你无法突破显示器的范围，而且因为浏览器也将占去不少空间，留下给你的页面范围变得越来越小。一般分辨率在800x600的情况下，页面的显示尺寸为：780x428个象素；分辨率在640x480的情况下，页面的显示尺寸为:620X311个象素；分辨率在1024X768的情况下，页面的显示尺寸为：1007x600。从以上数据可以看出，分辨率越高页面尺寸越大。
浏览器的工具栏也是影响页面尺寸的原因。一般目前的浏览器的工具栏都可以取消或者增加，那么当你显示全部的工具栏时，和关闭全部工具栏时，页面的尺寸是不一样的。
在网页设计过程中，向下拖动页面是惟一给网页增加更多内容(尺寸)的方法。除非你能肯定站点的内容能吸引大家拖动，否则不要让访问者拖动页面超过三屏。如果需要在同一页面显示超过三屏的内容，那么你最好能在上面做上页面内部连接，方便访问者浏览。
（2）整体造型
造型就是创造出来的物体形象，这里是指页面的整体形象。这种形象应该是一个整体，图形与文本的接合应该是层叠有序。虽然，显示器和浏览器都是矩形，但对于页面的造型，你可以充分运用自然界中的其它形状以及它们的组合：矩形，圆形，三角形，菱形等。
对于不同的形状，它们所代表的意义是不同的。比如矩形代表着正式，规则，你注意到很多ICP和政府网页都是以矩形为整体造型；圆形带表着柔和，团结，温暖，安全等，许多时尚站点喜欢以圆形为页面整体造型；三角形代表着力量，权威，牢固，侵略等，许多大型的商业站点为显示它的权威性常以三角形为页面整体造型；菱形代表着平衡，协调，公平，一些交友站点常运用菱形作为页面整体造型。虽然不同形状带表着不同意义，但目前的网页制作多数是接合多个图形加以设计，在这其中某种图形的构图比例可能占的多一些。
（3）页头
页头又可称之为页眉，页眉的作用是定义页面的主题。比如一个站点的名字多数都显示在页眉里。这样，访问者能很快知道这个站点是什么内容。页头是整个页面设计的关键，它将牵涉到下面的更多设计和整个页面的协调性。页头常放
鄂尔多斯电视广播毕业设计
置站点名字的图片和公司标志以及旗帜广告。
（4）文本
文本在页面中出现都数以行或者块(段落)出现，它们的摆放位置决定者整个页面布局的可视性。在过去因为页面制作技术的局限，文本放置的位置的灵活性非常小，而随着DHTML的兴起，文本已经可以按照自己的要求放置到页面的任何位置。
（5）页脚
页脚和页头相呼应。页头是放置站点主题的地方，而页脚是放置制作者或者公司信息的地方。你能看到，许多制作信息都是放置在页脚的。
（6）图片
图片和文本是网页的两大构成元素，却一不可。如何处理好图片和文本的位置成了整个页面布局的关键。而你的布局思维也将体现在这里。
（7）多媒体
除了文本和图片，还有声音，动画，视频等等其它媒体。虽然它们不是经常能被利用到，但随着动态网页的兴起，它们在网页布局上也将变得更重要。(b)2.3.2网页布局方法
网页布局的方法有两种，第一种为纸上布局；第二种为软件布局。下面分别加以介绍。
（1）纸上布局法
许多网页制作者不喜欢先画出页面布局的草图，而是直接在网页设计器里边设计布局边加内容。这种不打草稿的方法不能让你设计出优秀的网页来。所以在开始制作网页时，要先在纸上画出你页面的布局草图来。
首先，尺寸的选择。目前一般800X600的分辨率为约定俗成的浏览模式。所以为了照顾大多数访问者，你页面的尺寸以800X600的分辨率为准。
其次，造型的选择。先在白纸上画出象征浏览器窗口的矩形，这个矩形就是你布局的范围了。选择一个形状作为整个页面的主题造型，我们选择圆形，因为它代表者柔和，和时尚流行比较相称，然后在矩形框架里随意画出来，你可以试者在增加一些圆形或者其它形状。这样画下来，你会发现很乱。其实，如果你一
鄂尔多斯电视广播毕业设计
开始就想设计出一个完美的布局来是比较困难的，而你要在这看似很乱的图形中找出隐藏在其中的特别的造型出来。还要注意一点，你不要担心你设计的布局是否能够实现。事实上，只要你能想到的布局都能靠现今的HTML技术实现。如图2-1和图2-2
图2-1 手绘布局图 图2-2 布局图
考虑到左边向左凹的弧线，为了取得平衡我们在页面右边增加了一个矩形，(也可以是一条线段)如图2-3。
图2-3 布局图的改善
然后，增加页头。一般页头都是位于页面顶部，所以我们为图3增加了一个页头，为了和左边的弧线和右边的矩形取得平衡，我们增加了一个矩形页头并让页头相交与左边的弧线，如图2-4。
图2-4 页头的图示
然后，增加文本。页面的空白部分加别加入文本和图形。因为在页面右边有矩形作为陪衬，所以文本放置在空白部分不会因为左边的弧线而显得不协调，如图2-5。
鄂尔多斯电视广播毕业设计
图2-5 文本的图示
最后，增加图片。图片是美化页面和说明内容必须的媒体。在这里把图片加入到适当的地方，如图2-6。
图2-6 图片的图示
经过以上的几个步骤，一个时尚页面的大概布局就出现了。当然，它不是最后的结果，而是你以后制作时的重要参考依据。
（2）软件布局法
除了纸上布局，还可以利用软件来完成这些工作。如利用Photoshop。Photoshop所具有的对图像的编辑功能用到设计网页布局上更显得心应手。利用Photoshop可以方便的使用颜色，使用图形，并且可以利用层的功能设计出用纸张无法实现的布局意念。(c)2.3.2 网页布局技术
（1）层叠样式表的应用
在新的HTML4.0标准中，CSS(层叠样式表)被提出来，它能完全精确的定位文本和图片。CSS有点复杂，但它的确是一个好的布局方法[7]。曾经无法实现的想法利用CSS都能实现。目前在许多站点上，层叠样式表的运用是一个站点优秀的体现。比如一些企业网站。
（2）表格布局
表格布局被广泛使用，已经成为一个潜在的标准。随便浏览一个站点，它们一定是用表格布局的。表格布局的优势在于它能对不同对象加以处理，而又不用担心不同对象之间的影响。而且表格在定位图片和文本上比起用CSS更加方便。
鄂尔多斯电视广播毕业设计
表格布局唯一的缺点是，当你用了过多表格时，页面下载速度受到影响[8]。对于表格布局，打开一个站点的首页，然后保存为HTML文件，利用网页编辑工具打开它(要所见即所得的软件)，会可以看到这个页面是如何利用表格的。
（3）框架布局
由于它的兼容性，框架布局并没有被所有人接受。但从布局上考虑，框架结构不失为一个好的布局方法。它如同表格布局一样，把不同对象放置到不同页面加以处理，因为框架可以取消边框，所以一般来说不影响整体美观。
2.4网页配色
网站充斥着枯燥的设计，惠普、IBM、戴尔、微软，以及其他数不尽的网站（相似的布局，相似的配色）。这样一种标准化的界面可以使浏览更方便，但同时带给用户一种很世俗的体验，并不能与访客产生一种积极的联系。
面对这种单调的设计，有一种解决方法，就是使用颜色。可能没有其他设计元素能像颜色一样能影响人们对世界感受。颜色可以瞬间改变我们的情绪和意见。颜色会让我们感觉到舒适、敬畏，或者激动[9]。在界面设计中，颜色组合对设计非常有用。可以区分设计让用户更加难忘、引导用户使用户专注于交互、吸引用户使页面布局更舒适，更有魅力。
一旦有机会可以让网站更独特，就不能放弃。如果你的网站做的很醒目，那么用户可能会花更多时间浏览并且想是从哪里访问过来的，他们有可能记住这个网站并且下次再访问。可能没有比颜色更好的元素可以达到这样的效果了。人们会马上对颜色产生感觉：激动、高兴或者枯燥乏味。
当你试图在一个充满饱和色调的页面上浏览信息时，你的眼睛会不断地返回那些亮的颜色。最强的视觉元素是最重要的。我们趋向于忘记那些深蓝、黄色和灰色，因为每天都看到。在那些用户需要长时间在线使用的 Web 应用程序中，注意这一点尤为重要。不是很强烈的配色可以使用户专注于工作和接收重要信息。当然完美的 Web 体验不能仅仅依靠颜色，结构、交互、布局等方面也必须协同工作，来创建可用、易用的网站和应用程序。但是颜色是平衡中的重要部分，不能忽略。
鄂尔多斯电视广播毕业设计
2.5 网页设计流程
网页设计是一个互动的过程，不仅是设计师构思设计就可以完成的。从客户提出需求到最终发布，期间需要客户与设计人员共同参与协商才可以，具体流程如下：
首先，获取客户需求和资料。在设计网站页面之前，设计师需要知道客户的需求，从而确定客户建立网站的目的。客户提出网站需求是非常重要的一个环节。没有详细的需求，设计人员无法凭空进行设计制作。在这个步骤中，双方的沟通与交流是非常重要的。
其次，确定网站内容。设计人员选择适合自己的图像编辑软件、动画制作软件和网页制作软件进行网页的初步设计，这中间可能还需要和客户进行多次沟通才能达到客户满意的效果。在具体设计时，设计人员应该为网站定位一个主题，从而保证所有网页都围绕这个主题进行设计制作，保证风格的和谐统一。
然后，申请域名和空间。使用该方法能够有效同步管理文件。还可以通过FTP软件连接到服务器空间上，然后上传发布文件。
最后，后期维护。一般静态网站上传后，如果客户方没有专业人员维护，这样就需要设计人员从客户方获取新资料进行定期或不定期的更新。如果是动态网站，设计人员需要负责培训客户方如何使用后台管理，这样客户就可以自己通过后台管理添加信息，设计人员只要及时更正动态网站的错误即可。
鄂尔多斯电视广播毕业设计
第三章 涉及软件
3.1 DreamWeaVer cs3介绍
Dreamweaver CS3是Adobe(奥多比)公司收购Macromedia公司后推出的Creative Suite 3 设计套装中用于网页设计与制作的组件。作为全球最流行，最优秀的所见即所得的网页编辑器，Dreamweaver可以轻而易举地制作出跨操作系统平台，跨浏览器的充满动感的网页，是目前制作Web页站点,Web页和Web应用程序开发的理想工具。Dreamweaver，Fireworks，Flash被称为网页制作的“三剑客”，这三款工具相辅相承，是制作网页的最佳拍档
3.2 DreamWeaVer cs3操作界面
DreamWeaVer cs3界面设计友好，空间广阔，操作精微细致,是一种所见即所得的网页编辑器，既有效的减少了代码编写的工作量，也确保所设计文档的专业性和兼容性。，如图3.1所示。
鄂尔多斯电视广播毕业设计
图3.1 DreamWeaVer cs3操作界面
第四章 建立网页链接
网站实际上是由很多网页组成的，那么网页之间是如何联系的呢？这就是本章要讲的内容----网页的“链接”。“链接”，又称“超链接"（Hyperlink）,它作为网页的桥梁。网页中的很多对象都可以加入“链接”属性。在Dreamweaver 8中，如果以“链接”的媒介来划分的话，则“链接”可以分为“文字链接”、“图像链接”、“图像地图链接”、“内部链接和外部链接”、“E-mail链接”、“命名锚记链接”、“文件下载链接”和“跳转菜单”，共8种。
4.1 文字链接
“文字链接”即以文字作为媒介的链接，它是网页中最常被使用的链接方式，具有“文件小、制作简单和便于维护”的特点。接下来结合我的个人网站为实例，来讲解如何为文字建立“链接”。操作步骤：
步骤1、准备好已经制作完成的首页的各个栏目页面
步骤
2、在Dreamweaver 中打开首页，之后反白选取作为“链接”的文字。步骤
3、观察“属性面板”，其中包括一个“链接”文本框。步骤
4、接下来需要把链接的位址加入到文本框中。
鄂尔多斯电视广播毕业设计
步骤
5、在“链接”文本框下面还有一个“目标”下拉列表，从中可以选择链接网页显示的窗口方式，共有4种。如图：
步骤
6、还可以设置一些“链接”的属性，单击“属性面板”中的“页面属性”，选择其中的“链接”分类，可以进行的设置有“链接字体”、“大小”、“链接颜色”、“变换图像链接”颜色、“已访问链接”颜色、“活动链接”颜色及“下划线样式”。
步骤
7、至此，第1个栏目的链接就制作完毕了，按下Ctrl+S保存网页，再按下F12预览，测试一下，当鼠标放在“放松心情”这4个文字上时将变成手形，并且浏览器窗口下面的状态区中会显示链接到的网页的位址，单击文字，页面会立即跳转到第1个栏目中，这表示链接已经制作成功了。
步骤
8、同理，按照以上步骤，再为“闲情逸致”和“个人主页”等其它栏制作指向对应栏目的链接。
至此，整个“文字链接”的实例就全就全部完成了。
4.2 图像链接
“图像”也是常被使用的链接媒体，它和“文字链接”非常相似。为图像加入链接，首先应该在网页中插入“图像”，有关插入“图像”或“导航条”按钮的内容，接下来以我的网站“my web“为例，讲解如何建立“图像链接”。操作步骤：
步骤
1、首先仍然要准备好已经制作完成的首页和各个栏目的页面 步骤
2、在Dreamweaver中打开网站的首页，之后选取要制作“链接”的图像。
步骤
3、观察“属性面板”，在“链接”文本框中输入链接的文字位址。步骤
4、如果有需要，可以在“目标”下拉列表中选择“链接”网页显示的鄂尔多斯电视广播毕业设计
窗口方式，分别为-blank、-parent、-self或 top。
步骤
5、至此，第1个栏目的图像链接就制作完毕了，按下Ctrl+S保存网页，再按下F12预览，测试一下，将鼠标放在“动画制作”4个文字上时将变成手形，同时浏览器窗口下面的状态区中会显示出链接到的网页的地址，并且会显示出“替代”文本“动画制作”，单击文字，页面会立即跳转到第3个栏目中，这表示链接已经制作成功了。
步骤
6、同理，按照以上步骤，再为其它几幅图像制作指向对应栏目的链接。步骤
7、在栏目页面中制作“返回首页”的链接，使得单击后可以跳转回首页。
至此，整个“图像链像”的实例就全部完成了。
4.3在HTML语言中建立网页链接
一、文字链接
在HTML语言中用超链接标记指向一个目标。其基本格式为：举个简单的“文本链接”的实例，该实例相对应的HTML代码如下所示。
a href-“index2.html”target=”-blank”>平面设计（新开窗口，-blank)
相册（原窗口，默认为空）
《Dreamweaver网页制作》考核方案 篇5
无法忘记，刮风下雨时的恐惧。
无法忘记，不会做饭时做的馒头能砸死狗的笑话。
但我永远不会忘记，56班学生因我的脚崴了之后专门组成八人小分队，亲自背着老师
上下课堂；
我永远不会忘记，73班学生因为会考失败，自我反省，自我批评时感人肺腑的言语。
我永远不会忘记，同学们为了让“流动红旗”天天驻我家，天不亮就到校生好火炉，擦
洗桌凳，书声琅琅。
我永远不会忘记......我永远不会忘记，作为一名教师最大的幸福就是学生的幸福，家长说：“遇到一个好老
师是学生的幸福。”我要说：“遇到一批好学生是老师的幸福。”因为正是我们可爱的学生让
我明白了生命的意义，明白了人生的可贵，明白了“选择教师，就等于选择了奉献”。而今，我更加坚定了自己的选择。我庆幸我是一名教师，我有我的天堂，我有我的地盘。而且我的地盘，我做主。那就是：让每一朵鲜花都绽放，让每一个笑脸都灿烂，让每一个生命都怒放。
如果你是一缕阳光，那你就该温暖一寸土地。
如果你是一股春雨，那你就该滋润一片土壤。
如果你是一片绿色，那你就该装点祖国江山。
我是一名教师，我要甘撒一腔热血，于三尺讲台之上。
总之，在我的班级，我实行自主管理，发挥学生个性，民主管理班级，在竞争合作中求
得发展，实现了零流失，零迟到，零旷课，学习文化与能力提升并重，真正培养德才兼备的新型人才，深受广大家长的好评。我班成绩连续位列本县前茅。本人也被评为县优秀班主任，县教学能手，并代表我县参加市里的比赛。在我看来，金杯银杯不如老百姓的口碑，只要你
《Dreamweaver网页制作》考核方案 篇6
1 网页布局的原则
网页布局是决定网站美观与否的一个重要方面,通过合理的、有创意布局,才可以把文字、图像等内容完美地展现在浏览者前面。最好先用笔和纸将构思的草图画下来,不需要很详细,只需要画出页面的大体结构作为创作样本即可。布局的原则如下:
1)对称均衡:对称是一种美,能给人稳定感,但过度的对称就会给人一种呆板、死气沉沉的感觉,对称形式构成的网页具有重心稳定和庄重整齐的美感,均衡的网页生动活泼富于变化,具有变化美。
2)对比协调:对比使网页形式生动、个性鲜明,避免平淡无奇;对比协调则给人以柔和、亲切的美感。
3)比例适度:确立良好的比例关系,并非黄金分割,但一定要适度、协调,才能使整个页面和谐、匀称明朗。
4)疏密交错:网页上重复的形式过多,会使页面显得呆板,容易使浏览者产生视觉疲劳。因此不要整个网页一种样式,要通过留白、空格、改变行间距、字间距等变化来打破页面呆板、平淡的格局。
5)节奏韵律:韵律是使节奏富有律动感的变化美,将点、圆形、线条等沿一定的曲线重复排列时,就会产生韵律感,使画面显得轻盈而富有灵气。
2 在Photoshop中布局网页
1)首先在Photoshop中建一个1001×550像素的文件,这样在1024×768这种常规分辨率下,不会出现水平滚动条和垂直滚动条(长度1001像素是作者在多次实验中总结出的数据)。
2)一般情况下页面分头、中、底三个部分,如果看到别人的版面想借鉴的话,那就做个截图,然后把截图放在最底层,作为最初的草图。如果不想用别人的版面,最好也还是找一个同类网站借鉴一下。
3)参考线是布局网页的有效工具,先用横参考线将网页布局分成几大版块,然后再用竖参考线将每个板块按思路分为几个小板块,最后整体观察一下。需要注意的是网站的Logo和导航条等都是事先设计好的,有固定大小,在做这些区域时尺寸一定要按照这些元素尺寸设计,不能有丝毫差错,否则进入Dreamweaver整合时,则可能出现空边或撑开表格的现象。
4)导航文字的特殊字体要在Photoshop中直接添加上去,字体的颜色设置要考虑到整个页面效果,另外,如果想?制作出变化的导航效果,就复制对应的图层,设计好变化效果之后再隐藏该图层。将导航改变效果的图层进行切片的时候,保存另外一个名字存在另一个路径下,然后再将这些改变效果的图片拷贝到存放所有切片图片的路径下,为在Dreamweaver中替换图像做准备。
5)网页中的元素有很多,像Banner条、文本区域、文字、Logo等,尽量把这些相对独立的元素放在不同的图层中,这样方便以后的再编辑。
3 从Photoshop通向Dreamweaver的重要环节———“切片”
利用Photoshop设计网页之后,要进行“切片”,然后才能通过Dreamweaver进行加工制作。以下列举了切片的几个方法和技巧。
1)依靠参考线进行切片,在设计的时候用到参考线,在切图的时候也要用参考线,参考线能保证我们切出图在同一表格中的尺寸统一协调,有效避免“留白”和“爆边”。
2)Logo和导航条必须先切成图片,因为一般情况下,Logo和导航条都是特别设计的,尤其是导航条,只有必须经过切片后才能在Dreamweaver实现效果。
3)大图要切成小图,图片太大会影响网页浏览。把大的图切分均匀的小图,可以提高网页下载速度。
4)渐变效果一定要切,虽然渐变特效Dreamweaver可以实现,但其效果简单,无法给人以流畅的感觉,所以我们必须在导入Dreamweaver之前先切成图片,利用Photoshop的优势来美化。
5)虚线和转角形状必切,虚线和转角形状在Dreamweaver不能实现,因此只能使用Photoshop先切片,然后再通过Dreamweaver加工实现。
6)每个内容编辑区域可单独作为一个切片,在Dreamweaver中将该小“切片”删除后就是一个表格,可以在该表格中进行内容编辑。但并不是所有的图片都可以被删除。一般的做法是,图片被删除后,由于图片外围是表格,我们可以定义表格的长宽数值为图片的长宽数值,以保持整体图像的完整性。
7)有效存储切片。存储切片的文件夹必须位于站点的根目录下,文件夹名必须是英文名字。存储切片时用“文件—存储为Web所用格式”命令,选择路径通常在网站根目录下,保存文件名如index.html。这样切切后的图片都保存在了根目录下的images文件夹中。如果将导航改变效果的图层进行切片的时候,要将对应原图层隐藏,然后再执行一次“文件—存储为web所用格式”命令,保存另外一个名字如tihuan.html存在另一个路径下,然后再将这些改变效果的导航图片拷贝到根目录下的images中,为在Dreamweaver中替换图像做准备。
4 在Dreamweaver中加工网页
将切片后的网页在Dreamweaver中打开,如:index.html。其实整个网页是一个大表格,每个切片是个大表个划分的小表格。下面就进入网页制作阶段。以下列举了常用技巧:
1)在Dreamweaver中,如何输入一个空格呢?
Dreamweaver中对空格输入的限制是针对“半角”文字状态而言的,将中文输入法的“半角”摸时改称“全角”模式就可以了。
2)怎样才能够保证网页中文字不跟随浏览器字体大小设置而变动?
由于IE浏览器可以自由设置窗口内容字体的大小,这样由于用户的原因可能会导致显示上出现问题。怎样才能固定文字大小呢?办法就是通过CSS样式表对字体进行强制性控制,即不容许变化。新建一个样式表,选择“类型”,然后对文字的大小、字体、样式等进行修改,一般情况下,文字的大小选择12较为适宜。
3)怎么样才能为图片添加指定颜色的边框?
如果图片没有经过处理直接插在网页上,看上去很难看,这时如果给图片加上个边框,效果立马就不一样了。方法是新建一个CSS样式表,选择“边框”,然后对边框进行样式、宽度和颜色的修改。
4)怎样制作可以响应鼠标事件的翻转图片?
我们经常会在一些网页中看到当鼠标滑过时,能变成另外的样子。这是通过两张不同的图片来实现的,也就是所谓的“翻转图片”效果。方法是选择“行为”里的“交换图像”,然后点击“浏览”找到原文件和所对应的替换图片,当然你要提前准备两张大小完全一样的图片,这样才能保证翻转时不会产生视觉上的不适。
5)如何添加图片的提示信息?
在我们浏览网页时,当鼠标停留在图片对象或链接上时,在鼠标的右下有时会出现一个提示信息框进行注释说明,作用显而易见。方法是先选中图片对象,然后在属性面板中的“替代”输入框里输入需要提示的内容就可以了。
6)如何制作一个边框为1的表格?
如果是仅仅将“边框”值设为1,那么制作出来的表格要比1粗,并且看上去很不美观,如果将表格的“边框”、“填充”都设置为“0”,“间距”设置为“1”,并且设定整个表格的“背景颜色”如红色,同时设定单元格的“背景颜色”如白色,就制作出了一个边框为1的红格白底表格。
以上是对我多年设计网页的一个小结,通过Photoshop设计网页,通过Dreamweaver加工网页,以达到网页布局合理,页面精美的目的。综上,希望通过我的这些建议,可以对读者有所启发和帮助,实现自己的完美设计。
参考文献
[1]隋涌.网页布局之形式原理与设计要素[J].北京印刷学院报,2007(6).
[2]http://hi.baidu.com/cx901124/blog/item/1a6748513dbd726b8535248e.html.
《Dreamweaver网页制作》考核方案 篇7
关键词：网页界面,视觉导向,导向设计
用户界面设计是网页设计的重要组成部分。界面设计有以下几个基本的准则:界面的一致性、友好性、互动性。
1 网页界面设计中的视觉导向设计要素
1.1 页面布局的合理与统一
网页界面的布局设计没有一定的绝对的方式, 主要是从网站性质的开发需要、网站所表现的内容以及想要传达的信息考虑, 考虑适合表现、传播、开发等因素确定一种能够体现网站内容及主题的布局形式。
一般网站的网页布局设计方法是上左右式布局。这种布局的特征是通常在网页界面的上方设置为网站标志 (LOGO) 和主要的菜单导航条, 中部左侧为点击出现的细分栏目导航条和较主要的栏目及小广告等, 中部右侧为内容区域, 下方为网站相关版权信息。而电子商务、政府网站、教育机构比较喜欢的网页布局一般是上左中右布局或称为3分栏布局, 同上左右布局不同的是中间部分为内容区域, 右侧则是该网站较重要的内容导航区域, 或是登录、搜索区域、小广告等。
除页面布局合理统一外, 还要考虑页面尺寸的大小对用户浏览的影响。影响网页页面尺寸的因素有2个, 一个是显示器大小及分辨率, 另一个是用户使用的浏览器。目前常见的主流显示器的尺寸基本上在1 024×768及1 440×900之间。通常情况下, 页面以一屏能显示为好, 左右最好不拖动, 上下拖动一般不超过三屏, 目前一般常用的尺寸是:分辨率在800×600的情况下, 页面宽度应保持在778以内, 高度视版面内容决定, 全屏在778×432;分辨率在1 024×768的情况下, 页面宽度应保持在1 002以内, 高度视版面内容决定, 全屏在1 002×600。
除此之外, 还要考虑页面的整体设计对用户的心理影响。不同的形态会带给人们不同的视觉感受、心理感受, 如几何形体具有规整、秩序、严肃、稳定、单纯等特征, 有机形体有着勃勃生机、膨胀、优美、弹性等特征, 无规则形体则会有着具有人情味、温暖感、情趣性等特征, 矩形有有规则、稳定的感觉, 圆形代表着柔和、团结、温暖、安全等, 三角形代表着力量、权威、牢固、侵略等, 菱形代表着平衡、协调、公平。
1.2 界面元素的统一
网页界面中文字是较为主要的元素, 各级界面的文字的字体、字号、颜色、行距、字间距、排列方式等要统一, 如主要标题文字、二级标题文字、需要提醒的文字、具有超链接的文字、正文、标注文字、段落文字、公告文字等。其中必须重视的是文字必须是准确的, 文字的导向要考虑文字在不同的状态下出现的不同要求, 如具有超链接的文字最起码都具备正常、鼠标经过、鼠标点击的3个基本状态;静态的文字, 字体可以相对复杂、颜色可以多变、字号可以相对较小等, 动态的文字, 如在动画或在多媒体中出现或文字本身具有动态的效果, 文字字体就要简洁醒目, 字号要偏大, 文字内容要言简意赅。
1.3 元素功能性的统一
在网页界面设计中, 各种元素所承载的这些功能都必须有相同的操作方法。通过对这些元素的功能性的统一, 使用户在熟练使用了一个网页界面后, 切换到另外一个网页界面就能够很轻松的推测出各种功能, 让浏览过程变得轻松自然, 方便易用。
网页中的元素主要是图形和文字。在网页界面的设计当中, 我们往往不是做一两个界面, 而是有几十个甚至上百个的不同层级的界面, 我们就必须要把握住图形功能性表达统一。同时要注意避免与已经既有的、既定概念的图形标志混淆使用。如已经行业标准化、国家标准化、国际标准化的图标符号, 向公共信息图形符号、交通标志、安全标志、包装标志、环境保护标志、家用电器及办公设备、危险品等级图形标志、残疾人用图形符号。
网页界面中另外一个承载功能较多的就是文字元素了。在界面设计中, 必须要考虑让同个词语或同个字、同个句子所具备的功能是相同的。还有就是要把点击过或正在浏览的超链接与未点击过和未浏览过的超链接区分开来, 如可用不同的字体、字号及颜色等;图形链接可考虑采取不同的图形或者变为不可用状态、添加相关的提示等, 这样才有助于浏览用户理解整个网页。
2 网页界面设计中的视觉导向设计方法
2.1 直接使用静态文字、图形、图片等元素进行导向
这是最简单的一种视觉导向设计方法。其方法是在网页中需要的地方添加静态文字、图形、图片等元素, 并在该元素上添加页面的链接地址, 在用户浏览时鼠标指针在添加了链接的元素上变为手形, 单击后即可进入需要的网页。
这种导向设计方法简单, 适用范围广泛, 常用于网页当中的大量题目链接中, 如新闻标题、图片新闻、相关链接等处。
2.2 使用Dreamweaver的导航条来制作导向
网页中的导航条也是很重要的一种导向元素, Dreamweaver提供了插入导航条的功能, 利用该功能可以制作具有动感的导航条。
这种导航条通常具有4种状态——状态图像、鼠标经过时图像、按下图像和按下时鼠标经过图像, 其中“状态图像”是网页在被打开后的初始图像, “鼠标经过时图像”是浏览者将鼠标移动到导航条上时所显示的图像, “按下图像”是指鼠标按下时显示的图像, “按下时鼠标经过图像”是指鼠标点击后当鼠标再次移动到这个部位上时显示的图像。用这种方法制作导航条时通常和图形图像的编辑制作软件结合使用, 常用的方法是用图形图像编辑软件制作出大小相同、颜色不同的几类不同的图像 (依据导航条的数目而定) 。
一般地, 每部位只设一到两种状态的图像。因为图像太多了, 会影响网页页面的访问、浏览的速度。通常, 这种导航条横向放置在网页中LOGO的下方。
2.3 使用“行为”来使不同的导航在点击时出现不同的属性
另一种称为“行为”的机制, 可以帮助你构建页面中的交互行为。行为, 就是在网页中进行一系列动作, 通过这些动作实现用户与页面的交互。利用Dreamweaver的行为, 你不需要书写一行代码, 就可以实现丰富的动态页面效果, 达到用户与页面的交互。
Dreamweaver提供了一个“改变属性”的行为, 通过这个行为可以动态地改变对象属性, 比如图像的大小、文字的背景色等。如一段文字在静态时可以设计为一种背景色, 当鼠标移动到这段文字是时改变其背景色。
具体操作方法是:在“代码”窗口中, 为对象添加“DIV”标签, 单击行为面板中的加号按钮, 从弹出的菜单中选择“改变属性”命令, 设置“改变属性”对话框中的“对象类型”、“命名对象”、“属性选择”即可。
2.4 使用行为面板添加弹出式菜单导航
Dreamweaver提供了一个“显示弹出式菜单”的行为, 利用该行为可以添加弹出式的导航。
具体操作方法是:在“设计”窗口中, 选择需要添加弹出式子菜单对象, 单击行为面板中的加号按钮, 从弹出的菜单中选择“显示弹出式菜单”命令, 单击“显示弹出式菜单”对话框中的“继续”按钮后进行相关的设置即可。
参考文献
[1]曾广雄.中文Dreamweaver网页制作实例教程[M].北京:研究出版社, 2008:206.
[2]周奇.新编网页设计与制作教程[M].北京:研究出版社, 2008:185.
《Dreamweaver网页制作》考核方案 篇8
首先, 我们来看一则来自于智联招聘网站的招聘网页设计师的广告。“岗位要求:第一、大专以上学历, 美术或设计相关专业毕业, 热爱互联网事业, 网页设计与制作2年以上工作经验;第二、有良好的美术基础, 色彩感强, 具备优秀的审美和创意能力;熟练使用Photoshop、FLASH、Dream Weaver等网页设计制作软件, 熟悉Javascript、AS脚本语法、DHTML、HTML代码, 熟练使用CSS+div布局制作页面;第三、熟悉网站建设流程, 能独立承担中型网站项目的页面创意设计与制作, 具备与程序员配合开发的经验;第四、有良好的学习能力, 沟通能力和领悟能力, 工作效率高, 能够承受较大工作压力;有良好的团队合作意识, 耐心, 诚恳, 有强烈的责任心和积极主动的工作态度, 不怕困难并能适应加班及各种应急需求。”这样的招聘广告只要打开招聘网站便随处可见, 招聘人数少则三人, 多则十几人, 薪资也是三千至八千不等, 是一份高薪职业, 从这些招聘广告不难看出网页设计与制作的人才有广阔的市场, 我们培养出的高职生有广阔的就职空间, 但是从每年的用人单位反馈回的信息中都发现, 我们培养出的大部分高职生工作无法很快上手, 甚至到了用人单位需要重新学习, 这说明我们的教学方法有些过时了, 那么市场到底需要怎么的人才呢?笔者总结如下:
1.1 快速掌握行业里最新、最尖端的网络技术。
要想在网页设计行业有所成就, 当然要不断的学习掌握新技术, 可网络上的新技术淘汰的太快, 经常是没等我们弄懂就已经过时了。作为专业教师, 我会经常调整授课内容, 把最新的最实用的技术和思想传授给学生。时刻关注网络上的新动向, 出现的新技术, 保持旺盛的学习热情, 让自己时刻处于行业的前沿。只有这样才能培养出适应当今日趋激烈的市场竞争的人才。
1.2 技术扎实, 本领过硬。
根据市场的需要定向培养人才除了让学生掌握招聘广告中的内容, 还要让他们掌握更多的程序设计方面的知识, 比如Html、Css、Dhtml、Java Script、Asp等。让学生可以不用程序和策划部门的协同就能独立完成网页的设计。而且完成的效果还要很好, 这样的人才一但推向市场, 其受欢迎的程度可想而知。
1.3 有道德和社会责任感。
高职院校为社会培养应用型人才, 肩负着培养能力和社会责任感的双重使命, 尤其是培养网页设计师。当下, 有些人凭借自己学到的一些网页技术干一些触犯法律的事情, 在金钱的诱惑下迷失了自己, 也让网络朝不健康的方向发展推波助澜, 我们应该在授课过程中引导学生在从业过程中律己修身, 对自己的言行负责。特别是不能为追求短期利益而触犯法律, 认识到自己应该发挥特长为中国的网页设计发展做出自己的贡献。
2 传统网页设计与制作课程教学方法的不足
2.1 易学易丢。
笔者从事这门课程的教学工作有三年了, 对学生做了一些调查, 大多数学生都表示上课都能听懂, 图文并茂, 简单易学, 他们也很喜欢这门课程, 但是同时他们也反映上机课的时候还是要照着书一步步照着做, 老师教的很容易忘了。
2.2 网页缺乏美感, 没有创意。
从每次上机的情况来看, 学生制作的网页缺乏美感, 没有创意。例如在上表格与布局、表单、层、CSS样式表等内容时, 笔者发现学生们都是照葫芦画瓢, 教师做了什么样的演示, 学生就按部就班地只会做相应的操作, 知识没有经过他们思维的二次加工, 因此只能处于简单的记忆、模仿阶段, 根本没有自己的创新, 网站就不具备吸引眼球的魅力。究其原因, 传统的教学方法把学生的主体地位给剥夺了, 教师们忽略了应该在课堂上引入相关的行业知识, 美术知识, 色彩知识和网站策划知识, 并与Flash以及Fireworkers软件的使用相结合, 使我们的学生不仅在技术层面上会建网站, 还要能建好的、精美的网站。任务驱动教学法正好能够解决上述问题。
3“任务驱动法”在网页设计与制作教学中的运用
3.1 创设情境, 布置任务。
首先, 教师在在第一堂就给学生们布置给一个本课程的学习任务, 例如制作某公司网页或者个人网页, 在教学开始时, 教师应带学生们欣赏一些具有特色的网站, 将学生带入真实的学习情境中去, 然后引导他们一个完整的网站是如何建设出来的, 接下来, 教师要针对课程中每一部分知识点将总体任务细分为若干大任务, 如文本、图像、链接、表格、框架、CSS样式、层时间轴、模板和库等, 再将这些大任务进一步细分为一些小任务。任务应从易到难, 为使他们自觉主动地完成任务打下基础。
3.2 分析任务, 分组讨论。
对学生进行分组, 让学生们选出一个网站主题, 共同来完成一个网站, 并且告知学生团队一起做出来的网站将会有个比拼, 谁的网站做得好, 也会获得一个较高的分数。那么学生们就会积极参与进来, 并且他们会对呈现的任务进行仔细思考、分析和讨论, 提出完成任务需要解决的问题。例如, 在跑马灯效果的教学中, 教师先演示某一网站的跑马灯效果, 这时候积极引导学生如果将跑马灯效果运用在自己的网站中, 由于每个组的网站主题不同, 跑马灯的走向不同, 这个时候学生们就会积极思考并提问, 老师, 如何能够实现“上下跑”而不是“左右跑”?如何控制它的速度, 能不能让跑马灯再“炫”一点?这个时候教师给予适当的提示, 帮助他们解决问题。
3.3 自主学习, 积极探索。
经过了上述两个步骤以后, 学生们的学习积极性很快被激发出来, 学生们在课后会不断地完善的网站, 他们会自主探索或者协作开展探究活动, 在完成任务的过程中掌握新知识, 并将所学知识融会贯通, 进而运用到实际设计中去, 有的学生已经意识到要做一个漂亮的网站, 仅仅学习Dreamweaver是不够的, 已经有一定基础的学生会继续学习其他软件, 教师可以因材施教。
3.4 师生一起, 多元评价。
网页制作是门实践性强的课程, 对于教学的效果, 教师应该看重学生学生参与教学活动的态度, 解决问题的能力和创造性的发挥以及获取的经验与教训。评价是对学生能力的客观评价, 应该既符合社会的要求, 又有利于学生的个性发展, 可以采用多元的评价方式, 例如首先教师评, 然后学生评, 最后大家互评的方式, 这种多元评价方式即公平, 又让学生加强了经验的交流。
另外, 笔者所在的学院为了能够调动了学生的学习热情和学习主动性, 每一年都举行“网页设计大赛”, 让学生在比赛中展示自己的才能, 促进彼此的合作与交流, 这种活动对学生的实际动手能力有明显的强化作用, 对学生的求知欲和上进心有强烈的激励作用。
参考文献
[1]林铭.任务驱动教学模式中的协作知识建构[J].信息技术教育, 2009 (1) .
[2]钟志贤.信息化教学模式——-理论建构与实践例说[M].北京:教育科学出版社, 2005.
《Dreamweaver网页制作》考核方案 篇9
1《Dreamweaver网页设计》的教学现状
传统的教学模式是:教师往往只是灌输给学生一些基本的网页设计知识, 而忽视了对学生创新能力的培养, 不考虑其在工作任务中的地位和作用。结果大部分学生只能机械地使用Dreamweaver软件, 学过后什么东西都做不出来, 动手能力较差。改革教学方法, 把计算机理论教学和实践教学有机地结合起来, 是目前广大计算机专业教师亟待解决的问题。
而项目式教学法则是:教师在教学过程中以项目为主线贯穿始终, 将一门或多门课程中的知识点融入到项目中, 学生以完成项目为主要目的, 教师以学生完成项目质量来评定学生的学习效果。学生应全部或部分独立组织、安排学习活动, 处理项目工作中遇到的细节和困难。学生在一种团队环境 (即项目开发小组) 下进行探究性学习。在完成项目过程中可以提高学生的协作沟通能力、研讨、组织、演示讲解等基本能力。建构主义的创始人、瑞士著名心理学家皮亚杰认为:获得知识和技能的最有效方式不是通过教师传授, 而是让学生在一定的情景下, 利用必要的学习资料, 借助他人 (包括教师和同学) 的帮助, 通过意义建构的方式获得。教师则需要有指导项目完成的专业综合能力、组织能力、控制能力、鼓动能力等。项目教学法能较好地将理论和实践结合在一起, 是典型的以学生为中心的研讨性学习。此种教学方法对教师的要求很高, 对学生的综合素质提高较大, 也是对传统教学方法的一种改革。
根据《Dreamweaver网页设计》课程特点和教学目的, 在教学中我采用了项目教学法, 打破了传统的教学模式, 改革教学方法、教学手段及考核形式, 将实际项目引入课堂教学, 通过实施一个个完整的项目来组织教学活动, 在课堂教学中注重把理论和实践有机结合起来, 充分挖掘学生的创造潜能, 提高学生解决实际问题的综合能力, 学生具有更高的积极性, 进一步提升了学生的技能。
2 项目教学法的教学实施过程
2.1 确立项目
实用、优秀的项目是项目教学法实施成功与否的关键所在。项目教学的教学过程重点在于师生共同努力完成一个具有实际意义的项目的开发。因此, 在实施项目教学法时, 首先应该确立切实可行的项目。所以在确定项目时应综合考虑以下几方面的因素:首先所选项目应紧扣教学大纲和教学目标;其次项目的难易程度应适宜学生的年龄段;再次, 项目应与学生的生活环境或认知有关;最后项目要被大多数学生喜爱, 并可以用某一标准 (正确答案、美感等) 公平准确地给予评价。根据学生的特点, 本课程我们可以确立一个制作具有交互功能的“在线购物网站”项目。
2.2 项目前期的准备
项目教学的准备包括教师的准备和学生的准备两大方面。教师的准备主要是在项目实施之前精心地进行课前准备工作, 如对项目任务的分析和研究、大量资料的查阅等。作为任课老师, 可以根据教材将教学内容编写一个大的框架。在教学中根据框架内容围绕着一个大项目展开。其中知识点的讲解主要采用案例教学模式。从本质上讲, 案例教学只是教师通过运用已经存在的案例对学生进行应用能力方面的培训和提高熟练程度, 当然知识点必须全都融入到案例中。就是这样先采用案例进行教学, 通过案例增强学生对知识点的理解与掌握。然后通过项目, 让学生把知识点学会融会贯通。随着框架内容的进行, 项目会越来越大, 项目中包含的知识点也越来越多, 难度自然也就越来越难, 研究的也就越深入。学生的准备则因项目教学是以学生为主体的开放式教学, 学生需要提前阅读相关教材学习一定的知识, 收集一定的相关资料。比如在这门课程中, 学生必须提前学习和了解超链接、图像映射、框架网页、Web站点的发布等知识。同时, 师生应共同讨论, 制定项目计划, 主要是通过对课时的调整, 把几课内容合理地联系在一起, 使原本独立的几课有所联系, 并能有所创新地来进行教学, 使学生的知识能层层递进。
2.3 项目过程的实施
第一步当然是先进行分组。分组时, 要以互补为原则, 综合考虑学习成绩、学习能力、性格气质、男女比例等因素。项目开发小组是教师实施项目化教学的平台, 一个好的开发小组能让全体成员积极性和创造性得到最大程度的发挥, 能让差生及时得到帮助, 能让好生在帮助别人的过程中得到提高, 同时能极大地减轻教师指导学生方面的负担。因此要在充分了解学生的基础上, 结合学生的心理特点和性格类型, 做好小组成员的搭配和小组长的人选物色工作, 使小组成员之间能融洽相处, 互相帮助, 合作学习, 共同进步。一般六人组成一个合作小组, 并推行一名组长。
第二步是按计划完成项目任务, 在这个阶段中, 必须保证学生学习的相对独立性。各组可以先商量确定具体的几个子项目任务, 然后在任课教师的引导下, 决定各项内容的先后步骤、总体风格、制作素材等, 并分工收集需要的参考资料及制作材料, 然后逐一完成子项目。比如在完成在线购物网站这个项目的时候, 可以分工收集所需的在线产品的资料、图片、数据信息等, 并引导组内同学设计出特色的网站界面, 共同研究在线交互功能的实现。最后进行测试和发布。
第三步则是在学生完成网站建设后, 撰写开发总结报告, 总结项目学习、开发的收获和经验, 为下一次开发做准备。阶段性总结评价也是项目具体实施过程中必不可少的环节。教师和学生在每个阶段的学习结束后, 都要对该阶段的学习成果进行展示、评价、总结, 及时改进不足之处, 巩固成果, 为后续工作打下坚实的基础。
第四, 项目成果的展示和反馈评价。
项目完成后, 必须有项目产品的展示交流和反馈评价, 才能进一步提升学生的能力。应对网站项目的建设成果在全班同学面前进行展示, 并加以讲解。在讲解展示网站的过程中, 学生和教师可以提出问题, 并结合相应的网站项目评分表, 形成学生和教师对该项目各自的评价。在对学生进行评价时, 还应结合其在项目开发过程中的学习能力、合作能力、参与程度、服务程度以及所起作用等各方面的表现情况进行评价。可先由学生自己进行自我评估, 之后再由任课教师对项目工作成绩进行检查评分。师生共同讨论、评判在项目工作中出现的问题、学生解决问题的方法及学生的学习行为特征。通过对比师生的评价结果, 找出造成评价结果差异的原因。
项目教学法教学目的明确, 充分调动起了学生学习的积极性, 发挥了学生的主体作用。经过在教学中的探讨与实践, 已经取得了明显的成效。项目教学法在《Dreamweaver网页设计》课程中有其独特的优势, 进一步提高了教学效率。
摘要：本文针对中等职业学校在《Dreamweaver网页设计》实际教学中存在的一些问题, 提出了利用项目教学法进行教学的新模式, 并对如何在该课程中利用项目教学法进行教学作了具有实践意义的探索。
关键词：项目教学法,Dreamweaver网页设计,应用
参考文献
[1]郑金洲.项目教学指南[M].华东师范大学出版社, 2000 (12) .