New York Web Design News January 14 2004, the latest breaking New York Web design news brought to you by,
Web Designs Now,Website Designs Now,New York Web Design Homepage,Web Design Services for New York, Connecticut, Long Island,New York Web Design Client Testimonials,Website Portfolio of New York Web Design, About this New York Web Design Firm,Contact this New York Web Design Firm

Web Suites: Adobe CS
Web Design & Technology News, January 14, 2004

Web Search Wars
Web Suites: Adobe CS
Web Design WYSIWYG's
Web Search Add-ons
SSL Web Problems
Web Creator Knighted

More Web Design News:
2008 Current News
2008 June
2007 June
2007 May
2007 March
2006 November
2006 September
2006 August
2006 July
2006 June
2006 May
2006 April
2006 March
2006 February
2006 January
2005 December
2005 November
2005 October
2005 September
2005 August
2005 July
2005 June
2005 May
2005 April
2005 March
2005 February
2004 March
2004 February
2004 January
2003 December
2003 November
2003 October
2003 September
2003 August
2003 July
2003 June
2003 March - May



January 14, 2004

Even though it's long been known only as "the company that makes Photoshop," Adobe Systems Inc. has been plugging away at a wide array of desktop publishing, digital imaging, and Web tools for some time now.
by Michael Calore

Adobe's InDesign software package recently surpassed Quark XPress as the de facto desktop publishing application at production houses, and has been gaining on Microsoft's FrontPage and Macromedia's Dreamweaver applications ever since it purchased a company called GoLive and began developing its first WYSIWYG editor.

Since Adobe took over, GoLive has grown into a full-featured editor that emphasizes team workflow, standards compliance, and device interoperability. It has been narrowly defeated twice by Dreamweaver in WYSIWYG shootouts, but the application has stood strong over the years to gain a place -- usually right along-side Photoshop -- with professional Web designers.

That close integration with Photoshop is one of the main reasons why GoLive has become the sensation that it is today. The ability to drag and drop images into a Web layout; full compatibility with PDF, PSD, and other proprietary formats among the Adobe family' as well as the familiar palette-and-desktop interface are all features that have scored major points among users. Also, since most Web professionals divide up their workflow between Photoshop, a text editor, and some flavor of WYSIWYG editor, making at least two of those pieces work together so flawlessly was a welcomed development.

And now things got even tighter. Adobe revamped all of its major applications, improved the integration of their collective functionality, and packaged them all together as the Adobe Creative Suite. Photoshop, GoLive, Illustrator, InDesign, and Acrobat Professional have all been updated to new versions, and a new content management tool called Version Cue is now included in the suite. The premium edition of Adobe Creative Suite includes all of these applications and carries a suggested price tag of US$1,229. There is also a standard edition which includes only Photoshop, Illustrator, InDesign, and Version Cue for a suggested price of $999. Registered users of previous versions of Adobe Photoshop can upgrade to the entire Creative Suite Premium for $749, or the Standard suite for $549. Creative Suite is available for Mac OS X 10.2.4 and later, and runs on Windows XP and 2000.

Photoshop CS
Adobe's newest version of Photoshop, which is available either as part of the Adobe Creative Suite or as a stand-alone application (for US$649, or $149 if you are upgrading), offers a few helpful improvements over the previous versions. Nothing here is too groundbreaking, but several of the new features are sure to be embraced by anyone preparing images for the Web. Photoshop CS also comes bundled with ImageReady, Adobe's Web-friendly program that compresses graphics or creates image maps with ease.

The Photoshop interface didn't change much. The same floating palettes are there, including all of the familiar tabbed menus and the pretty much the same version 7 toolbar. The File Browser, one of my favorite features from recent versions of Photoshop, is still there as well.

Accessed through the Window menu or by selecting "Browse" from the File menu, the File Browser allows quick scanning of all of the files within any folder on your system. Navigate to a folder to get a list of thumbnails for all of the images in the folder. Click on any one image and you'll get a small preview within the browser, along with any metadata -- file size, pixel width and height, color mode, the date the file was last edited, along with any metadata of your own that you create for the file. Within the File Browser, each image has fields for a description, an edit history, keywords to aid in searching, and copyright information. Images can be searched and sorted using just about any field, a nice feature if you or your team are dealing with thousands of image files.

Some of Photoshop's most useful keyboard shortcuts can be difficult to remember. Just ask anyone who moves between Mac and PC with any regularity and they'll tell you that the discrepancy between keyboard shortcuts on the two platforms is a real bummer. But wait! One of Photoshop's new features is a customizable keyboard shortcut menu. You can assign your own custom shortcuts to each of your most frequently used functions.

Photoshop CS also comes with new intelligent image correction tools. The auto-crop and auto-straighten functions are helpful to those of us who are not proficient photographers. Also, the new Shadow/Highlight tool was designed to take the guesswork out of using histograms and sliders, letting you improve a shot with less-than-perfect exposure settings.

There's one more new feature to discuss before we move on: ImageReady CS can now create Flash SWF files. Photoshop preserves and exports your layers as SWF layers and then ImageReady handles your vector graphics without degrading them. So if you're too busy to open Flash for that one function, here's your shortcut.

Are the New Tools Jewels?
Even though professional photographers and image experts use Photoshop all day, every day, and sweat over each pixel, the vast majority of us use Photoshop for one task: preparing photos for the Web. Two new Photoshop CS tools, the Auto Crop and Straighten filter and the Shadow/Highlight correction tool, make this task much easier.

When you select Auto Crop and Straighten from the File --> Automate menu, the filter automatically processes all of the photos that you have open in Photoshop. It looks for anything that would make it easy to frame the image, such as a hard border around a scanned photograph. If a hard border does not exist, then the tool will look for a natural border within the photograph.

The Shadow/Highlight correction tool, which is accessed through the Image --> Adjustments menu, is made for those photos that almost came out OK. Maybe the subject was heavily back lit, or maybe it was just a little bit washed out by the afternoon sun. Either way, it's nothing new. The Shadow/Highlight tool changes the strength of the shadows and the highlights in the image while preserving the midtone information.

The Shadows and Highlights tool has a variety of options. The default tool just has the sliders for the Shadows amount and the Highlights amount. The tool basically performs various functions of the Contrast tool, Levels tool, the Curves tool, and the Saturation tool. Of course, using all of those tools to fine-tune your corrections will yield the most desirable results, but if you are looking for a quick clean up job and the battery of tools in the Adjustments menu looks a little frightening, then the Shadow/Highlight sliders should prove sufficient. It's definitely a nice addition to the application.

GoLive CS
The last time we looked at Adobe GoLive, the WYSIWYG editor was cranking along at version 6.0. There isn't too much that has changed under the hood with the release of GoLive CS, but the user interface has undergone significant improvements. GoLive CS is available as part of the Premium version of Adobe CS, or as a stand-alone application -- it's US$399 by itself, or $169 if you're upgrading.

The new GoLive interface is clean and minimal, which maintains the theme set by all of the applications in the Creative Suite. Sitting on the desktop, it looks almost exactly like Photoshop. The new GoLive objects palette, seen on the left side of the screen, can be configured in two modes: the Photoshop-style toolbar mode, which is the default, and the old GoLive mode, which is a rectangular palette with tabbed menus.

The palettes themselves can be customized with ease. There are three of them in the default interface: the Inspector, the Color palette, and an auxiliary palette containing CSS tools, table tools, and a code library. Each palette is divided into tabs that hold different tools, and the tabs can be dragged from one palette to another to create custom palettes full of whichever tools you use the most for any particular task. Palettes can also be collapsed or stashed off-screen to free up workspace real estate.

The Inspector contains information about the object you are currently working on inside of your main layout space. The CSS tools are used to apply pre-determined styles to text and objects within your layout. The code library contains snippets of code for JavaScript, perl, PHP, ColdFusion, CSS, forms, tables, metadata, and more. The code snippets are easy to use: Just drag them from the library and place them on your page layout. For example, dragging the CSS style called "remove-link-underline" from the library into the <head> section of a page adds this simple line code to the defined styles:

a { text-decoration: none }

Once you've dragged and dropped items from the code library, you can use the Inspector, the source view (which also functions as a smart text editor), or GoLive's own Code Editor to make changes to the prefab snippets.

Whether you are building your own stylesheets or using the styles found in the code library, GoLive's CSS editor makes beefing up your CSS simple and quick. GoLive adds the newly defined style to the <head> of the document and places the style in a list of available styles in the CSS palette. Also, any changes made to the stylesheets are rendered in real time within the layout window.

Take a peek at the source and you'll see that the code GoLive creates is pretty clean, which is a nice change from the obfuscated mess generated by previous versions of GoLive.

Let's look at how GoLive handles images dropped in from Photoshop.

Smart Objects, Not-so-smart Grids
To test exactly how tight the integration is between the applications in Adobe Creative Suite, I dropped a raw Photoshop image onto my GoLive layout then tweaked the image from within GoLive.

Adobe CS makes this cross-application performance possible through a technology they call Smart Objects. Any element can be a Smart Object as long as it's in an Adobe file format native to one of its applications: PSD, PDF, or Illustrator vector art. Smart Objects are not only editable in applications across the Adobe Creative Suite, but they also retain information from their original state. For example, if you drop a Photoshop PSD file onto a Web page in GoLive, all of the layer information, adjustment settings, and metadata remain intact.

What's amazing is that Smart Objects are actually really smart. For example, if you take an image from a shared folder on your network, and then someone on the design team makes a change to that image. Normally, you would have to open the changed image in Photoshop, compress it, save a copy, then replace the original on your Web page with a new version. If you're using Smart Objects, the designer's changes are reflected immediately in every place where that image is used. The image on your page changes and recompresses. Now let's have a look at how Smart Objects work within GoLive CS.

First, I opened Photoshop and prepared my image. I didn't "Save for Web" or anything, I just picked the image, resized it to 400 pixels wide, tweaked the Levels a little bit, and saved it as a PSD. Next, I closed Photoshop and went back to my GoLive layout window to drop in a Smart Object. I chose the set of Smart tools inside of the GoLive Object palette and dragged the Smart Photoshop icon onto my layout window. A little placeholder appeared, so I positioned the Smart Photoshop object placeholder just below the layer full of text.

Clicking on the placeholder brought up all of the object's information inside the Inspector. At this point, there was no information for the object (just a placeholder), so I used the Inspector to navigate to the PSD file that I just created.

The first thing that happened was the ImageReady "Save for Web" window opened up so I could get my image Web-ready. I chose the compression settings for my image and saved a copy of it. Just like that, my picture appeared on my page where the placeholder once was.

The picture looked too bright. The black background color of my page brought out more of the highlights than I was expecting. I double-clicked on the image, Photoshop opened back up, and I was able to make changes to the image using the Levels tool. When I was done, I saved the original PSD and switched back over to GoLive. Within a few seconds, my snapshot reloaded and I could see my changes.

From here, I could continue making changes to the image -- crop it, resize it, change layer information -- all from within GoLive CS.

As far as positioning the picture on the page, all I had to do was drop it inside a layer and position the layer. I tried using GoLive's layout grid, but the results were not what I was looking for. Maybe you GoLive experts have found a way to wrap your heads around the layout grid by now, but I haven't had any sort of success with it in the past, and the layout grid in GoLive CS is no different. It's much easier to just layout your page by placing objects inside positioned <div>s. You have better control -- you can change the pixel position either in the source code or within the Inspector -- and your code isn't filled out with any of that "gridx", "gridy", or "spacer" nonsense that the layout grid generates.

GoLive CS is a very deep application with a wide range of capabilities. Much like Dreamweaver MX, its closest competitor, GoLive CS is made for everyday use of developers of all skill levels. If you just want to create a few pages and drop in a few images, fine. If you want to create a 2,000 page frontend MySQL-driven site, it can do that too.

Let's wrap up with a quick look at Version Cue, Adobe's content management system that allows teams of developers, designers, managers, and clients work together and share resources more efficiently.

What's My Cue?
Both the Premium and Standard versions of Adobe CS introduce a new application to the company's product line, a "workspace management tool" called Version Cue. Essentially, it's a content versioning application that team members can use to check files in and out, track changes, set permissions, and keep all assets associated with a project organized in one central place.

With Version Cue running, users see an enhanced "Open File" dialog within all Adobe CS applications. This allows access to shared files on the network. When a file is checked out, a working copy is saved to the user's hard drive, and when another user tries to access it, the file is listed within Version Cue as "in use". Once changes are made and the file is saved, Version Cue stores both copies of the file (with different version information) on the network server. This makes it easy to check out a file and make changes to it, yet still be able to roll back to a previous version if the need arises. Users can also track activity associated with a specific file, a specific user, or a specific time period. Two versions of the same file can also be compared from within GoLive CS.

Adobe accomplishes all of this with a new technology they have named the Extensible Metadata Platform, or XMP. XMP is a semantic markup language that allows users to store metadata about a file within the file itself. Remember all of that information (edit history, author information, searchable keywords) that you can access when you're looking at image files in Photoshop's File Browser? Well, all that metadata is attached using XMP. No matter where the file is viewed, the metadata is always there.

Suite Justice
So, the question remains: Is Adobe CS worth the cost and learning-curve of an upgrade? I'd have to say yes -- especially if you are working in a multi-user environment with team members handling separate pieces of the Web workflow.

Even if you're one of those intrepid developers who does everything themselves, the benefits of the tight integration between the Adobe flagship applications are numerous. It's important to note that if you are going to take full advantage of Adobe's integration efforts, you need to be comfortable using GoLive. Thankfully, GoLive is getting easier to use and generating less messy code with each revision.

The suite idea is nothing new (Microsoft Office and Studio MX have been suite players for awhile now), but Adobe's CS is an attempt to rethink not only the company's entire front line of products, but also the way people use the combination of applications. Adobe's suite is the only such bundle to offer the full range of development tools that everyone -- whether they work alone or with a team -- uses regularly.

Web Designs Now
Back to the Top


 © Copyright 2007, All rights reserved  |  Privacy Web Design Forums  |  Web Design News  |  Advertise  |  About Us  |  Contact Us  |  W3C HTML 
 Related Websites: New-York-WebDesign.com