Review: Dreamweaver
4
| Reviewer: |
Joel Davies
2-26-01 |
| Price: |
Full: US$299;
Upgrade US $149.
Dreamweaver/Fireworks 4 Studio $449 |
| Requirements: |
Power Macintosh with MacOS 8.6 or
9.x
32 MB of available system RAM
135 MB of available disk space
color monitor capable of 800x600 resolution
CD-ROM Drive. |
| URL: |
http://www.macromedia.com/software/dreamweaver/ |
| Contact: |
sales@macromedia.com |
| Rating |
Five out of Five bites of the Apple |
For Web designers and programmers, Dreamweaver
4 (or as some here at Applelust call it, "Dreamy"),
offers both incredibly easy to use WYSIWYG design tools
and text editors & debuggers. As a Web design professional,
I've heard the grumbling about WYSIWYG editors for several
years. Most concerns center around the perception that
WYSIWYG editors create bad HTML code. Some design houses
even tout the fact that all programming and design is
accomplished solely by "hand", using Simpletext
or Notepad.
Well, this isn't "Antique Roadshow,"
and there is no prize for quaint, outdated workflow
(read:SLOW). Dreamweaver 4 creates clean, reliable HTML
code, while providing tools for design teams to retool
their workflow and seriously improve productivity. If
you've never used Dreamweaver before, this is the time
to try it on for size.
I'm generally lukewarm about upgrades
- I don't have a lot of cash to spend on them, and I
get annoyed when an upgrade is mainly dedicated to fixing
bugs in the previous version. However, Dreamweaver 4
introduces several major improvements to a WYSIWYG engine
that already dominates the competition in features and
stability.
My background is art and design, so I
immediately dived right into the WYSIWYG tools. There
are new features in Dreamweaver 4 that radically simplify
page layout. Using the new panels and tools, you can
create a robust site in a matter of days rather than
weeks.
The
first change seasoned Dreamweaver users will find is
the new user interface. Macromedia has standardized
the docking panel interface in all of its Web design
products. Flash, Fireworks and Dreamweaver now have
similar panel interfaces, and there is a panel for everything
you can imagine editing. The big addition to the panels
from Dreamweaver 3 is the Assets panel, which lets you
view a categorical list of images, links, colors, scripts,
templates, library items and rich media elements in
your site. These elements can be dragged right from
the Assets panel right into an open HTML page. After
a few minutes of experimenting with the panel, I quickly
became addicted to the ability to recall colors used
throughout a site without opening pages and inspecting
code.
The next change a Dreamweaver user will
notice is the addition of the Layout view option to
the Objects panel. The Layout view and its table and
cell tools allow you to draw complicated and stable
tables quickly and easily. You simply click the icon
to change from Standard view (selecting and modifying
tables Dreamweaver 3 style) to Layout view, and you
are now in WYSIWYG heaven. The Layout feature is most
impressive when used to create a table for a complex
navigation system. The best method I found to create
a quick, but complex tables is to place a tracing image
(either a Fireworks or Photoshop mockup of the layout)
on the page in the Page Properties pop-up (Apple+J)
and then draw the table to fit the tracing image. Click
the Draw Layout Table icon to draw the overall table
size, then add cells with the Draw Layout Cell tool.
Hold down the Apple key to draw continuous cells in
a row or column. You can also modify table and cell
specifications using the Properties bar (Apple+F3).
Note - advanced users might want to combine both the
Layout and Standard views to draw nested tables.
Dreamweaver 4 also gives users the capability
of producing Flash buttons and text. If you need to
use a specific font on a page for a logo or branding
element, the nature of the Web restricts you to using
only fonts that have a wide installation base, such
as Times and Arial. If the client machine (read:surfer)
does not have the font you have chosen, it generally
displays as Times in their browser. Flash text embeds
the font information into the file itself, and always
displays correctly, regardless of platform and browser.
Flash files are vector based rather than rasterized,
so they tend to be tiny, quick downloads. The down side
to this is that Flash is a plug-in, so users without
the plug-in will need to download it to view you pages
correctly. All of the text headers in this review were
created as Flash text and buttons.
Flash buttons can also be created in Dreamweaver,
and Macromedia has included a couple dozen button templates
to choose from. These also have the advantage of a fast
download and include rollover and down states for a
more robust user experience. If you own Flash, you can
create new button templates for your site with the free
Generator authoring templates. The Macromedia Exchange
also includes free Flash button templates for downloading
- I will discuss the Exchange in greater detail later
in this review.
Macromedia seems to be reaching out to
the die-hard programmers and text editors left in Webdom
with Dreamweaver 4. There is now an integrated text
editor, ala Frontpage, that allows you to flip back
and forth between WYSIWYG and text editing modes, or
display both modes at once. The editor can handle non-HTML
code, such as Javascript and XML, among other scripting
languages. It also includes a code debugger for checking
Javascripts in a preview browser. Those of you who are
WYSIWYG designers like myself are glazing over right
now, but these are serious improvements aimed at the
old (and new ) school code jockeys out there.
A
very impressive addition to the editor is the inclusion
of an O'Reilly Reference panel dedicated to CSS, HTML
and Javascript. Select an element on the page and click
the Reference button (<?>) at the top to get a
full explanation of the code utilized including browser
compatibility in the Reference panel. The Reference
panel also provides examples of the tag in use, and
object model references for advanced scripting.
For those programmers and designers who
thirst for a high level of productivity, Dreamweaver
clobbers the nearest competition. Are you the kind of
user that loves keyboard shortcuts? Dreamweaver now
allows you to set up your own set of shortcuts, which
you can print out for reference as an exported HTML
file.
The site window has had a minor makeover
in Dreamweaver 4 - those of you new to the software,
the site is the heart and soul of Dreamweaver. After
you have set up your site, you can utilize the window
to dynamically update links as you change site structure
and file hierarchy. In short, if you rename a file or
move a file to another folder, Dreamweaver will detect
the links affected throughout the site and update them
as necessary. However, you must make sure that you set
up you site menu correctly for this to work (note -
read the manual!). The site window also serves as an
FTP client to the server. I've used Dreamweaver to maintain
sites on all server platforms, and have NEVER had a
problem with this feature.
The site window also incorporates a few
nice features for workgroups and design teams. The site
notes feature allows you to "post" notes to
other users of your site next to chosen files. The file
Check-in check-out feature has been expanded to include
e-mail links to your design team. If you use this feature,
when a team member checks out a file, no one else has
access to that file until it has been checked in. This
prevents teams from overwriting files and losing work.
The new e-mail link feature makes it simple to send
a barrage of requests to your buddies to "hurry
up and finish" the file you need to edit. Finally,
you can use the site to generate reports on workflow
and HTML issues such as what files are checked out,
missing alt text, redundant font tags, and a few other
goodies.
I already discussed the plethora of docking
panels, including the cool new assets and reference
panels. With a high enough resolution monitor, you can
cascade all these panels across your desktop. The ability
to change attributes of tables, CSS styles and anything
else you might want to customize.
Templates are improved in version 4, especially
when used in combination with the Layout view. You can
use templates to quickly set up a consistent, cohesive
site, and specify which areas of a template are editable
on individual pages. For large Web site, templates make
creating new pages fast and easy.
The least reported and greatest strength
of Dreamweaver is the Extensions Manager and Dreamweaver
Exchange. This allow worldwide users to collaborate
and share new extensions for easy downloading and installation.
If you find yourself needing a custom script to detect
a client browser, just click on Dreamweaver Exchange
under the Help menu, and you will be transported to
the Macromedia Web site Set up a free user account,
and you can browse through several categories of extensions
for Dreamweaver. If you are looking for Dreamweaver
to do something specific, you find usually find it here.
Finally, if your purchase the Dreamweaver/Fireworks
4 Studio, you can use Fireworks to create .gif, .jpg,
and .png graphics optimized for the web in addition
to instant complex table layouts that are Dreamweaver
friendly. The combination of the two programs is a complete
web solution for layout and graphics. I will have a
follow up review of Fireworks 4 shortly that examines
the features and workflow between the two programs.
Pros
Dreamweaver 4 simply outperforms every competing
program due to its robust WYSIWYG, site management,
and text editing features. In my opinion, no product
even comes close. The code is stable and clean and
the program is easy to learn. The RAM requirements
are still pretty low, and its very stable on my PowerBook.
In general, the Pros are too numerous to list.
Cons
Only one, and it can be a killer for
some designers. If you install the MacOS 8.1 update,
it apparently changes the system color tables used
for indexed colors, reversing the black and white
values in .gifs inside Dreamweaver. When you upload
pages to the server, they look fine, but the color
changes can be REALLY distracting in Dreamweaver.
The quick fix (if you own Fireworks) is to Control-click
on the graphic and choose "Optimize in Fireworks,"
open the original file in Fireworks where it will
optimize and re-save the image. This will convert
the image to the new system color table which is probably
a good idea. Hopefully, either Macromedia or Adobe
will find a patch for this issue.
Rating
Five Bites out of the Apple. I feel
really conflicted giving a perfect score, but this
upgrade really blew me away. Dreamweaver 4 is, if
you will pardon the expression, dreamy. This review
and the accompanying graphics were created using the
Dreamweaver 4 Fireworks 4 Studio on a PowerBook.
Joel Davies
