 Product Review: Adobe
Dreamweaver CS5
The new features in Adobe Dreamweaver CS5 may at first seem
minor, and some even barely noticeable (like Incremental
Pagination), especially to the novice web designer. However, the
experienced web designer will appreciate the many time-saving
features and shortcuts built into this new version to enable them
to work faster and smarter.
Incremental Pagination
New to Dreamweaver CS5 is "Incremental Pagination," which allows
for quicker pre-viewing of minor changes made to your pages.
Dreamweaver CS5 now divides the visualization of a site into two
distinct operations: pagination (configuring the layout of page
fundamentals) and rendering (displaying the actual visual
properties).
In past versions of Dreamweaver, the program would paginate and
render at the same time, resulting in longer page refresh times.
With the new Incremental Pagination, when minor changes are made to
your design, Dreamweaver will render those changes instead of
re-rendering the whole page. This results in a quicker workflow. A
small change with an overall big benefit, saving time!
Live View Navigation and Live View Changes
Improvements have been added to the Dreamweaver CS5 Live View
Navigation, allowing designers to not only view all aspects of a
site as it appears online, but also to view and make changes on the
code within a specific page using Live Code.
Another helpful new feature is that Live View (and Live Code)
allows Dreamweaver to open sites other than your own, by merely
inserting the web's URL in the new Browser Navigation Toolbar.
Although changes are not allowed within the code or design of
another's site, a web designer will be able to study the
intricate coding details of a site that they admire, which makes
this new feature an invaluable educational device.
CSS Disable/Enable
The new CSS Disable/Enable function is another web designer's
cannot-live-without feature. By simply clicking next to a CSS
property (within the CSS Styles dropdown menu), the CSS
Disable/Enable function allows the designer to temporarily remove
those specific CSS properties within a page…without
permanently removing the property.
When you disable a CSS property using the CSS Disable/Enable
function, the CSS property still remains within your site's code,
but it is grayed-out with a comment inserted stating that it is
disabled. Important note: always toggle the Disable/Enable feature
on and off, as deleting or rewriting the code will cause
problems.
code before disabled ~ code with disabled applied ~ code enabled
again ~ enabling or accepting all changes
Once you are ready to make your changes permanent, right click
on any of the CSS properties that you disabled, and accept or
reject all the changes within the dropdown menu with one click.
CSS Inspect
CSS Insect lets the designer easily view (and make modifications
to) specific elements within a page, by turning a page into
color-coded elements. To fully understand the functionality of this
feature, first click the Inspect Button and hover your cursor over
the page. Areas that turn turquoise are the actual height and width
of a specific element, while yellow displays the margins, and pink
represents the padding.
Knowing exactly where each element is within your page allows
for effortless design modification, as each CSS element can then be
changed within the CSS Style Panel. In Split Mode, designers can
also view (and modify) the page within the code associated with the
visual element, or click on a specific tag in the Tag Selector and
change the elements in the CSS Style Panel.
Widgets
My favorite new Dreamweaver feature is the Adobe Widget Browser.
Although widgets were available in Dreamweaver CS4, the ease of
acquiring them has greatly improved in Dreamweaver CS5, within the
Adobe Widget Browser.
Within the Widget Browser, is the Adobe Exchange. In the
Exchange is an array of the current OpenAjax widgets available on
the Adobe Exchange. The widgets are created by Adobe,
third-party-developers, as well as Adobe Community members. Here
you preview, tryout, and save the widgets of your choice into your
"My Widget" folder for future use.
New Widgets are continually being created and added to the Adobe
Exchange. You also have the option of creating and sharing your own
widget creations with other Adobe Community members.
Business Catalyst
The direct link within Dreamweaver CS5 to Adobe's new Business
Catalyst is imperative for those of you who work with and
design e-commerce and business sites. Currently, the sign-up is
free, and the service is an invaluable, powerful hosted application
to enhance both small and large business sites.
Browser Lab
Last year, Adobe introduced Browser Lab, and this year they have
added a gateway to this amazing program, within Dreamweaver CS5.
Browser Lab allows the designer to view a site design in a variety
of browsers, without having to actually install the browser (for an
in depth view of Browser Lab, see my previous Browser Lab review). Although Browser Lab is
not new to Adobe, the ability to easily toggle between Browser Lab
and Dreamweaver CS5 is.
Adobe Illustrator Native Files
Adobe introduced the ability to insert an Adobe Photoshop file
(in its native format) directly into Dreamweaver CS4 as a smart
object. Dreamweaver CS5 takes the integration of Adobe software
programs a step further. Now, native Adobe Illustrator files can be
imported and converted directly into Dreamweaver CS5.
Other Additional New Features
"Integrated CMS support" allows designers to author and provide
the ability for testing support for content management system
frameworks (WordPress, Joomla!, Drupa).
The "PHP custom class code hinting" and "Site-specific code
hinting" allow designers to write accurate code by displaying the
proper syntax for custom PHP functions, as well as in Dreamweaver's
nonstandard files and directories.
In Summary
With the majority of new features in Dreamweaver CS5 geared
toward the advanced web designer, it is very apparent that
Dreamweaver is no longer a mere WYSIWYG editor. Although many of
the new features in Dreamweaver CS5 are designed to make work flow
with time-saving benefits, there is no mistaking that Adobe's
Dreamweaver CS5 is a serious program for serious designers.
In some ways I miss the simplicity of earlier "Macromedia"
versions. There are times that I just want to toss a site together
for the fun of it. I don't want to worry about viewing code or CSS
properties. Perhaps Adobe will create an alternative to the
industry powerhouse that Dreamweaver has become, and offer a
functional, yet stripped down, Dreamweaver version, similar to
Photoshop Elements.
For those of you who are longtime Dreamweaver users…or at the
very least, have a basic knowledge of HTML and CSS…you will
really enjoy the new and enhanced Dreamweaver CS5. If you are
unsure if this version offers all the features that you can't live
without, be sure to take it for a free test drive.
Adobe
All supporting images are copyright, and
cannot be
copied, printed, or reproduced in any manner without written
permission
|
Get to know industry
leaders and professionals
Comments