AdobeDreamweaver,简称“DW”,中文名称叫做“梦想编织者”,最初由美国MACROMEDIA公司开发,在05年被Adobe公司收购。主要是一款集网页制作和管理网站与一身的所见即所得网页代码编辑器。利用对HTML、CSS、JS等内容的支持,开发者可以在几乎任何地方快速制作和进行网站建设。
图片来自网络DW使用的接口,亦有HTML(一种标准通用标记语言下的一个应用)编辑的功能,借助经过简化的智能编码引擎,轻松地创建、编码和管理动态网站。访问代码提示,即可快速了解HTML、CSS和其他Web标准。使用视觉辅助功能减少错误并提高网站开发速度。
一、工作界面
初始界面
安装后,它会自动在Windows的菜单中创建程序组,在3.0版本中,它的工具栏全是浮动工具栏,可以将工具栏缩小,也可以关闭。在专业术语里面,叫做“浮动面板”,利用浮动面板来控制对页面的编写,而不是利用烦琐的对话框,这是DW3.0编辑网页中最值得人赞赏的特性。通过在浮动面板中进行属性设置,这样就直接可以在文档中看到结果,避免了中间过程,提高了工作效率。但对于熟悉了微软的应用程序的用户来说,开始的时候可能很不习惯。先来介绍它的三个最重要的浮动面板。
启动面板
启动面板主要用来快速启动相应的任务,或显示/隐藏相应的浮动面板。如果启动面板是竖的,那么,可以点击它右下角的一个小按钮,它就可以变成横向的了,这时,可能会发现,它的状态栏上也有这个面板上的所有选项。这也就为网页制作者提供了方便。可以直接从右下角点击相应的栏目进入想要进入的对话框。
对象面板
对象面板主要功能相当于插入菜单,主要是向网页中插入一些对象,如表格,框架,图像,层,Flash动画等,它通过一个下拉菜单,把要插入的选项都包括在了其中。每一个选项中都有若干个图标,只要在图表上单击一下,就可以插入想要插入的对象了。
属性面板
属性面板会随着编辑的内容而变化,这个图是文字属性面板,它里面包含了所要编辑的文字的所有内容,包括字体,颜色,大小,连接,缩进等,它的右下角还有一个向下的小三角箭头,单击它,会展开属性面板,它把一些不常用的属性也列出来。展开后,箭头会变成向上,单击它,又会使属性面板复原。属性面板很多,还有图像属性控制面板,层属性控制面板等对象的属性控制面板,用户只要选择要编辑的对象,它就会自动变化,挺方便的。用户对所有由启动面板弹出来的浮动面板在被打开后,可以重新组合,可以将经常用的面板单独地拉出来,只需要将鼠标放到想要拉的按钮上面,然后按住左键拖动就可以了,同理,把他们组合也是一样,用鼠标拖动后,放到上面就可以。
二、功能介绍
1.具体功能
1.1CS6新增功能
利用AdobeDreamweaverCS6软件中改善的FTP性能,更高效地传输大型文件。更新的“实时视图”和“多屏幕预览”面板可呈现HTML5代码,使您能检查自己的工作。
1.2自适应网络
又称“可响应的自适应网络版面”使用响应迅速的CSS3自适应网格版面,来创建跨平台和跨浏览器的兼容网页设计。利用简洁、业界标准的代码为各种不同设备和计算机开发项目,提高工作效率。直观地创建复杂网页设计和页面版面,无需忙于编写代码。
1.3改善FTP性能
利用重新改良的多线程FTP传输工具节省上传大型文件的时间。更快速高效地上传网站文件,缩短制作时间。
1.4Catalyst集成
AdobeBusinessCatalyst集成,使用Dreamweaver中集成的BusinessCatalyst面板连接并编辑您利用AdobeBusinessCatalyst(需另外购买)建立的网站。利用托管解决方案建立电子商务网站。
1.5增强型jQuery移动支持
使用更新的jQuery移动框架支持为iOS和Android平台建立本地应用程序。建立触及移动受众的应用程序,同时简化您的移动开发工作流程。
1.6更新的PhoneGap支持
更新的AdobePhoneGap支持可轻松为Android和iOS建立和封装本地应用程序。通过改编现有的HTML代码来创建移动应用程序。使用PhoneGap模拟器检查您的设计。
1.7CSS3转换
将CSS属性变化制成动画转换效果,使网页设计栩栩如生。在您处理网页元素和创建优美效果时保持对网页设计的精准控制。
1.8更新的实时视图
使用更新的“实时视图”功能在发布前测试页面。“实时视图”现已使用最新版的WebKit转换引擎,能够提供绝佳的HTML5支持。
1.9更新的多屏幕预览面板
利用更新的“多屏幕预览”面板检查智能手机、平板电脑和台式机所建立项目的显示画面。该增强型面板能够让您检查HTML5内容呈现。
1.10CS5后的新增功能
借助AdobeDreamweaverCS5.5软件充满自信地进行设计、构建最新的HTML5和CSS3网站、令交互性更上一层楼。同时为多个设备进行设计,并对全面的代码检查充满自信。
1.11“多屏幕预览”面板
借助“多屏幕预览”面板,为智能手机、Tablet和个人计算机进行设计。借助媒体查询支持,开发人员可以通过一个面板为各种设备设计样式并实现渲染可视化。
1.12CSS3/HTML5支持
通过CSS面板设置样式,该面板经过更新可支持新的CSS3规则。设计视图现支持媒体查询,在您调整屏幕尺寸的同时可应用不同的样式。使用HTML5进行前瞻性的编码,同时提供代码提示和设计视图渲染支持。
1.13JQuery集成
借助jQuery代码提示加入高级交互性。jQuery是行业标准JavaScript库,允许您为网页轻松加入各种交互性。借助针对手机的起动模板快速启动。
1.14借助PhoneGap构建本机Android和iOS应用程序
借助新增的PhoneGap功能为Android和iOS构建并打包本机应用程序。借助PhoneGap构建本机Android和iOS应用程序。
2.新增功能
2.1实时视图新增功能
借助DreamweaverCS4中新增的实时视图在真实的浏览器环境中设计网页,同时仍可以直接访问代码。呈现的屏幕内容会立即反映出对代码所做的更改。
针对Ajax和JavaScript框架的代码提示新增功能。
借助改进的JavaScript核心对象和基本数据类型支持,更快速、准确地编写JavaScript。通过集成包括jQuery、Prototype和Spry在内的流行JavaScript框架,充分利用DreamweaverCS4的扩展编码功能。
2.2相关文件新增功能
源代码,在“设计”视图中查看父页面。
2.3集成编码增强功能
领略内建代码提示的强大功能,令HTML、JavaScript、Spry和jQuery等Ajax框架、原型和几种服务器语言中的编码更快、更清晰。
2.4代码导航器新增功能
新增的“代码导航器”功能可显示影响当前选定内容的所有代码源,如CSS规则、服务器端包括、外部JavaScript功能、Dreamweaver模板、iframe源文件等。
2.5AdobeAIR创作支持新增功能
在Dreamweaver中直接新建基于HTML和JavaScript的AdobeAIR应用程序。在Dreamweaver中即可预览AIR应用程序。使AdobeAIR应用程序随时可与AIR打包及代码签名功能一起部署。
2.6FLV支持增强功能
通过轻松点击和符合标准的编码将FLV文件集成到任何网页中-无需AdobeFLASH软件知识。设计时在Dreamweaver全新的实时视图中播放FLV影片。
2.7支持领先技术
在支持大多数领先Web开发技术的工具中进行设计和编码,这些技术包括HTML、XHTML、CSS、XML、JavaScript、Ajax、PHP、AdobeColdFusion软件和ASP。
2.8学习最佳做法
参考CSS最佳做法实现可视化设计并辅以通俗易懂的实用概念说明。在支持可访问性和最佳做法的同时创造Ajax驱动的交互性。
2.9集成增强
通过跨产品线的直接通信和交互,充分利用DreamweaverCS4和其它Adobe工具的智能集成和强大功能,包括AdobeFLASHCS4Professional、FIREWORKSCS4、PhotoshopCS4和DeviceCentralCS4软件。
2.10AdobeInContextEditing新增功能
在Dreamweaver中设计页面,使最终用户能使用AdobeInContextEditing在线服务编辑他们的网页,无需帮助或使用其它软件。作为Dreamweaver设计人员,您可以限制对特定页面、特殊区域的更改权,甚至可以自定格式选项。
2.11Subversion集成新增功能
在Dreamweaver中直接更新站点和登记修改内容。DreamweaverCS4与Subversion软件紧密集成,后者是一款开放源代码版本控制系统,可以提供更强大的登记/注销体验。
2.12跨平台支持增强功能
随心所欲,尽情工作:DreamweaverCS4可用于基于Intel或PowerPC的Mac、MicrosoftWindowsXP以及WindowsVista系统。在首选系统中设计,交付跨平台、可靠、一致、高性能的成果。
三、软件优点
1.制作效率
Dreamweaver可以用最快速的方式将Fireworks,FreeHand,或Photoshop等档案移至网页上。使用检色吸管工具选择荧幕上的颜色可设定最接近的网页安全色。对于选单,快捷键与格式控制,都只要一个简单步骤便可完成。Dreamweaver能与您喜爱的设计工具,如PlaybackFlash,Shockwave和外挂模组等搭配,不需离开Dreamweaver便可完成,整体运用流程自然顺畅。除此之外,只要单击便可使Dreamweaver自动开启Firework或Photoshop来进行编辑与设定图档的最佳化。
2.网站管理
使用网站地图可以快速制作网站雏形、设计、更新和重组网页。改变网页位置或档案名称,Dreamweaver会自动更新所有链接。使用支援文字、HTML码、HTML属性标签和一般语法的搜寻及置换功能使得复杂的网站更新变得迅速又简单。
3.控制能力
Dreamweaver是提供RoundtripHTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。甚至可以排序或格式化表格群组,Dreamweaver支援精准定位,利用可轻易转换成表格的图层以拖拉置放的方式进行版面配置。所见即所得Dreamweaver成功整合动态式出版视觉编辑及电子商务功能,提供超强的支援能力给Third-party厂商,包含ASP,Apache,BroadVision,ColdFusion,iCAT,Tango与自行发展的应用软体。当您正使用Dreamweaver在设计动态网页时,所见即所得的功能,让您不需要透过浏览器就能预览网页。梦幻样版和XMLDreamweaver将内容与设计分开,应用于快速网页更新和团队合作网页编辑。建立网页外观的样版,指定可编辑或不可编辑的部份,内容提供者可直接编辑以样式为主的内容却不会不小心改变既定之样式。您也可以使用样版正确地输入或输出XML内容。全方位的呈现利用Dreamweaver设计的网页,可以全方位的呈现在任何平台的热门浏览器上。对于cascadingstylesheets的动态HTML支援和鼠标换图效果,声音和动画的DHTML效果资料库可在Netscape和MicrosoftInternetExplorer上执行。使用不同浏览器检示功能,Dreamweaver可以告知您在不同浏览器上执行的成效如何。当有新的浏览器上市时,只要从Dreamweaver的网站在下载它的描述档,便可得知详尽的成效报告。
无需编写代码即可实施CSS最佳做法。在“属性”面板中新建CSS规则,并在样式级联中清晰、简单地说明每个属性的相应位置。
4.全面的CSS支持增强功能
使用DreamweaverCS4中增强的CSS实施工具令您的网站脱颖而出。借助“设计”和“实时视图”中的即时可视反馈,在“属性”面板中快速定义和修改CSS规则。使用新增的“相关文件”和“代码导航器”功能找到定义特定CSS规则的位置。
5.学习资源增强功能
借助DreamweaverCS4中丰富的产品随附教程掌握Web构建技能。通过由社区推动的帮助系统与最新Web技术保持同步。
四、软件缺点
1.效果难一致
难以精确达到与浏览器完全一致的显示效果也就是说您在所见即所得网页编辑器中制作的网页放到浏览器中是很难完全达到您真正想要的效果,这一点在结构复杂一些的网页(如分帧结构、动态网页结构)中便可以体现出来;
2.代码难控制
相比之下,非所见所得的网页编辑器,就不存在这个问题,因为所有的HTML代码都在您的监控下产生,但是由于非所见所得编辑器的先天条件就注定了它的工作低效率。如何实现两者的结合,则既产生干净、准确的HTML代码,具备所见所得的高效率、直观性。