论文部分内容阅读
【摘 要】剪纸是民间艺术的一种,是以纸为加工对象,以剪刀为工具进行创作的艺术,以镂空艺术为主要的表现方式,在视觉上给人以透空的感觉和艺术享受。今天,互联网已成为人们快速获取、发布和传递信息的重要渠道。传统的文化也要随着时代的步伐,焕发出新的活力。制作剪纸文化网就是将传统的剪纸艺术与现在的信息技术紧密联系起来,通过现代网络技术来更好的阐述传统文化。本文谈谈用Dreamweaver制作剪纸文化网的探索。
【关键词】Dreamweaver;剪纸文化;网页设计
1 剪纸文化网站的开发软件介绍
Dreamweaver是个原本由Macromedia公司所开发的著名网站开发工具。它使用所见即所得的接口,亦有HTML编辑的功能。Dreamweaver可以用最快速的方式将Fireworks,或Photoshop等档案移至网页上,也可以使用网站地图可以快速制作网站雏形、设计、更新和重组网页,并且Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具,它具有制作效率高,网站管理迅速以及控制能力强的优点。
2 剪纸文化网页设计与制作
2.1 规划结构
一个网站建设成功与否与建站前的网站规划有着极为重要的关系。规划一个网站可以用树状结构先把每个页面的内容大纲列出来。在剪纸文化网中,笔者设计了七大模块,分别为首页,简介,历史,鉴赏,教程,小游戏,留言板。其中,在简介模块中有介绍,剪纸特点,剪纸种类三部分;鉴赏模块是本网站设计的重点,有花鸟,蝴蝶,鱼和人物四组动态效果,来展示精美的剪纸图片。
利用Dreamweaver制作网页,首先要规划和创建站点,然后利用站点对文件进行管理。所谓站点,可以看成是一系列文档的组合,这些文档通过各种链接建立逻辑关联。用户在建立网站首先要新建站点,然后在站点中对网页文档进行修改与管理。
网站的目录结构是网站组织和存放站内所以文档的目录设置情况。目录结构的好坏,直接影响站点的管理、维护、扩充和移植。
2.2 LOGO与色彩
2.2.1 设计网站LOGO
网站LOGO是网站的标是站点特色和内涵的集中体现,是剪纸文化网的LOGO设计,剪纸一般为红色,这个LOGO和剪纸文化网所要表现的内涵相联系,赋予传统文化现代活力。
2.2.2 设计网站的标准色彩
标准色彩是指能体现网站形象和延伸内涵的色彩。确定网站的标准色彩是相当重要的一步,不同的色彩搭配会产生不同的效果,并可能影响到网页浏览者的情绪。
2.3 布局
网页布局设计,就是指网页中图像和文字的位置关系,简单的说也可以称之为网页排版。网页布局最重要的目标就是传递信息,分割,组织和传达信息是笔者在网页设计是要充分考虑的。
在剪纸文化网中,一般为左右布局,所用到的布局工具主要有表格和AP Div,其中以CSS(Cascading Style Sheets,AP Div叠样式表单)+DIV(是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素)为主。CSS+DIV网站设计的优势:首先,CSS的极大优势表现在简洁的代码,对于一个大型网站来说,可以节省大量带宽,而且众所周知,搜索引擎喜欢清洁的代码(其真正意义在于,增加了有效关键词占网页总代码的比重),因此使用CSS+DIV的Web标准制作的网站具有搜索引擎友好的一定优势。
其次,CSS+DIV制作的网站使得网站改版相对简单,很多问题只需要改变CSS而不需要改动程序,从而降低了网站改版的成本。如果说某个页面元素需要凸出于页平面,通常使用的表格就不能完成功能了,因为在同一平面页面元素是不能叠加的。而把某一页面元素设置为背景也比较局限。因为制作过程中只能把图片作为背景,不能把Flash 或者文本作为背景。
遇到这样的情况,可以利用“插入AP Div”来解决。“AP Div”可以把它理解成漂浮于页平面的一个空间,这个空间可以像网页一样放入图片、Flash、文字等内容,并且它还有一个非常重要的属性,就是它具有Z 轴。如果把页面的长宽分别看成以左上角为起点的X 轴和Y轴的话,那Z 轴就是垂直于页面的凸起轴,Z 轴的值越大,层就越上,那么放置于改层AP Div内的页面元素就会遮挡住其它的页面元素,从而显示在页面更上方。同时利用AP Div凸出于页平面的这一特性,可以将需要运用的页面元素放置于其中,然后拖动AP Div的位置,轻松实现页面元素的定位。
AP Div比较适合于Flash 结合使用,通常是把Flash 透明动画放置于AP Div中,然后作为图片的装饰,使页面产生动画效果。
2.4 动态效果
动态效果是剪纸网站设计的重点,主要由Flash按钮,Flash文本,视频,背景音乐以及AP Div的行为组成,简单的动态效果可以使网页变的有声有色,增强观赏性。
在剪纸文化网中,由于笔者大部分用的AP Div来布局,可以方便的使用AP Div添加行为。
2.5 交互
交互是参与活动的对象,可以相互交流,双方面进行互动。对于一个网站来说,交互是至关重要的。若一个网站不能与使用者互动,不能及时了解浏览者的需求,则网站很难维持下去。在剪纸文化网中,笔者充分考虑了这个问题,不仅设计了电子邮件的交互,还能在线留言,并对网站的教程资源进行下载方便用户的应用。
2.6 测试
2.6.1 链接测试
链接是指在电子计算机程序的各模块之间传递参数和控制命令,并把它们组成一个可执行的整体的过程。在剪纸文化网中,笔者用到的链接样式有锚点链接,空链接,电子邮件链接等内部链接,在测试过程中,所有的链接都能正常运行。
2.6.2 动态效果测试
在剪纸文化网中,由于动态效果是笔者所要展示的重点,所以对动态效果进行测试是至关重要的环节。笔者大部分页面是用AP Div布局,因此大多的动态效果是AP Div的行为特效,另外还有Flash以及时间轴动画等,在对动态效果的测试过程中,有些效果和设计有所偏差,但经过修改,已经达到了让人满意的水平。
2.6.3 留言板测试
对留言板的返回首页,我要留言,查看留言,管理登陆四个选项依次进行了测试,除了上面提到的我要留言选项中输入的必须是数字QQ号外,其他选项中的内容也进行了细致的测试,如管理登陆时若密码输入错误,也会出现提醒等,对留言板的测试要在ISS环境下进行,不管是留言,查看或者管理等都可正常运行。
参考文献:
[1] 朱印宏,袁衍明. Dreamweaver 8完美网页设计(技术入门篇)[M]. 北京:中国电力出版社,2006.
【关键词】Dreamweaver;剪纸文化;网页设计
1 剪纸文化网站的开发软件介绍
Dreamweaver是个原本由Macromedia公司所开发的著名网站开发工具。它使用所见即所得的接口,亦有HTML编辑的功能。Dreamweaver可以用最快速的方式将Fireworks,或Photoshop等档案移至网页上,也可以使用网站地图可以快速制作网站雏形、设计、更新和重组网页,并且Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具,它具有制作效率高,网站管理迅速以及控制能力强的优点。
2 剪纸文化网页设计与制作
2.1 规划结构
一个网站建设成功与否与建站前的网站规划有着极为重要的关系。规划一个网站可以用树状结构先把每个页面的内容大纲列出来。在剪纸文化网中,笔者设计了七大模块,分别为首页,简介,历史,鉴赏,教程,小游戏,留言板。其中,在简介模块中有介绍,剪纸特点,剪纸种类三部分;鉴赏模块是本网站设计的重点,有花鸟,蝴蝶,鱼和人物四组动态效果,来展示精美的剪纸图片。
利用Dreamweaver制作网页,首先要规划和创建站点,然后利用站点对文件进行管理。所谓站点,可以看成是一系列文档的组合,这些文档通过各种链接建立逻辑关联。用户在建立网站首先要新建站点,然后在站点中对网页文档进行修改与管理。
网站的目录结构是网站组织和存放站内所以文档的目录设置情况。目录结构的好坏,直接影响站点的管理、维护、扩充和移植。
2.2 LOGO与色彩
2.2.1 设计网站LOGO
网站LOGO是网站的标是站点特色和内涵的集中体现,是剪纸文化网的LOGO设计,剪纸一般为红色,这个LOGO和剪纸文化网所要表现的内涵相联系,赋予传统文化现代活力。
2.2.2 设计网站的标准色彩
标准色彩是指能体现网站形象和延伸内涵的色彩。确定网站的标准色彩是相当重要的一步,不同的色彩搭配会产生不同的效果,并可能影响到网页浏览者的情绪。
2.3 布局
网页布局设计,就是指网页中图像和文字的位置关系,简单的说也可以称之为网页排版。网页布局最重要的目标就是传递信息,分割,组织和传达信息是笔者在网页设计是要充分考虑的。
在剪纸文化网中,一般为左右布局,所用到的布局工具主要有表格和AP Div,其中以CSS(Cascading Style Sheets,AP Div叠样式表单)+DIV(是用来为HTML文档内大块(block-level)的内容提供结构和背景的元素)为主。CSS+DIV网站设计的优势:首先,CSS的极大优势表现在简洁的代码,对于一个大型网站来说,可以节省大量带宽,而且众所周知,搜索引擎喜欢清洁的代码(其真正意义在于,增加了有效关键词占网页总代码的比重),因此使用CSS+DIV的Web标准制作的网站具有搜索引擎友好的一定优势。
其次,CSS+DIV制作的网站使得网站改版相对简单,很多问题只需要改变CSS而不需要改动程序,从而降低了网站改版的成本。如果说某个页面元素需要凸出于页平面,通常使用的表格就不能完成功能了,因为在同一平面页面元素是不能叠加的。而把某一页面元素设置为背景也比较局限。因为制作过程中只能把图片作为背景,不能把Flash 或者文本作为背景。
遇到这样的情况,可以利用“插入AP Div”来解决。“AP Div”可以把它理解成漂浮于页平面的一个空间,这个空间可以像网页一样放入图片、Flash、文字等内容,并且它还有一个非常重要的属性,就是它具有Z 轴。如果把页面的长宽分别看成以左上角为起点的X 轴和Y轴的话,那Z 轴就是垂直于页面的凸起轴,Z 轴的值越大,层就越上,那么放置于改层AP Div内的页面元素就会遮挡住其它的页面元素,从而显示在页面更上方。同时利用AP Div凸出于页平面的这一特性,可以将需要运用的页面元素放置于其中,然后拖动AP Div的位置,轻松实现页面元素的定位。
AP Div比较适合于Flash 结合使用,通常是把Flash 透明动画放置于AP Div中,然后作为图片的装饰,使页面产生动画效果。
2.4 动态效果
动态效果是剪纸网站设计的重点,主要由Flash按钮,Flash文本,视频,背景音乐以及AP Div的行为组成,简单的动态效果可以使网页变的有声有色,增强观赏性。
在剪纸文化网中,由于笔者大部分用的AP Div来布局,可以方便的使用AP Div添加行为。
2.5 交互
交互是参与活动的对象,可以相互交流,双方面进行互动。对于一个网站来说,交互是至关重要的。若一个网站不能与使用者互动,不能及时了解浏览者的需求,则网站很难维持下去。在剪纸文化网中,笔者充分考虑了这个问题,不仅设计了电子邮件的交互,还能在线留言,并对网站的教程资源进行下载方便用户的应用。
2.6 测试
2.6.1 链接测试
链接是指在电子计算机程序的各模块之间传递参数和控制命令,并把它们组成一个可执行的整体的过程。在剪纸文化网中,笔者用到的链接样式有锚点链接,空链接,电子邮件链接等内部链接,在测试过程中,所有的链接都能正常运行。
2.6.2 动态效果测试
在剪纸文化网中,由于动态效果是笔者所要展示的重点,所以对动态效果进行测试是至关重要的环节。笔者大部分页面是用AP Div布局,因此大多的动态效果是AP Div的行为特效,另外还有Flash以及时间轴动画等,在对动态效果的测试过程中,有些效果和设计有所偏差,但经过修改,已经达到了让人满意的水平。
2.6.3 留言板测试
对留言板的返回首页,我要留言,查看留言,管理登陆四个选项依次进行了测试,除了上面提到的我要留言选项中输入的必须是数字QQ号外,其他选项中的内容也进行了细致的测试,如管理登陆时若密码输入错误,也会出现提醒等,对留言板的测试要在ISS环境下进行,不管是留言,查看或者管理等都可正常运行。
参考文献:
[1] 朱印宏,袁衍明. Dreamweaver 8完美网页设计(技术入门篇)[M]. 北京:中国电力出版社,2006.