1.1 Dreamweaver CS3基本概述
Dreamweaver CS3是Adobe公司最新推出的网页制作软件版本,也是网络浏览文件的一个开发工具,它具有强大的功能和简便的操作平台,是一款所见即所得的网页制作软件。该软件集网页制作、网站管理、程序开发于一身,可以帮助用户在同一个软件中完成所有网站建设的相关工作。
Dreamweaver是由美国著名的软件开发厂商Adobe公司推出的一套专业可视化网页开发工具。它与该公司的另外两个网页制作软件Flash、Fireworks并称“DreamTeam”,在国内被人们称做“网页三剑客”。其中Flash用来生成矢量动画,Fireworks完成Web图像制作。当然,在最新的Adobe CS3软件系统中,Photoshop取代了Fireworks成为最主要的Web图像制作工具,对于比较熟悉Photoshop 的用户来说,也可以把它们称为“新网页三剑客”。因此,在Adobe CS3软件中,Adobe公司将Photoshop作为首选集成图像编辑软件,而Dreamweaver则是进行各类素材的集成和发布。由于Dreamweaver支持多种浏览器,可跨平台开发网页,实现了可视化动态HTML编程,方便地集成了Flash、ShockWave、ActiveX等众多外部媒体,加上使用简便,可扩展性强,到目前为止,全世界范围内超过60%的专业网页设计师都在选用Dreamweaver作为网页开发工具,编织他们的梦想。
Dreamweaver支持跨浏览器开发,能够做出既适合Internet Explorer又适合Netscape浏览的精美页面来。另外Dreamweaver强大的编辑功能和简洁实用的用户界面也受众多用户所钟爱,独特而富有亲和力的体贴设计理念让你能够方便地实现对页面创作的所有灵感。
网页制作人员可以利用Dreamweaver操作环境面板提供的层叠样式表(CSS)格式化文本、利用AP Div定位网页元素、利用时间轴和行为实现网页的动画效果、利用对象库(Library)实现代码的重复使用,甚至可以用Dreamweaver来进行本地和远程站点的管理和异地网页编辑。因此,可以说Adobe公司出品的Dreamweaver CS3,是一个让人很容易上手并且熟练掌握的优秀网页制作软件。
Dreamweaver软件是目前网页制作行业中比较流行和实用的一款工具。因此,为了推广和适应广大学习网页制作者的要求,本书将以各种实例的制作过程讲解Dreamweaver CS3的各项功能和使用方法,帮助读者进入Dreamweaver的世界,成为网页制作高手。
1.2 Dreamweaver CS3特点总结
Dreamweaver之所以能成为专业网站设计人员的首选工具,主要是因为它相对于其他可视化网页编辑软件,有着自己突出的优势,总的归纳起来,有以下几个特点:
灵活编写网页的特点
设计人员利用一些浮动窗口,可以用鼠标单击的方式插入图像、表格、表单、Applet、脚本语言等各种对象,同时也提供对代码的编辑、体式菜单,包括样式表和JavaScript脚本。不管是网页制作人员还是开发人员,都可以根据自己的需要选择Dreamweaver软件不同的工作界面,因此,对Dreamweaver读者来说,在工作界面上具有灵活和人性化的特点。
Dreamweaver CS3除了在制作界面上可以灵活选择以外,还有各个对象面板也比较灵活,使用
它在制作网页和开发代码程序时,可以将当前使用
的面板脱离主体,浮动在工作界面上,方便各个功
能的使用,如图1-1所示。
可视化编辑界面
类似于可视化编程工具V isual Studio ,在编写
网页程序的过程中,集成了强大的可视化编辑界面
的Dreamweaver 是一种所见即所得的HTML 编辑
器,可实现页面元素的插入和生成。可视化编辑环
境大量减少了代码的编写,同时也保证了其专业性
和兼容性,并且可以对内部的HTML 编辑器和任
何第三方的HTML 编辑器进行实时的访问。无论
习惯手工输入HTML 源代码还是使用可视化的编
辑界面,Dreamweaver 都将提供便捷的方式使设计
网页和管理网站变得更容易。
Dreamweaver CS3还有一个重要的特点就
是“文档”面板上的“可视化助理”功能,它可
以帮助读者在制作和开发网页的时候,显示当前
网页的样式效果,方便读者的网页编辑,如图1-2
所示。 强大的Web 站点管理功能
用户自定义控制不仅可以迅速完成个人页面
以及站点的设计,而且Dreamweaver 的Roundtrip
HTML/JavaScript 行为库以及模板和标签功能也
非常适合大型网站的合作开发,通过与其他组产
品的配合使用以及众多第三方支持可轻松完成动
态发布电子商务网站的构建。同时,Dreamweaver
还具有FTP 本地站点和远程站点的维护和更新,
对站点内的文件、链接、删除、增加等操作的管理
css最新功能,而且还具备了上传、下载等文件传输行为,
如图1-3所示。利用Dreamweaver 中的站点管理功
能,可以统一分配工作内容,提高大型网站建设的
工作效率,保护文件的安全。 图1-1 可浮动工作面板
图1-2 可视化编辑界面
图1-3 站点面板
Dreamweaver 的集成特性
由于主要的这几个网站制作软件都是由
Adobe 公司推出的,因此Dreamweaver 将
Photoshop 、Flash 和
Shockwave 集成在一起,
可以在这些Web 创作工具之间自由地进行切
换,轻松地创建美观实用的网页,如图1-4
所示。 丰富的媒体支持能力
可以方便地加入Java 、Flash 、Shockwave 、
ActiveX 以及其他Plug-in 媒体。Dreamweaver
具有强大的多媒体处理功能,在设计DHTML
(Dynamic HTML ,动态HTML )和CSS
(Cascading Style Sheets ,层叠样式表)方面表
现得极为出,它利用JavaScript 和DHTML
语言代码轻松地实现网页元素的动作和交互
操作。Dreamweaver 还提供行为和时间线两种
控件来产生交互式响应和进行动画处理,如
图1-5所示。 超强的扩展能力
Dreamweaver 支持增加第三方插件,任何
人都可以根据自己的需要扩展Dreamweaver
的功能,并且可以发布这些插件,如图1-6
所示。
当然,Dreamweaver 最大的优点是可以让
一个原来对网页一窍不通的人迅速成为网页
制作高手,更可以给专业的网站设计师提供
强大的开发工具和无穷的创作灵感,不必写
一行代码,就能够实现JavaScript 、DHTML
才能实现的特效。它是不是真的有这样奇妙,
下面就来进一步了解Dreamweaver CS3的新
特性。
图1-4 Dreamweaver 的集成特性 图1-5 丰富的媒体支持能力
图1-6 扩展器面板
1.3 Dreamweaver CS3最新功能
在以往Dreamweaver 版本的基础上,Dreamweaver CS3新增了不少的功能,由于增加了使用功能,使Dreamweaver CS3对计算机所使用的系统提出了更高的要求,因此,读者在安装Dreamweaver CS3之前,首选要查看自己的计算机是否达到要求:
●Intel Pentium 4、Intel Centrino、Intel Xeon或Intel Core Duo(或兼容)处理器
最新的Dreamweaver CS3对安装要求来说,相对比较高,因为集成以往众多功能的使用,因此在处理上需要更高的要求,这样才能提高速度。
●Microsoft Windows XP Service Pack 2或Windows V ista Home Premium、Business、Ultimate
或Enterprise
针对目前大多数用户都在使用XP系统,因此,Adobe在开发Dreamweaver CS3软件时,将运行的系统环境定位在Windows XP及以上系统中。为了更好地运行Dreamweaver CS3软件,建议使用Dreamweaver CS3的用户将系统升级到Windows XP。
●1GB内存
Dreamweaver CS3在安装时提示需要1GB以上内存,但笔者在512MB上也能安装成功,并能运行。运行Dreamweaver CS3需要占用很大的内存空间,特别是在制作网页时,更需要内存空间来支持,因此,建议读者将内存配置到512MB及以上,如果同时运行Studio 8,那需要更多的内存空间。
●1024×768像素显示器分辨率,16位显卡
●5GB以上可用磁盘空间
由于Dreamweaver CS3在安装过程中占用的硬盘空间需要2GB,再加上硬盘的活动空间,可用磁盘空间应该设置在5GB以上,否则,安装了Dreamweaver CS3软件将无法运行。
在上一小节中已经介绍了关于Dreamweaver CS3的一些基本特点,为了使已经掌握或熟悉以前版本Dreamweaver软件的用户了解新增功能的特点,下面再介绍Dreamweaver 8升级到Dreamweaver CS3的一些新增功能。
●Ajax的Spry框架
通过Adobe Dreamweaver CS3,可以使用Ajax的Spry框架进行动态用户界面的可视化设计、开发和部署。Ajax的Spry框架是一个面向Web设计人员的JavaScript库,用于构建向用户提供更丰富体验的网页。Spry与其他Ajax框架不同,可以同时为设计人员和开发人员所用,因为实际上它的99% 都是HTM
L。
Spry框架是一个JavaScript库,Web设计人员使用它可以构建能够向站点访问者提供更丰富体验的Web页。有了Spry,就可以使用HTML、CSS 和极少量的JavaScript将XML 数据合并到HTML 文档中,创建构件(如折叠构件和菜单栏),向各种页面元素中添加不同种类的效果。在设计上,Spry框架的标记非常简单且便于那些具有HTML、CSS和JavaScript基础知识的用户使用。
●Spry构件
Spry构件是预置的常用用户界面组件,可以使用CSS自定义这些组件,然后将其添加到网页中。
使用Dreamweaver,读者可以将多个Spry构件添加到自己的页面中,这些构件包括XML驱动的列表和表格、折叠构件、选项卡式界面和具有验证功能的表单元素。
●Spry效果
Spry效果是一种提高网站外观吸引力的简洁方式。这种效果差不多可应用于HTML页面上的所有元素。可以添加Spry效果来放大、收缩、渐隐和高亮显示元素,在一段时间内以可视方式更改页面元素,以及执行更多操作。
“Spry效果”是视觉增强功能,可以将它们应用于使用JavaScript的HTML页面上几乎所有的元素。效果通常用于在一段时间内高亮显示信息,创建动画过渡或者以可视方式修改页面元素。可以将效果直接应用于HTML元素,而无需其他自定义标签。
●高级Photoshop CS3集成
Dreamweaver包括了与Photoshop CS3的增强的集成功能。现在,设计人员可以在Photoshop中选择设计的任一部分(甚至可以跨多个层),然后将其直接粘贴到Dreamweaver页面中。Dreamweaver 会显示一个对话框,可在其中为图像指定优化选项。如果需要编辑图像,只需双击图像即可在Photoshop中打开原始的带图层PSD文件进行编辑。
●浏览器兼容性检查
Dreamweaver中新的浏览器兼容性检查功能可生成报告,指出各种浏览器中与CSS相关的呈现问题。在代码视图中,这些问题以绿下划线来标记,因此读者可以准确知道产生问题的代码位置。确定问题之后,如果知道解决方案,则可以快速解决问题;如果需要了解详细信息,则可以访问Adobe CSS Advisor。
浏览器兼容性检查(BCC)功能可以帮助读者定位在某些浏览器中有问题的HTML和CSS组合。当在
打开的文件中运行BCC时,Dreamweaver扫描文件,并在“结果”面板中报告所有潜在的CSS呈现问题。信任评级由四分之一、二分之一、四分之三或完全填充的圆表示,指示了错误发生的可能性(四分之一填充的圆表示可能发生,完全填充的圆表示非常可能发生)。对于它到的每个潜在的错误,Dreamweaver还提供了指向有关Adobe CSS Advisor错误的文档的直接链接、详述已知浏览器呈现错误的Web站点以及修复错误的解决方案。
●Adobe CSS Advisor
Adobe CSS Advisor网站包含有关最新CSS问题的信息,在浏览器兼容性检查过程中可通过Dreamweaver用户界面直接访问该网站。Adobe CSS Advisor不只是一个论坛、一个Wiki页面或一个讨论组,它使读者可以方便地为现有内容提供建议和改进意见,或者方便地添加新的问题以使整个社区都能够从中受益。
●CSS布局
Dreamweaver提供一组预先设计的CSS布局,它们可以帮助快速设计好页面并开始运行,并且在代码中提供了丰富的内联注释以帮助了解CSS页面布局。Web上的大多数站点设计都可以被归类为一列、两列或三列式布局,而且每种布局都包含许多附加元素(例如标题和脚注)。Dreamweaver 提供了一个包含基本布局设计的综合性列表,可以自定义这些设计以满足自己的需要。
●管理CSS
借助管理CSS功能,可以轻松地在文档之间、文档标题与外部表之间、外部CSS文件之间以及更多位置之间移动CSS规则。此外,还可以将内联CSS转换为CSS规则,并且只需通过拖放操
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论