挖掘Dreamweaver 4.0的“潜力”
天极网 ERIC
对于希望在可视化环境中建设比较复杂的网站的专业互联网开发人员而言,Dreamweaver正在日益成为他们的第一选择。据Macromedia称,Dreamweaver的用户超过了70万,在互联网网站创作工具市场上占有最大的份额,超过了Adobe公司的GoLive和NetObjects公司的Fusion等对手。而用Dreamweaver制作的网页的数量就更多了,IDC提供的资料显示,使用Dreamweaver制作的网页数量预计将由1999年的17亿页增加为2004年的超过80亿页。
考虑到它的普及率,Dreamweaver 4.0中添加一些新的功能,使专业互联网开发人员设计更快、编码更简单、更容易协作的功能也就不令人惊奇了。在这篇文章中,我将就如何更好地利用其中的一些新功能作一些简单的介绍。
网页设计方面的技巧
无论是通过新的代码编辑器还是标准的可视化环境中设计网页,这些技巧都会对网站设计带来很大的帮助。
1、使网页页面弹性化
所谓的“弹性”是指互网页随着用户对浏览器窗口的大小改变而变化,当浏览器窗口变大后不会出现空白,缩小时不会显示不出来滚动条。大多数的简单网页都有“弹性”,但如果网页上有许多栏目和表格时,要使网页具有“弹性”就比较困难了。通常情况下,我们希望使用多种宽度的栏目和GIF图像创建对IE和Netscape
Navigator都兼容的网页,Dreamweaver 4.0就可以方便地设计“弹性”的网页。
打开网页,通过Objects面板上的按钮(图1)转到布局视图(Layout view)中,就会看到每个栏目的宽度以及每个栏目顶部的一个较小的下拉式箭头,点击想要设定弹显示的栏目上方的小箭头,在下拉菜单中选择“将栏目设为弹性显示”(Make
Column Autostretch)(图2),每次只能自动调整一个栏目的宽。此时,在该栏目顶部显示的就不再是它的宽度,而是一段波浪线(图3)。Dreamweaver还会自动地创建空白的GIF图像,它在栏目的顶部被表示为一个双道线条,空白的GIF图像是让网页具有“弹性”所必需的。(如果是第一次在网站上添加空白的GIF图像,会出现一个对话框,询问你是使用一个已有空白GIF图像、让Dreamweaver创建一个空白GIF图像或者完全不使用空白GIF图像)

图1

图2

图3
2、创建个性化的颜色盒
在Dreamweaver4中,你可以存储你自己设定的图片、链接、flash影片、颜色表、模板等等,组成这个站点的资产,这就是Assets面板!当我们定义一个站点时,这个站点内的所有上述类型的元素,将自动分类在Assets
面板中显示。面板上有一个Color标签,其中存储了包括文本、背景和链接颜色在内的在网站中使用的颜色,这是一个为使用者量身定做的网站导向颜色盘。
要看这个调色板,可以打开Assets面板(通过依次点击Window --> Assets),然后点击左侧的颜色按钮,就会看到网站中所使用的颜色清单。可以把这些颜色拖到选定的文本上。更令人高兴的是,如果选中一种颜色,就会在上面的窗口中显示这种颜色的十六进制值的色彩浓淡度和三色对应码(RGB)。(图4)。

图4
如果要减少网站中所使用的颜色数,就可以只在Assets面板中的Favorites区中加入需要的颜色,只需将选取的颜色反白,然后点击窗口底部最右面的按钮(被称作Add
to Favorites的按钮)即可。
3、创建弹出式的导航系统
要创建一个弹出式菜单导航系统需要使用许多的JavaScript代码,但是如果使用Dreamweaver/Fireworks软件,就可以很快地完成任务。在Fireworks中选择图像的一部分,然后依次选择Insert
--> Pop-Up Menu菜单项,在Set Pop-Up Menu对话框中可以通过输入菜单项的名字和点击Plus按钮在菜单中添加菜单项,还可以设置菜单的文本、链接,以及创建子菜单并重新排列和菜单项,完成这些工作后,点击Next按钮设置颜色、字体等参数,可以选择使用HTML或图像格式显示创建的菜单系统,然后点击Finish按钮。如果鼠标经过图像中的热点区域时,菜单系统就会显示出来。导出文件时,Fireworks会创建在Dreamweaver中显示这一菜单系统所必需的HTML、JavaScript代码和相关图像。此外,Dreamweaver还可以通过更多的方式与其他产品进行整合。
与其他产品进行整合
Dreamweaver最酷的特性之一是它可以与其他产品进行很好的整合,它可以与Fireworks实现完全的图像编辑互操作,甚至还能够创建Flash文本和Flash按钮。
4、动画GIF图形
如果拥有Dreamweaver/Fireworks软件,就可以充分享受二者之间充分的整合性带来的各种方便。即使你不是专业的图形设计师,偶尔也会想把一幅GIF格式的图像作成动画。要对一个网页中的图像进行动画处理,可以在标准窗口中选择图像,然后点击Property
Inspector中的Edit按钮,图像就会自动加载到Fireworks,如果安装了Studio包,Fireworks就会成为缺省的图像编辑器。然后就该转到Fireworks中了,选择图像,并依次选择Modify
--> Animate --> Animate Selection。然后填写Animate对话框中动画的帧数、图像的运动方向等参数,可以使用Frames面板中设置动画的速度,使用Object改变它的属性。要导出文件,可以使用Optimize面板选择Animated
GIF as the file type先项,点击Done按钮,Fireworks将自动地导出优化过的图像,更新GIF文件,并在Dreamweaver中显示更新后的文件。在浏览器中依次点击File
--> Preview就可以看到你作的漂亮的动画了。
5、添加Flash按钮
即使不使用Flash软件,也可以利用Dreamweaver在网页中创建和添加Flash按钮对象。Dreamweaver 4.0中有一些已经制作好的各种风格的Flash按钮对象,依次选择Insert
--> Interactive Images-->Flash Button就可以看到不同风格的按钮(图5),在这个对话框中,将鼠标掠过每种类型的按钮,就会看到它在浏览器中是如何“动”的。选中希望使用的风格,并填写按钮的文本、字体、颜色或定制的文件名等参数,点击OK按钮。就会创建出SWF文件并被插入网页中,如果点击它,Property
Inspector将显示文件的属性,还可以点击播放按钮预览按钮的动作。

图5