网页设计师学习课程

网页设计师学习课程（精选8篇）

1.网页设计师学习课程 篇一

随着学习进度的逐渐加快，学习的内容也逐渐开始变多、变难，不再像一开始那样老师一讲完就可以马上上手把网页做出来。自然而然的，在制作网页的时候也不再像一开始那样顺利，总会出现各种各样的错误。不过对于学习上的问题，老师在课堂上也会尽可能地为我们解答，并且为我们提供了很多练习的机会，这使得我即使在面对一些困难的问题时，也能沉着地应对。

不过课堂时间毕竟是短暂，仅仅靠一周两个课时的课堂学习时间想要把网页设计制作完全学习得很好是不可能的事。再者网页制作在我看来是一门实践重于理论的科目，如果仅仅学习了理论知识却不付诸实践，那对学习实际上是毫无助益的。因此在课余的时间里，老师给我们布置了与所学内容相对应的课外作业。在完成课外作业的时候，如果遇到了难以解决的问题，我会回顾老师上课时用的课件寻求解决的办法，与此同时，也在间接地巩固知识。

因此，尽管过程并不都是一帆风顺，但经过本学期的学习与实践，我也逐渐掌握了网页设计制作的一些基本技能与知识。虽然明年就大四的我以后大概是不会再像这个学期那样有学习网页制作的课程了，但我会利用课余时间通过自学了解、学习更多关于网页设计制作的知识，掌握网页设计制作的技能的。

自己怎么制作简单网页

首先在设计制作网页之前，你要却确定你的网页内容是什么?一个网站必须要有一个明确的主题。特别是对于个人网站，必须要找准一个自己最感兴趣内容，做深、做透，办出自己的特色，这样才能给用户留下深刻的印象。主题要鲜明，在你的主题范围内内容做到大而全、精而深。然后针对你的内容找到相关的资料。接下来就是具体的制作步骤了：

第一步：创建一个文本文档 你需要创建一个文本文档包含单词,你想要出现在您的Web页面。只要你给你的文档名称结尾，大多数文字处理程序将会工作的很好。思考逻辑的地方插入你的文本。

第二步：学习基本的HTML标记 现在您需要插入一些格式化标记你的文档,会告诉一个互联网浏览器如何安排你的文字和图片在屏幕上。这些标签组成一个语言称为超文本标记语言,或者HTML。

第三步：查看一个示例Web页面

你或许在阅读会感到有点困惑,这是为了看一个实习的HTML文档更简单，然后看看它是怎么被翻译成一个Web页面。您可以查看“源文档“后边的任何Web页面将“视图”菜单(在Safari——其他的浏览器或许略有不同)并挑选“查看源代码。“当你这样做时,你会看到文档和HTML标签,创立页面当时在你的浏览器窗口。

第四步：获得电子图像 如果你还没有制作主页的图像文件,您可以下载一些来自其他Web页面。用你的常识来决定哪些图片你可以使用,哪些你不应该。根据什么样的电脑和浏览器你正在使用,你必须使用一种稍有不同的程序下载到你的硬盘映像。这里可以使用Safari浏览器: 使用鼠标指针的位置在图像——按住鼠标按钮并拖动图像到你的计算机的桌面——放开按钮,您将看到一个小图标。这时图像已经下载到你的硬盘。确保你的文件名称和格式——点击图标来查看图像,因为它将出现在您的Web页面。

第五步：插入HTML标签

如今您现已准备好插入格局符号在您自个的文档。记住要开始您的文档与< html >和完毕它与< / html >。你类型符号之间的<标题>…< /标题>将出如今你正在阅读网页阅读器窗口的顶端。

第六步：查看和编辑您的页面

保存您的文本文档和返回到浏览器。在文件菜单中,选择“打开文件…”或“另存为…”。从那里你应该能够找到你的文档的名称并点击“开始”。你的文档将会出现在你的窗口,看起来就像个网页了!

第七步：上传

您需要有一个互联网服务提供商,允许您将您的网页页面在一个服务器上，这样其他人能够阅览它。假如没有,您能够继续操练与文件在您的计算机的硬盘。能够找到一些其他网站的页面相关的一些办法。他们可能会添加一个链接到你的页面注册您的网站查找引擎如google或雅虎。一旦你添加你的URL其间一个数据库,感兴趣的人通常主题你的页面将得到一个清单,你的网站当他们做一个查找。

另外，这边有一些软件可以利用，一款功能强大、使用简单的软件往往可以起到事半功倍的效果。比较常用的优秀软件有Dreamweaver和Frontpage，如果你是初学者Frontpage是首选。除此以外还有Photoshop、Photoimpact等。另外还有一些能够用于动态网页设计的软件。那么，有了这些，即使不同网页设计的菜鸟们也可以按照规划一步步地把自己的想法变成现实了，快快尝试一下自己制作网页吧!要记得，网页做好之后，还要不断地进行宣传，这样才能让更多的朋友认识它。

2.网页设计师学习课程 篇二

1 下拉式菜单的制作

现以DW CS6中Spry菜单栏组件为例说明水平式下拉式菜单的制作过程。

1.1 插入 Spry 菜单栏组件

利用DW的插入菜单或插入面板将Spry菜单栏组件插入到某个Div元素或某表格单元格中,从而固定菜单位置。当Div元素元素宽度为500px时,在DW的网页设计视图中得到如图1所示菜单,默认情况下有4个菜单项。用鼠标选中Spry菜单栏组件,可在窗口下方属性面板修改菜单项,如“项目1”等的名称,通过“+”、“-”按钮增加、删除菜单项,并设置各菜单项对应的链接URL和目标窗口或框架。

1.2 调制菜单项的宽度

如图1所示,默认情况下各菜单项不一定在同一行,这是因为各菜单项宽度和超过Div元素宽度,因此,要调整菜单项宽度。

进入DW的网页代码视图,可找到DW生成的与菜单有关的一段Html代码:

(1)设置整个菜单栏组件的宽度

DW为Spry菜单栏组件生成了一系列CSS规则, 观察上述 代码 , 可发现该 组件所占 宽度可用MenuBarHorizontal选择器对应的CSS规则控制,双击CSS面板中的该选择器,可在CSS规则定义对话框中调整有关属性,如图2所示,可调整“方框”宽度属性为auto或为外部Div元素元素的宽度500px。

(2)设置菜单项的宽度

用鼠标点击菜单项“项目2”的边框线选中该菜单项,然后可在窗口下面的属性面板设置其宽度,单位可为百分比(%)或像素(px),如图3所示,此处设为25%。调整后4个菜单项正好横排占满Div元素。另外,对照DW为Spry菜单栏组件自动生成的CSS规则,可发现菜单项由ul.MenuBarHorizontal li选择器对应的CSS规则控制,同样可用CSS规则定义对话框调整宽度。

子菜单项“项目1.1”等的宽度也可用窗口下面的属性面板设置。另外,也可采用ul.MenuBarHorizontal ul和ul.MenuBarHorizontal ul li同时设置。

1.3 设置菜单项文字的属性

超链接建立在菜单项文字之上,因此,菜单项文字的属性 (字体、背景颜色、对齐方式等) 可用ul. MenuBarHorizontal a选择器对应的CSS规则控制,进行相应设置即可。

经过上述设置后,菜单一般能满足要求。

2 树形目录的制作

树形目录非常适合展示具有层次关系的数据和超链接。Visual Studio 2010[6]、ExtJS等软件含有树形目录组件,但DW CS5、6没有树形目录组件。可以从网络上搜到一些制作树形目录的代码。下文介绍利用bassistance.de网站[7]提供代码压宿包(jquery.treeview. zip)制作含静态树网页的过程。

(1)下载压宿包并解压到自制网站的某个目录下。

(2)在解压生成的演示文件夹demo中含有多个html文件,它们中含有各种形式的树形目录,选择一个最合适的html文件作为模板再修改便可,现假定选中large.html进行编辑。

(3)在网页设计(或代码)视图中将树以外不需要的内容、网页元素删除,得如图4所示原始树目录。

(4)现假设要制作一本书的目录,希望该树目录在浏览器中展开后效果如图5所示。

将图4中原树目录中的条款改成各章、节、款的名称即可,如将“Home”改成“第一章网页设计基础”。不需要的条款可用退格(BackSpace)删除。若要在某条款下增加一条款,则将光标移至该条款后按回车(Enter) 即可。若要调整某条款的逻辑层次,则可选中该条款, 再用属性面板的凸出或缩进按钮调节;但反复调整时,有可能使树形目录在浏览器中不能正常显示,此时可以将所有条款调整为同一层次,即垂直对齐,然后再从上到下重新调整各条款层次;也可进入网页代码视图修改,图4所示树目录正确代码如下:

由此可见,整个树用项目列表元素 <ul>…</ul> 表示,条款x用列表项元素表示,即 <li> 条款x </li>,当条款x后含有子条款时,则子条款构成的树又用项目列表元素表示,且嵌套于列表项元素中,即 <li> 条款x <ul> 子树 </ul> </li>。若标签不符合这种排列组合规律可以手工修改。

(5)利用treeview li选择器对应的CSS规则调整各条款的字体大小等属性。

(6)设置超链接属性。

对超链接有无下划线、颜色等进行控制,可在网页文件代码视图的头元素中添加如下CSS规则表:

在DW设计视图中编辑出如图6所示格式的目录,此目录在浏览器中效果即如前文图5所示。

(7)含树形目录的网页一般与框架网页配合使用, 故此后要设置相应的框架网页。

(8)修改条款上原有的默认超链接或在条款上添加超链接,即设置URL、目标窗口或框架等。

3 结束语

下拉式菜单和树形目录常被用作导航界面组件, 利用它们组织超链接可使网页简洁明了。但是一般的网页制作教材对它们介绍不详细或没有介绍。鉴于这两种导航方式的实用性,在教学中可以超越一般的教材而作出较详细的制作过程介绍,这能被不具备JavaScript、ExtJS、jQuery编程知识的人员所接受。

在介绍网页设计与制作课程时,要鼓励学生充分利用网络上的学习资料和代码资源,决不能拘泥于教材的学习。

摘要：下拉式菜单和树形目录常是两种常用的网页导航界面元素,但一般的网页制作教材介绍不详细或没有介绍。为了满足教学需要,文章介绍了利用DreamWeaver CS 6中的Spry菜单栏组件制作下拉式菜单的过程和利用jquery.treeview插件制作树形目录的过程,该方法不要编写程序,学生易于接受。

3.网页设计专业课程设置的研究 篇三

【关键词】:网页设计 新媒体 团队合作 课程设置

中图分类号:G4文献标识码:A 文章编号:1003-8809(2010)-06-0102-01

近些年来,全国各大院校相继开设了网页设计专业,有些院校称为“新媒体专业”,这主要是因为平面媒体、广播媒体、电视媒体曾被公认为三大传统媒体,网络媒体的出现在某种程度上彻底改变了这种垄断局面,这一点从日益繁荣的网络科技和数码产品中得到了充分的体现,所以不用过多的解释。由于这个专业只是近几年才出现的,所以在很多教学方法和课程设置方面还存在很多的缺陷和问题,为了更好的开展网页设计教育,让学生掌握更多更实用的网页设计技术,我决定对网页设计专业的课程设置进行详细的探讨和研究。以下是我与几位专业教师在查阅了大量的相关资料和结合了很多网页设计公司工作实践的前提下,得到的结论。

作为一个正在崛起的发展中国家,可以说潜在的市场空前的强大,然而纵观亚洲网页设计的发展进程,不难发现,中国的网页设计还远远落后于日本和韩国。其实不仅仅是网页设计,在平面设计、产品设计和建筑设计等方面,中国发展和执行的也不够好,当然,造成这种局面的原因有很多,比如政治因素和历史因素等等,这不在我们讨论的范围之内,所以不作为重点,幸而近几年来这种局面有所改善。

抛开外在因素,单纯的从设计本身来说,其实网页设计和其它设计门类一样,最根本的问题都是在解决“功能”与“形式”之间的矛盾,只不过这些矛盾在建筑设计和产品设计中得到了相对完善的解决,而在网页设计中却始终没有得到应有的重视!这也是为什么国内大部分的门户网站看上去版面都很拥挤和低劣的主要原因。其实网页设计是一门综合艺术,它要求从业人员不仅仅只局限于平面设计方面的知识,同时还必须具备计算机语言方面的能力,因为,只有这样才能设计出资源优化的高品质网站。然而当今大部分国内院校的网页设计专业都经历着各自为政的尴尬局面,一方面艺术设计院系,只注重培养艺术方面的设计人才,另一方面计算机院系,只注重培养技术方面的设计人才。这就使“功能”与“形式”之间产生了断层,虽然我承认纯搞技术的程序员也可以根据网上现有的模板,勉强完成网页设计中美工的工作,但是这毕竟是一种“抄袭”的被动方法,不能从根本上提高中国网页设计的艺术品位。在国外我们可以要求网页设计师必须先修完一个艺术设计方面的学位,然后再完成一个计算机方面的学位,在国内这种做法显然是不现实的。要想让中国的网页设计朝着健康的方向蓬勃发展,就必须想办法把两个专业的相关技术拿到一起。结合中国高等教育的实际情况,我对网页设计专业的课程设置进行了如下的整合:

网页设计课程体系设置的初步构想(根据时间的先后顺序排列)

01、平面构成

02、色彩构成

03、创意思维训练

04、图形设计

05、设计软件PhotoShop、Illustrator(版本根据实际情况而定)

06、标示与VI设计

07、网页版式设计

08、设计软件Flash、Dreamweaver(版本根据实际情况而定)

09、ActionScript:用于控制flash内容,并进行简单交互的脚本语言

10、Flash实训项目练习

11、Dreamweaver实训项目练习

12、网站设计实训项目练习(静态)

13、Html:Hyper Text Markup Language超文本标记语言

14、Css:Cascading Style Sheet层叠式样式表

15、Div:Div+Css一种全新的网页布局思想

16、JavaScript:一种最流行的Web脚本语言

17、Asp:Active Server Pages 一种动态网页编程语言(了解)

18、Asp.net:Asp的替代产品 一种动态网页编程语言

19、Php:Personal Homepage Program 一种动态网页编程语言(重点)

20、Jsp:一种动态网页编程语言

21、Ajax:异步信息通信技术

22、Smarty:模板技术

23、MySql:一种数据库类型

24、Oracle:一种数据库类型

25、综合设计项目一(独立完成)

26、团队合作技巧

27、综合设计项目二(团队合作)

28、应聘技巧

29、毕业设计

综合性人才是未来教育发展的必然趋势,经过整合的课程体系,主要从三个方面入手,

课程设置中平面构成、色彩构成、创意思维训练、图形设计、标示与VI设计、网页版式设计都属于第一个方面,注重培养网页设计师的艺术修养和设计理论。PhotoShop、Illustrator、Flash、Dreamweaver、ActionScript、Html、Css、Div、JavaScript、Asp、Asp.net、Php、Jsp、Ajax、Smarty、MySql、Oracle和一些实训项目练习属于第二个方面,注重培养网页设计师的技术能力。第三个方面主要注重培养网页设计师的团队合作技巧和实际工作经验。

这里有一个问题需要事先声明,从事艺术工作的人大部分都习惯于感性思维,从事计算机工作的人则习惯于逻辑思维,让两种思维方式协调统一,当然存在一定的难度,这就要求从事网页设计教育工作的专业教师必须具备高水平的专业能力和科学的教学方法。相信经过这样完善的课程训练之后,我们的学生一定能够扎实熟练的掌握网页设计的相关知识,在世界经济危机的影响下,更具竞争力和主动权。

作者简介:

4.网页课程设计报告2 篇四

计算机是科学于艺术的完美结合。我具有一定的音乐艺术基础，并且对音频视频的艺术设计有着浓厚的兴趣，所以我在暑假期间，自学了《Cool Edit pro2.1》，《Adobe Premiere pro2.0》，《After Effects》的一些相关知识以及一些其他的相关软件,下面我来谈一谈我个人的一些见解

首先我来简单的谈一谈我对音频处理技术的个人见解。我在中学时期考取了二胡八级证书，同时我对音频的创作以及后期处理比较感兴趣。下面我来简单的介绍一下《Cool Edit pro2.1》。

Cool Edit 2000是一个功能强大的音乐编辑软件，可以运行与Windows 95/NT下，能高质量地完成录音、编辑、合成等多种任务，只要拥有它和一台配备了声卡的电脑，也就等于同时拥有了一台多轨数码录音机、一台音乐编辑机和一台专业合成器。

Cool Edit 2000能记录的音源包括CD、卡座、话筒等多种，并可以对它们进行降噪、扩音、剪接等处理，还可以给它们添加立体环绕、淡入淡出、3D回响等奇妙音效，制成的音频文件，除了可以保存为常见的.wav、.snd和.voc等格式外，也可以直接压缩为MP3或Cool Edit 2000（.rm）文件，放到互联网上或email给朋友，大家共同欣赏，当然，如果需要，你还可以烧录到CD上。甚至，借助于Cool Edit 2000对采样频率为96kHz、分辨率为24位录音的支持，你还以制作更高品质的DVD音频文件。

用Cool Edit 2000编辑声音，与在字处理器中编辑文本相似，一方面，都包括复制、剪切和粘贴等操作。另一方面，都须事先选择编辑对象或范围，这些操作才有意义，对于声音文件而言，就是在波形图中，选择某一片断或整个波形图。一般的选择方法有，在波形上按下鼠标左键向右或向左滑动，如果要往一侧扩大选择范围，可以在那一侧右击鼠标，要选整个波形，双击鼠标即可。此外，Cool Edit 2000还提供了一些选择特殊范围的菜单，它们集中在Edit菜单下，如Zero Crossings（零交叉），可以将事先选择波段的起点和终点移到最近的零交叉点（波形曲线与水平中线的交点）；Find Beats（查出节拍），可以以节拍为单位选择编辑范围。对于立体声文件，你还可以单独选出左声道或右声道，进行编辑。添加音效，是Cool Edit 2000最激动人心的功能。在Cool Edit 2000的菜单Transform（变换）下，有20个子菜单，通过它们，用户可以方便地制作出各种专业、迷人的声音效果。如Reverb（余音），可以产生音乐大厅的环境效果；Dynamics Processing（动态处理），可以根据录音电平动态调整输出电平；Filters（过滤器），可以产生加重低音、突出高音等效果；Noise Reduction（降噪），可以降低甚至清除文件中的各种噪音；Time/Pitch（时间/音调），能够在不影响声音质量的情况下，改变乐曲音调或节拍等等，最神奇的是Brainwave Synchronizer（脑波同步器），可以通过立体声耳机，产生有助于入睡、放松，甚至思考的音乐。

显然，在描述这些奇妙的音效方面，语言未免显得有些苍白无力，最好的学习方法，就是反复试用、反复体会它们。你可以录制或打开一个现成的声音文件，然后，点击菜单

Transform，选择一种音效，调整音效的各项设置，或直接选用一种预置效果，按下OK按钮，听听看，不满意用Undo还原重来。

以下是我总结的音频后期处理的几个基本的步骤。一，降噪。二，高音激励。三，压线。这三个是最基本也是必不可少的三个步骤。具体的操作方法在这里不一一介绍。后面的处理步骤并不唯一，要根据演唱者或乐器音色的特征，在加上你丰富的工作经验。学好《Cool Edit pro2.1》理论知识是一方面，多动手，勤动脑，重思考，积累丰富的工作经验更为重要。只有通过平时的日积月累，我们才能创造出最完美的音轨。

下面我再来谈一谈我对视频处理的个人见解。首先进行视频处理，最基本，最常用，最专业的软件就是《Adobe Premiere pro2.0》。同时还要用到一些其他的相关软件，比如《After Effects》，《Adobe Photo Shop》，《3D Max》等。下面我着重介绍一下《Adobe Premiere pro2.0》。

《Adobe Premiere pro2.0》是一款功能强大，专业的视频处理软件。它不仅适用于专业的影视后期制作人士，而且适用于业余的影视制作爱好者。它的应用范围也相当广泛，包括：广告设计，影视制作，网页设计，等领域。主要功能包括：视频的剪辑，排版，片段编辑，字幕编辑，音频处理，视频特效，运动特效，节目渲染，影片输出。同时Premiere 6.0中，首次加入关键帧的概念，用户可以在轨道中添加、移动、删除和编辑关键帧，对于控制高级的二维动画游刃有余。Premiere6.0提供了兼容于QuickTime系统和其他系统的第三方插件，使用这些插件可以实现视频(滤镜)效果和过渡效果。由于提供了光盘刻录插件，可以轻松的制作出适合光驱播放的影片。

同时《Adobe Premiere pro2.0》支持的格式相当丰富，常用的视频格式有：AVI,WMV等。音频格式有：MP3,WMA,WAV等。图片格式有：JPG,JPE,JPEG,GIF,PSD。值得一提的是当导入PSD格式图片时，Premiere可以保留图片中的图层信息，并且可以对图层信息进行相关的特效处理，这是Premiere 的一大亮点

下面我来以我暑假的工作经验，介绍一下制作一个完整的MV的过程。首先，我们要明确MV制作大体分几个步骤。一，素材搜集与整理。二，素材剪辑与排版。三，片头，片尾以及字幕编辑。四，渲染与输出。五，压缩。

首先搜集素材的方法有很多，可以用DV甚至手机进行拍摄。可以用屏幕录像软件直接在计算机上录制一些动漫，游戏的片段。由于设备的限制，我主要是使用《Game Recorder》（游戏录像机）来录制一些游戏中的镜头。

素材录制好后，可以做一下简单的整理，比如说重命名或者分类管理。然后导入到Premiere 中，进行剪辑与排版，此时要发挥充分想象力与无限的创意，发散思维，不要局限于一点。

接下来的步骤是添加字幕，Premiere有着强大的字幕编辑功能，文字的特效，滚动，都可以轻松的实现。再接下来就要为你的MV制作精彩的开头与结尾。此时要用到的相关软件有《After Effects》，《Adobe Photo Shop》，《3D Max》。这里就不做具体的介绍了。

确认调试好后就可以进行渲染了，渲染也称作预演，为输出服务。最后在计算机上选择一个较大的磁盘空间，将制作好的MV输出。但你会发现，输出的文件相当大，不便于传播。此时就要进行最后的步骤——压缩。将输出的AVI格式的影片压缩为常用的RM格式影片，文件的体积便小了很多。

还有一些专场特效的设置，视频音频特效的添加以及关键帧的灵活运用的相关技巧，是在书本上学不到的，这些技巧都是我在平时的工作中自己发现的。学好《Adobe Premiere pro2.0》基础知识很重要，但是动手能力的培养，勤于思考的习惯起到了不可忽视的作用。

以上就是我在暑假积累的学习与工作经验，在今后的学习中，我会进一步强化我的专业知识，培养动手能力，注重积累丰富的工作经验，我相信，我会在我的领域取得成功！

电子信息学院07级计算机网络技术2班

5.网页课程设计指导书 篇五

《网页设计》课程设计指导书

一、对学生的基本要求：

1、理论联系实际、严肃认真、实事求是的科学态度和勇于探索的创新精神。

2、运用所学基础理论与专业知识分析和解决实际问题，培养独立思考完成任务的能力。

3、运用网页设计及制作的基本方法和基本技术设计制作静态网站的能力。

二、具体设计内容

应用《网页设计》课程学习的网页设计及制作的基本方法和基本技术设计、制作静态网站。可以从给定的选题中选择一个课题或自拟课题（自拟课题需经指导教师批准），进行需求分析、设计和制作。

题目：

1、XXX产品（商品）营销网站

2、XXX班级网站

3、XXX公司（部门）网站

4、XXX主题网站

三、具体设计要求

1、网站设计具体要求

1）针对你所选择的课题进行需求分析，写出网站的功能要求及总体结构。

2）网站需包含主页和二级页面等；主页需有LOGO图片和BANNER图片；二级页面的数量不少于3个。

3）网页的具体设计要求：版式布局合理、色彩搭配美观大方、图片文字设计得体并突出主题。

4）网站制作中，以下具体技术HTML、CSS、JAVASCRIPT至少使用两种。

2、课程设计报告书具体要求

1）网站总体设计：网站创建的目的、意义；功能模块和网站总体结构（以图形的方式表示出来）等。

2）主页设计：设计思想、创意、色彩选择、LOGO和BANNER的设计等。

第1页

3）二级页面设计：设计思想、内容表现等。

4）具体技术实现：使用了哪些技术及在网站中的具体表现形式。

5）设计总结：本次设计的心得体会，成功之处和不足之处等。

6）参考文献。

四、设计进度表：

1、15周周三：网站的需求分析，总体设计、规划。

2、15周周四～周五：具体设计制作。主页及二级页面的版式布局，色彩、图片文字等的设计制作。

3、16周一～周三：设计制作、测试发布，及报告书的编写。

4、16周周四下午：提交网站源代码和课程设计报告书。

5、16周周五：成绩评定。等待指导老师提问答辩（采用抽查的方式）。

五、考核内容及分值分配

1、课程设计报告书。(40分)

1）正文：（2000字以上）（30分）

（1）网站总体设计：网站创建的目的、意义；功能模块和网站总体结构（以图形的方式表示出来）等。（5分）

（2）主页的设计：设计思想、创意、色彩选择、LOGO和BANNER的设计等。

（10分）

（3）二级页面设计：设计思想，内容表现等。（5分）

（4）具体技术实现：使用了哪些技术及在网站中的具体表现形式（10分）。

2）设计总结：本次设计的心得体会，成功之处和不足之处等。（7分）

3）参考文献。（3分）

参考文献必须是学生在课程设计中真正阅读过和运用过的，文献按照在正文中的出现顺序排列。各类文献的书写格式如下：

a．图书类的参考文献

序号 作者名·书名·（版次）·出版单位，出版年：引用部分起止页

码。

b．翻译图书类的参考文献

序号 作者名·书名·译者·（版次）出版单位，出版年：引用部分起

止页码。

c．期刊类的参考文献

序号 作者名·文集名·期刊名·年，卷（期）：引用部分起止页码。

2、设计制作的网站（60分）

1）网站创意及结构布局：创意是否新颖、结构布局是否合理。（10分）

2）页面设计（二级页面不少于3个）（25分）

（1）页面版式、文字及色彩设计（15分）

（2）主页LOGO、BANNER图片（10分）

3）编程技术：包括具体程序和使用效果（20分）

（1）具体程序设计（15分）

（2）功能及使用效果（5分）

4）测试及发布（5分）

网站经过测试，并发布在互联网上，运行效果良好者为5分。

6.网页设计学习 篇六

培训课程内容：

Photoshop CS5教学

学习Photoshop中的网页处理技巧，网页页面的设计制作，案例分析，页面结构的完美布局，如何使用photoshop设计整站，首页，二级页面以及子页面的设计、Banner、导航按钮的创意设计，网页中应用元素的升华创意；Flash CS4 Flash绘图基本功能；Flash动画原理；元件功能导入；软件综合运用练习；软件综合运用练习；软件综合运用练习； Flash 案例的制作！商业性质Flash banner，Flash打造精彩主页特效页面！flash商业短片制作！

Fireworks CS4教学

Fireworks工作环境，工具介绍，绘图功能；使用文本，应用动态效果，滤镜；Fireworks使用层和混合模式；使用样式、元件和URL，动画功能；切片和热点，创建弹出菜单；优化导出，与Dreamweaver配合使用

Dream weaver CS4教学

Dreamweaver网站综合知识，面板组，站点管理；表格的使用，精确定位、排版；使用图象和超链接；CSS层叠样式表的应用；层的概念及应用，时间轴；库的使用和模板功能；HTML语言

Html语言简介；使用表单，框架的使用，iframe的作用；网页特效（javascript），多媒体网页；网页实战，综合练习； 网站的上传与下载，网页编程基础

CSS高级应用与技巧

文字排版，通栏排版，分栏排版，图文混合排版，图片基础 控制，不规则文字环绕，全图排版，表格排版。充分使用表格对象的标签，表格样式控制，表单表格设计。

javascript特效知识

1.javascript特效基本知识 2.用javascript控制CSS特效 3.SPRY框架应用(选项卡、Tab面板、折叠面板、伸缩面板)

网页布局/网站重构

了解网页布局的方法，制作出不同类型（个人，公司，企业，商业，旅游）网站设计方式即格局的表现；结合DIV+CSS实现网站重构,制作出符合行业网站规范的网页

网站的发布与维护

网站安全与推广，网站维护，网站管理和网站优化，申请域名空间与FTP上传等。网页设计制作规范

网页综合实例

1域名的概念：域名的区别与申请流程, 域名的保护及注意事项 2服务器：专用服务器和虚拟主机、不同平台的选择及注意事项、服务器的托管

网页配色

网页色彩的色调组合，网页设计中色彩的基本原则，及实用配色方案，了解网页设计色彩的搭配原则。

网站logo设计

Logo设计的原则及基本创意。学会制作网页logo。

网站VI系统设计

1、网站VI系统创意设计手法及原则

2、企业标志设计要点

3、标准字体设计要点

4、标准色设计要点

5、标准组合设计要点

6、VI办公用品应用要素设计要点

网站导航条设计

1、网站banner的表现手法。

2、制作网站banner常用的技法。

3、如何制作有创意且美观的网站banner。掌握网站banner的制作方法国内网站风格设计

1、国内网站风格设计的要点及注意事项

2、国内网站风格设计的色彩搭配

3、国内网站界面、按扭设计要点讲解

4、国内网站界面设计实例演练 掌握国内网站风格设计的原则和设计元素的设计制

国外网站风格设计

1、国外网站风格设计的要点及注意事项

2、国外网站风格设计的色彩搭配

3、国外网站界面、按扭设计要点讲解

4、国外网站界面设计实例演练 掌握国外网站风格设计的原则和设计元素的制作及使用。

网站策划书

1.目的是成功的重要开端：建站目的，目标用户群。2.网站开发商业流程 3.网站策划实例：策划书，网站设计中考虑的问题。4.娱乐网站策划书结构分析：CSC CLUB的策划书，目录结构和链接结构。5.娱乐网站设计的思考——首页设计：绘制网站背景，网页实战

1、典型网站案例分析与实战

2、淘宝注册和装修（普通铺和旺铺）

3、日韩风格的网页设计

4、欧美风格的网页设计

5、中国古典风格的网页设计

6、网页管理工具的使用

网站优化(SEO)

针对百度、Google优化，内页优化，结构优化及内链建设，外链等网站推广与营销

网站推广与营销

毕业作品设计及指导

由高级讲师及资深设计师带领学员完成毕业作品，制作整套网站作品集，以备应聘时使用。自己独立的设计完整的商业网站，静态与动态完全掌握，熟练运用，达到工作要

学员就业应聘技巧

1、就业形势分析及指导

2、毕业学员在应聘前应该做的准备

3、应聘时应请注意事项、礼仪、技巧

7.谈高职院校《网页设计》课程教学 篇七

（一）根据教学对象的不同安排相应的教学内容

不同专业不同方向的学生基础不同，课时数量也有差异。要在一个学期的时间内讲授所有相关内容是不现实的。因此，要根据专业的需要和学生具体情况安排相应的教学内容。对于计算机专业多媒体方向的学生，可在开设网页设计课程之前或同时开设图像处理、图形设计、动画设计、网络技术等相关课程，重点讲授Dreamweaver的基本功能、HTML、色彩搭配、CSS样式表、网页布局、表单等知识。Dreamweaver是一种所见即所得的网页制作工具，要重点讲授它在网页设计方面的常用功能;HTML是进一步学习网页后台编程的基础，为了能够让学生对它有比较深刻直观的认识，可通过Dreamweaver的拆分视图将网页的界面和代码相对照进行讲述;网页色彩搭配是重点也是难点，在讲授时要讲解色彩的基本知识、色彩的象征意义以及色彩对比的使用，要让学生能够掌握好网页色彩搭配的技巧，引导学生多鉴赏配色经典的网页，通过案例的分析讲解配色技巧。同时给出特定主题让学生写出配色方案并加以点评。计算机专业其他方向的学生或其他专的学生，可能没有学习过图像处理、动画设计等相关课程。对于这类学生的《网页设计》教学，可以在讲授Dreamweaver基本功能的同时补充一些Photoshop和Flash在网页设计中应用的知识。目前的《网页设计》教材多数都是只介绍一些基础知识，知识点和实例都过于浅显，而目前的网页设计技术更新得非常快。要讲好这门课程，让学生毕业后能够迅速适应市场需求，教师需要通过各种途径不断学习更多新知识和新技巧。课堂上除了讲授课本内容之外适当补充一些新知识，并引导他们在课下作进一步的学习。

（二）用实例作为课堂切入点

每堂课的开始是关键，如果一开始无法调动学生的积极性，整堂课就会变得很沉闷。为此，需要找到令学生感兴趣的内容作为切入点。网页设计是一门实践性很强的课程，教师可以用实例作为课堂切入点，采用任务驱动式教学方式。每一堂课都以实例引出具体知识点，然后逐渐展开，即将知识点融入具体实例中。比如在讲解表单设计的时候，可以先给学生演示某个网站的表单网页，然后和他们一起分析怎样才能制作出这样一个网页，之后一边制作一边讲解涉及到的功能，当这张表单网页完成时，学生对表单网页的制作方法也有了一定的了解，然后可以拿出另外一张表单网页让他们尝试模仿制作，从而达到举一反三的目的。学生对这种讲课方式比较欢迎，课堂积极性较高。

（三）欣赏、模仿、创意

《网页设计》是一门艺术与技术相结合的课程，在课堂上注重培养学生的审美能力是非常重要的。网页设计从入门到精通的过程就是一个欣赏、模仿、创意的过程，因此，整个学期可分成三个阶段。第一阶段：在讲授基础知识的同时给学生鉴赏一些优秀的网页设计作品，并引导他们在课后自己通过各种渠道鉴赏更多优秀作品，从而培养学生的审美能力。第二阶段在经过前一阶段的学习之后学生已经能够制作简单网页，这时可提供一些网页让他们模仿并加以指导，学生在模仿过程中可以掌握设计网页的基本技巧，学习他人的设计经验，为进一步学习打好基础，同时也可以满足学生的成就感需要，进一步提升对网页设计课程的学习兴趣，激发学习潜能。进入第三阶段，学生已经不再满足于模仿他人网页，经过前两个阶段的知识积累，他们产生了创作的愿望，这时让他们根据自己的兴趣制作一个完整的网站，并尽可能提供网上空间让他们上传自己的作品，给他们展示自我的舞台，同时也可以起到同学之间相互激励、相互学习的作用。

（四）改革考试方式，平时严格要求

《网页设计》是一门实践性很强的课程，传统的卷面考试不能反映学生的实际水平，上机考试出题也有一定局限性。因此网页设计这门课程必须改革考试方式，要以平时课堂表现情况和实际网页设计水平作为考核标准，将平时的作业成绩和课堂表现作为评定成绩的依据。可以采用平时纪律和课堂表现占30%，平时作业占70%计入总评成绩。

（五）实训环节是压轴戏

实训教学是高职高专院校教学的特色内容和重要环节，是理论与实践相结合，在实践中使理论得到巩固和升华的过程。学生普遍认为实训课程对提高他们的实际操作技能是很有帮助的。《网页设计》课程实训内容的选择要遵循以就业为导向、以技能培养为目标的方针。可以用实际的网站项目作为题目，也可以虚拟一个项目，网站的复杂度必须和实际网站保持一致，难度比平时布置的作业要求略高些。在实训过程中，可以让学生阶段性地展示自己的作品，这样可以在学生之间形成一种互相竞争的氛围，激发他们制作网站的热情。实训结束的最后一天，让学生轮流上讲台展示并介绍自己的最终作品，台下的同学和老师共同参与评分。通过这种方式学生在实训中不但提高了自己的网页设计水平，也提高了语言表达能力。

（六）其他方式

课堂教学时间毕竟是有限的，为了极大限度地提高学生学习《网页设计》课程的积极性，可以在校园网开设《网页设计》网络课程。此外，每年举办一次全校规模的网页设计比赛也是一个不错的方式。通过比赛，学生找到了自己与别人的差距，激励他们继续努力，不断提高网页设计水平。

参考文献

[1]韩陵宜.高职院校《网页制作》课程教学的探讨[J].电脑知识与技术, 2005, (6) .

8.网页设计师学习课程 篇八

关键词：艺术设计 网页设计 课程教学 实践

一、艺术设计专业的网页设计课程的教学现状

目前，艺术设计专业在网页设计课程教学实践中普遍存在着缺乏专业优势、偏离学生就业需求等问题，这种教学与计算机专业的网页设计课大同小异，误导学生以为这门课程就是一个技术课，掌握了操作技术就可以独立完成网页设计和制作，极大地忽视了其艺术性。因此，我们需要对教学模式、教学内容和考核内容等进行改革，以真正发挥艺术设计专业在培养人才的优势。

二、教学改革的目的

通过教学改革，力图解决以下两个问题：一是学生设计网页缺乏美感，版式、色彩等语言和设计理念滞后；二是单独靠一个软件就来完成网页设计与制作。通过以上两个问题的解决，充分考虑艺术专业的特性和学生就业的社会市场需求，综合运用多软件培养学生的美工设计能力、动画设计能力、版式设计能力、界面设计能力，全面提高学生的想象能力、感受能力、创新能力和审美能力，为社会培养一大批高素质艺术设计人才。

三、教学改革的创新点

1.寻找艺术与技术的平衡点。避免学生成为技术的奴隶，教学方案中增加艺术素养训练，充分体现专业特色，致力于培养学生的艺术设计和艺术审美和创新能力，通过研究性学习和网页设计的具体实践使学生有效地掌握网页艺术设计的精髓，为将来步入社会更好地满足市场需求从事网页设计、美工、界面设计等工作做好准备。

2.基于多媒体网络教学，合理构建教学内容。构建既具有实用性又具有艺术性的教学内容，实现软件课与艺术设计课的整合，在学会软件应用的基础上，将其恰到好处地运用于艺术设计；实现理论课和实践课的整合，利用示范教学提高学生将理论应用于实践的能力，提升教学效果。

3.深化教学内容，开拓教学视野。适用互联网技术的发展，不断加快教学内容的更新，做好教学信息的收集工作，实现教学内容的深化，保证教授给学生最前沿的知识。教学中运用多媒体充分调动起学生的视觉和听觉，激发学生的学习积极性。

四、主要改革与实践的方面

1.改革教学模式。第一，采用项目教学。为了锻炼学生的实践能力，保证学生现场制作、解难和评析的参与度，实现课程理论和网页设计的有机融合，可以在教学中加大实用项目的引进，让学生参与到整个项目制作过程，包括初期的初稿设计、中期的客户反馈到最后的定稿。第二，采用跨学科教学。实现多学科整合的互动教学，将计算机专业和艺术设计专业的网页课程结合起来，让学生可以综合考虑到设计与程序的结合，依托于程序的可实现性设计出具有创意的网页方案。

2.改革教学内容。第一，增加手绘创意草图教学环节。注重创意期的思维训练，通过这一教学内容帮助学生明确设计意图，培养学生的快速创作意识和能力。第二，增加版式设计构图教学环节。引导学生充分应用版式设计原理进行网页的整体布局，在有限的空间融合进了最多的视听多媒体元素，基本信息、导航、和正文结构安排合理美观，凸显设计者的理性思维、艺术个性和个人风格。第三，增加色彩运用训练环节。色彩的运用决定了网页的整体色调，训练学生在不同网站功能和风格下对色彩的准确把握。第四，增加创意字体教学环节。引导学生正确地运用字体设计方法，根据不同网页布局选择大小、颜色、色彩合适的字体，运用设计软件实现多样化字效和创意字体的设计。第五，增加网页交互功能教学，引导学生充分运用按钮和其他辅助设计以及页面之间的链接，从而实现网页的交互功能。第六，增加多软件综合运用教学，引导学生在网页设计中综合运用不同的软件，灵活掌握不同软件主要功能的基础上通过综合运用以实现丰富的效果。

3.改革考核内容。第一，根据当堂内容布置对应的课堂练习和上机操作，及时发现学生学习中的盲点，教师适时调整课堂进度，此部分成绩占40%。第二，根据课程的教学目标布置综合作业，结合实际让学生自主选择设计一个政府网站、企事业网站、娱乐网站或者个人网站，对学生网站设计的总体布局和色彩、版式、功能等进行综合评价，此部分成绩占60%。

五、艺术设计专业的网页设计课程教学的趋势

第一，总结和探索艺术设计专业的内在规律，建立网页设计的跨学科教学模式。讲授理论知识的同时要培养学生调动多学科知识的能力，培养学生的创造力和想象力，提高学生的实践应用能力。

第二，注重网页设计的主体风格，培养学生的企业品牌意识，企业品牌的形象设计依靠网页的展现和塑造，好的企业网页可以让企业品牌形象深入人心，教学中必将更加重视对学生品牌整体风格的把握和品牌意识的培养。

六、结语

目前，艺术设计专业的网页设计课程存在着偏重技术而忽略艺术素养训练的问题，教学改革就是要培养学生的艺术审美和艺术素养，力求寻找到艺术与技术的平衡点，基于多媒体网络教学，合理构建教学内容，开拓教学视野。教学模式上采用项目教学和跨学科互动教学，内容上增加创意草图、版式设计、色彩设计、字体运用、交互功能和多软件组合使用等教学环节，评价上更加注重实践动手能力，其发展趋势是追求技术和艺术的完美结合，培养学生的企业品牌意识。

参考文献：

[1]刘妤.艺术设计专业的网页设计课程教学改革与实践[J].包装世界，2011，（04）：72-73.

[2]周小丽.“网页设计与制作”课程教学改革实践探究[J].教育与职业，2013，（08）：127-128.

[3]张大伟，唐运乐.艺术高职院校网页设计教学的研究与实践[J].计算机光盘软件与应用，2013，（16）：161-162.