个人网站设计范例

。。

。

。。。你没有这个能力，也没这个精力，所以必须要找准一个自己最感兴趣的内容，做深、做透，办出自己的特色，这样才能给用户留下深刻的印象。。

第二、进行页面总体设计。

一个成功与否，很大程度上决定于设计者的规划水平。设计的“风格”是抽象的，只是指站点的整体形象给浏览者的综合感受。。。。

。然后用平面设计软件制作整个页面，常用的软件有Adobe Photoshop、CorelDraw、Macromedia Fireworks等。Photoshop是平面设计的最好工具，我自己也一直用它做页面设计，它从6.0版开始特别增强了对网页制作的支持，非常方便。现在流行的Fireworks是Macromedia网页制作三剑客的重剑手，由于它与Dream 。也只有如此制作出来的网页才能有个性、有特色，更具有吸引力。；是温文儒雅的，还是执著热情的；是活泼易变的，还是墨守成规的。。。

第三、搜集与主题相关的材料。

。常言道：“巧妇难为无米之炊。。材料既可以从图书、报纸、光盘、多媒体上得来，也可以从互联网上搜集，然后把搜集的材料去粗取精，去伪存真，作为自己制作网页的素材。

。

。。。我们要用HTML语言将切割下来的组件按整体设计“拼装”回去。众所周知，HTML语言是一种标记型语言，不需要编译就可以直接在浏览器中执行。。。 site、Hotdog等；一类是所见即所得型，典型代表为FrontPage。也有两者兼具的，就是大名鼎鼎的Macromedia Dream weaver。。Dream weaver提供了代码编写模式和设计模式（即所见即所得），并且首次将“层”概念引入网页制作。Dream weaver几乎可以满足所有人的需求，甚至还提供了ASP、PHP等脚本语言的代码提示。

你也可以用Netscape4.0或者WORD7.0,我开始用的是FrontPage，打开Netscape,在file菜单里选Edit Page,便可以制作了。。。因为网页默认的主页名称是index。制作主页其实很简单，只要多实际制作，工多则艺熟。

。

要在网上安你自己的家，你必须先申请一个主页空间，即向某一个主机申请一块硬盘空间。。。只要到有关站点申请即可，具体方法，参考相关题目。！

将制作好的页面放到服务器上，以便更多的人能浏览。目前的网页制作工具基本上都有工具，可以通过各种方式你的页面，如Dream weaver中的“站点管理器”。用户亦可使用FTP客户端软件进行这步操作。。

。。。。21世纪以来，电子商务伴随着IT的成熟，逐渐发展壮大，成为网络经济的核心。。。。。。。。。；；（3）应用表格或者div、css布局页面；（4）在页面中插入文字，并用css美化文字大小、字体、颜色等效果；；（6）建立模板，并制作其他页面；；。。教师将根据学生完成情况的复杂程度和实际效果给予评价，锻炼了学生的实践动手能力，增强了自信心和学习兴趣。

二、教学素材的选用方法

教学素材是以完成课堂教学任务为目的，以教师引导学生开展课堂活动的形式呈现的教学材料。1.合理性。。在图像的选取上也是以色彩丰富、形状多样的图案为主。2.整体性。选用的教学素材要能够自然、贴切地把各个知识点整合在一起，教学素材要服务于教学目标，要突出教学的重点。。在知识点上以表格嵌套、模版运用、脚本语言和行为语句为重点进行讲解。3.现实性和针对性。课堂教学中选取的素材要符合学生的认知水平和实际生活，教师可以从具体教学对象的特殊性出发，根据教学对象因人、因地、因时选材，为他们“量身定制”针对性较强的教学素材，如在教授电子商务专业学生时，素材的选取多以电子商务平台或某一个人网店为主，以便引导学生从自己熟悉的教学素材中直观体验获取知识、提高能力的喜悦。

三、教学模式在教材中的运用

在《网页设计与制作》校本教材的开发上主要采用“基于过程的项目式教学法”。即“在引导学习者融入有意义的项目完成的过程之中，让学习者积极地探究与发现，自主地进行知识的整合与建构，以现实的、学生生成的新知识和提高的完成项目任务的能力为主要成就目标，项目完成的过程也是学习者学习活动进行的过程”。。

四、结语

关键词：项目教学法；中职；

中图分类号：G712 文献标识码：A 文章编号：1672-5727（2012）08-0092-03

全新理念的教学模式

随着科技的日益发展，信息化时代的到来，人们的工作、学习、生活都发生了极大的变化，都在不断地寻求更为快捷有效的方式，这就对传统教育理念及教育模式产生了极大的冲击。中等职业技术学校的教学宗旨就在于提高学生的实际操作能力，集理论与实践为一体。因而，计算机知识水平和实践动手能力就成了中等职业学校计算机教育的根本任务。然而，由于种种原因，中职学生素质不高，学习积极性不高，自学能力和自控能力也较差，这成为中职教师特别是计算机程序科目教师最头痛的事。如何激发学生的学习兴趣，并最大限度地挖掘学生的创造性呢？。

项目教学是师生通过共同实施一个完整的项目工作而进行的教学活动。它的特点是：把整个学习过程分解为一个个具体的工程或事件，设计出一个个项目教学方案，按行动回路设计教学思路，不仅传授给学生理论知识和操作技能，更重要地是培养他们的职业能力，这里的能力已不仅是知识能力或者是专业能力，而是涵盖了如何解决问题的能力——方法能力、接纳新知识的学习能力以及与人协作和进行项目动作的社会能力等几个方面。项目教学法就是为了充分发挥学生学习的主体性，以学生熟悉的、感兴趣的主题为项目工程，来激发学生的学习兴趣与创造力。

项目教学法实施步骤

精挑细选的教学内容 项目的确立不是一件轻松的事。项目教学法要求课程单元与任务设计必须达到的前提指标是：（1）项目所涉及的知识和技能在教学大纲所要求的范围以内，并且每个项目的难度系数要有一定的梯度。（2）学生对所确定的项目及其结果有着较强的兴趣，能激发学生的积极性和创造力。（3）项目所涉及的知识和技能、所涉及的内容符合最近发展区理论，通过学生主动的探索和学习是有能力完成的。（4）项目完成过程最好能突出完成与合作完成的能力，有利于对学生进行情感、态度和价值观的教育。（5）可以用某一标准（正确答案、美感等）对完成的项目是否达到教学目的进行评价。。

科学的梯度与课时设计 。此项目的完成过程均可在设计视图中处理，不涉及程序的编写，相对比较简单，所以放在第一个项目实例（12课时）。（2）在线日记，主要实现书写日记、阅读日记、删除日记、更新日记、查找日记等主要功能。。（3）企业会员管理系统，在实现基本功能的基础上，增加文件上传功能和管理权限，实现分层管理（40课时）。。以上4项举例如图1～4所示。。就像没给学生任何工具，却要他们砍倒眼前的一大片树林那样，学生会觉得无从下手、不知所措，进而产生恐惧心理，这将大大打击他们的学习积极性。因此，教师应该给予学生工具，一把斧头或电锯，然后教会他们工具的使用方法，每天定量去完成任务。所以，分解细化项目是项目教学必不可少的一个重要环节。。

对于学生来说，他们只要接受教师在课堂中给予的一个个小项目，研究它、解决它、体会它、总结它，最终会升华到一个更高的层次。

项目实践过程

（一）创设学习环境，获取解题方法

教师在项目实践过程中充当引导者、指导者和监督者，主要任务有：课前熟悉项目内容进行深入研究，并准备好项目讨论可能涉及的有关知识；创设学习的资源和协作学习的环境；介绍项目内容，吸引学生的注意力，激发学生学习的积极性和讨论的热情。学生在项目实践过程中是学习主体，在教师的帮助和小组合作交流中，利用动手操作探索，发现新知识，自主学习。。

（二）分小组合作，模拟设计公司

[关键词] 多媒体技术 艺术设计

doi:10.3969/j.issn.1002-6916.2012.05.043

。。

1.多媒体技术的诠释

。多媒体技术能够利用多种交互手段，使原本枯燥无味的播讲变成互动的双向信息交流。它极大地改变了人们获取信息的传统方法，符合人们在信息时代的阅读方式。

现代多媒体技术在艺术设计教学中的应用具有直观性、视觉冲击力强、信息量大的特点，它优化了艺术设计教学的教学方式，也有效地提高了学生的学习主动性和创新性，同时在很大程度上提升了教师自身的素质。利用多媒体技术可以制作生动、有趣的网页，[1]使得Internet上的浏览者留连忘返。到目前为止，在Internet上所能使用的多媒体可以说越来越广泛，从简单的GIF动画，3DVRML动画，广播站到电影文件几乎都可搬上Internet。网页设计的趋势越来越接近于一门艺术，而不仅仅是一项技术。。

。

有了在虚拟空间宣传和推广产品的平台，通过它可以较为准确地表达企业内在的理念精神，体现企业内在的特有的形象。如何才能在竞争日益激烈的今天脱颖而出，吸引更多的访问用户呢？。

网页艺术设计包含视听元素与版式设计两项内容；以主题鲜明、形式与内容相统一、强调整体为设计原则；多媒体具有交互性与持续性、性、综合性、版式的不可控性、艺术与技术结合的紧密性五个特点。由于多媒体自身的互动性、娱乐性，自然会吸引浏览者的眼球，当然设计要有创意。

任何设计都有一定的内容和形式。。设计的内容就是指它的主题、形象、题材等要素的总和，形式就是它的结构、风格或设计语言等表现方式。内容决定形式，形式反作用于内容。一个优秀的设计必定是形式对内容的完美表现。。。[3]它的主题只有一个，就是美。。。为了能留住顾客，应该确定要有“跳跃信息”的连接。。。

网络技术与艺术创意的紧密结合，使网页的艺术设计由平面设计扩展到立体设计，由纯粹的视觉艺术扩展到空间听觉艺术，网页效果不再近似于书籍或报刊杂志等印刷媒体，而更接近于电影或电视的观赏效果。技术发展促进了技术与艺术的紧密结合，把浏览者带入一个真正的虚拟世界。

2.2艺术设计在网络中的

随着多媒体技术的不断发展，网络传输速度的不断提高，艺术性受技术的不断减低，艺术与技术会更好的结合。。。。

艺术设计教育又是一项充满创造性的工作，作为艺术设计专业的教师，如何及时更新艺术教育观念，重新审视自己的教学方式，开发与利用课程资源，都是值得思考的问题。多媒体教学是指在教学过程中根据教学目标和教学对象的特点，通过教学设计，合理选择和运用现代教学媒体，[2]并与传统教学手段有机结合，以多种媒体信息作用于学生，形成合理的教学过程结构，达到最优化的教学效果。

？更加贴近生活、贴近实际呢？。。；其次，设计是艺术和技术结合的产物，就是说，既要“美”，又要实现“功能”；最后，“美”和“功能”都是为了更好地表达主题。。[4]它的主题只有一个，就是美。。

。为了能留住顾客，应该确定要有“跳跃信息”的连接。如果站点像烤番薯，那么多媒体设计就应该像黄油、干酪和酸乳。。

网络技术与艺术创意的紧密结合，使网页的艺术设计由平面设计扩展到立体设计，由纯粹的视觉艺术扩展到空间听觉艺术，网页效果不再近似于书籍或报刊杂志等印刷媒体，而更接近于电影或电视的观赏效果。技术发展促进了技术与艺术的紧密结合，把浏览者带入一个真正的虚拟世界。。？。同时要使多媒体本身从形式上获得良好的诱导力，鲜明地突出诉求主题，[6]具体可以通过对网页的空间层次、主从关系、视觉秩序及彼此间的逻辑性把握运用来达到。

4.结语

。。。

参考文献

[1] 刘光然:多媒体技术与应用.人民邮电出版社,2005. 9

[2] 游泽清:多媒体画面艺术基础.高等教育出版社,2002.12

[3] 丁龙:现代教育技术基础.哈尔滨地图出版社,2004.12

[4] 肖冰:浅谈网页艺术设计[J]．安阳师范学院学报,2005.5

[5] 王海燕,张正凯:.从审美角度浅谈网页艺术设计[J],2004.9

[6]网页艺术设计初探.省略/g204118b/

信息图表设计最常见的类型为时序性图表，以时间轴图为代表，这种图表以时间信息为基础，描述事件在空间中的先后流动变化。Adam是一个年仅21岁的波兰平面设计师，尤其擅长网页设计及界面设计，在三年的从业经历中，Adam获得了三个国际性奖项，先后完成了150多个设计项目。。但在具体性的数据展现上，Adam设计的是的六边形图标，粗黑体数字置于六边形图标中心位置，数个六边形图标一字排开，构成并列性数据图表。

通常情况下，饼状图是信息图表中展示数据内容之间比率关系的最有效方式之一。。。。。当鼠标移至此页面时，数个小正方形演变为按照透视原理排列的高度层次不齐、明度深浅不一的方形柱，蓝色字体的比率数据呈现在方形柱之间，构成别有趣味的动态化信息图表。

数据是信息的重要形式，但并非信息的全部，很多信息图表可能并非表现具体的数量或比率关系，而是表现空间位置的距离、高度、面积、区域，并将这些内容按照一定比例高度抽象化，形成空间组织模式图，常见的有地图、导视图或器物结构图等。图三是全球知名营销创意公司Asylum在美洲地区的机构分布图。这家公司在美国、墨西哥、哥伦比亚和巴拿马四个国家拥有五间办公室，在整个美洲地区则遍布50家以上的合作组织。网页绘制了大半个美洲的地图，并用黄色、红色在深灰色地图上醒目地标示出直属办公室与合作机构所在的位置，简单而又清晰。

除了时间关系、位置关系、数量关系等信息图表表现内容外，很多信息图表也可用来表现逻辑关系与组织关系。前者展现的是事件的因果关系或者逻辑变化情况，后者则用来展现信息之间整体局部或上下级的从属关系。。。一百万个黑色圆球颗粒在网页中有规则的聚集，组成了一辆奥迪汽车的3D透视图。。奥迪汽车3D视图可随鼠标移动在页面空间中做360度旋转，也可将视角深入汽车内部或向外拉伸。与其他信息图表不同的是，关于奥迪汽车的评价信息是隐藏起来的，只有浏览者有意识地去探寻时，信息才会暴露出来，动态的信息展露过程本来就充满了趣味性，也更能体现尊重浏览者信息获取的主体意愿。

信息图表是一个可读、可视的复合系统，在视觉内容上体现为文字、图像和数字的创意化与个性化融合，它帮助人们更好地借助特定视觉内容元素系统、显著、鲜明、直接、连贯和全面地转化文本内容，使得信息被重新整合、个性再现。当信息图表介入到网页设计中后，其表现形式便进一步变得丰富和多样，动态、交互等信息表现形态有了施展魅力的基础和空间。这是信息图表设计的网络化与媒体进化，也是网页设计的风格化与个性化。2013c

.cn

。在产品介绍及互动体验环节，设计师借鉴达芬奇著名素描作品《维特鲁威人》的造型创意，以“小黑瓶”代替男性人体，设计了围绕“小黑瓶”的圆形视觉图示，代表“十种年轻印记”的十条文字信息均匀编排于圆形视觉图示周围。

。。。

。。。

opencolleges.edu.au/informed/learningstrategies

。。。

1引言

2.1“动态”的概念

1)“交互性”，即网页会根据用户的要求和选择而动态改变和响应，将浏览器作为客户端界面，这将是今后WEB发展的大势所趋.

2)“自动更新”，即无须手动地更新HTML文档，便会自动生成新的页面，可以大大节省工作量.

3)“因时因人而变”，即当不同的时问、不同的人访问同一网址时会产生不同的页面.

2.2ASP的概念及特点

MicrosoftActiveS。。

二Pages所独具的一些特点:

2)无须Compile编译，容易编写，可在服务器端直接执行.

4)与浏览器无关(Br+wserIn<lepen<lenoe)，用户端只要使用可执行HTML码的浏览器，即可浏览Active

S。二Pages所设计的网页内容.ActiveS。二Pages所使用的脚本语言(VBSoriptJsoript)均在WEB服务器端执

行，用户端的浏览器不需要能够执行这些脚本语言，如图1所示.

用户端浏览器IE或NS1r1''''1''''1''''洁求11而1''''III]子

WEB服务器ActiveServerP

5)ActiveS。二Pages能与任何AotiveXscripting语言相容.除了可使用VBSoript或JSoript语言来设计外，还通过plug-in的方式，使用由第三方所提供的其他脚本语言，譬如REXX,Perl,Tol等.脚本引擎是处理脚本程序的COM(ComponentObjectModel)物件.

6)ActiveS。二Pages的源程序，不会被传到客户浏览器，因而可以避免所写的源程序被他人票J窃，也提高了程序的安全性.

7)可使用服务器端的脚本来产生客户端的脚本.

8)物件导向(Obje<，一(>riented).

9)AotiveXS。二Components(AotiveX服务器元件)具有无限可扩充性.可以使用VisualBasic,JavaVisualC++,Cobol等编程语言来编写你所需要的AotiveXS。二Component.

2.3ASP技术流行的原因

3实例

建立一个自动监测浏览时问并根据不同时段动态显示不同页面内容的ASP程序，用记事本书写该源代码，存为[estl.asp:

<html>

<ho<ly>

<F01}TCOLOR=“Green">

<%If''''T油e<#12:00:00#An<1T油e>=#00:00:00#Then%>

早上好，今天天气不赖啊!

<%E1seIf''''T油e<#19:00:00#An<1T油e>=#12:00:00#Then%>

下午好!

<%Else%>

哈u}!今晚你有没有去IRC聊天!

<%EndIf%>

</ho<ly>

</html>

虽然，这只是一个非常简单的实例，而A_这一功能完全可以通过JavaScript完成，但是不难发现使用ASP要比JavaScript简洁迅速得多，而A_运用此法，完全可以轻而易举地令你的网页在不同的时段展示不同的风格，此例中的“Time"实际上是一个VBScript内置的显示系统当前时问的函数，由于系统默认的脚本语言是VBSeript，因此在ASP命令中调用该函数时，脚本引擎会自动将其转换成当前的系统时问.接下来是给testl.

asp添加一点色彩，在<holy>标识中添加“bgcx>lor=“<%=hgc%>””即变为<bodybgcx>lor=“<%=bgc%

>”>，并在<holy>标记前添加如下语句:

<%If''''T油e<#12:00:00#An<1T油e>=#00:00:00#Then

bg}}=“silver"

E1seIf''''T汕e<#19:00:00#An<1T油e>=#12:00:00#Then

hg(一“navy

Else

bg}}=“re<1"

En<1且

%>

如此一来，当用户在不同的时段访问该页面时，将会看到不同的页面背景色.我们可以做的事情还有很

<P>FirstName:<INPUTNAME="fname"SIZE="48">

<P>LastName:<INPUTNAME=“lname"SIZE=“48">

<P>Title:<INPUTNAME=“title"TYPE=RADIO、4LUE="mr">Mr.

<INPUTNAME=“title"TYPE=RADIO、4LUE="ms">Ms.

<P><INPUTTYPE=SUBMIT><INPUTTYPE=RESET>

</FOR1Vl>

然后在以上HTML代码后面添加如下ASP命令:

<%title=request.form(“title")

iftitle="mr"then

%>

欢迎您Mr.<%=二qu舰.拓mi(+.二;request.form((name)%>.

<%elseiftitle="ms"then%>

欢迎您Ms.<%=二qu舰.拓mi(+.二;request.form((name)%>.<%else%>

<B><Fontcola</font></B>

<%endif%>

保存文件testl.

12:00:00之问的话，>r=blue>欢迎您<%=二que从.长)mi(+.二e;)&+;&二明es[.长)mi(“玩二e;request.form((name)&&request.form(lname%>

asp，并在浏览器中以HTTP方式进行浏览，如果此时的系统时问在凌晨0:00:00和中

这其实是一个在Internet和Intranet上常见的功能，即当用户在浏览器端填写完表单后，通过调用一个通用网关程序将用户数据传送到服务器，由服务器进行处理后再将结果返还给客户浏览器.过去为了实现这样的功能必须编写一个于HTML之外的CGI程序，并通过HTML进行调用，撇开CGI编写复杂等缺点不谈，CGI的执行效

率也是一个大问题，每一个表单(form)均须执行一个可执行文档，当多人同时上线使用时，多个文档同时执行，将大大降低WEB服务器的执行速度，如今ASP提供了与HTML完全相融的编程环境，显然要比使用CGI便捷得多.