With Web graphics, you've always got to walk a tightrope between creating high-quality images and making ones that download quickly over slow modem lines. Web designers work primarily with JPEG files (for photographs) and GIF files (for text, logos, and other graphics with large blocks of solid colour). Careful tweaking makes all the difference with images saved in either of these formats. The more control designers have when making trade-offs between beauty and speed, the better. Until this newest version, Photoshop lacked that control, so most designers instead used Photoshop plug-ins, such as the £30 ProJPEG and £45 PhotoGIF from BoxTop Software ( www.boxtopsoft.com), or programs such as ImageReady and Fireworks 2.0 from Macromedia (£139; Software Warehouse, 0800 0355 355). These tools allowed designers to manipulate the file size and quality of JPEG and GIF images, with immediate visual feedback. However, none of them are able to match Photoshop's all-powerful image-editing features. As a result, prepping graphics for the Web often involves constant switching between Photoshop and a Web-savvy application. The biggest addition to Photoshop 5.5 is the Save For Web menu item, located on the File menu. Choosing Save For Web doesn't bring up the usual Save dialogue box; instead, a large window appears that lets you modify your image in various important ways. This won't be exotic to anyone who has used Macromedia's Fireworks (see the screen shots, "Separated at birth"), which offers an almost identical interface. ImageReady 2.0 also has this feature. JPEG mojo In the Save For Web window, you can scale the level of quality (from 0 to 100) for files in the JPEG format. As you move the Quality slider toward 0, you'll see the quality of your image drop - the more compressed a JPEG becomes, the more blocky image artifacts you'll see - but in the lower left corner of the window, you'll see its file size drop as well. By clicking on the window's 2-Up or 4-Up tabs, which let you compare two or four versions of your image (with different JPEG and/or GIF options selected) in the same window, you can quickly compare different settings. GIF control Some of Photoshop's best new features involve perfecting GIF images. Unlike JPEG files, which use millions of colours, GIF images are limited to a palette of only 256. In order to make a GIF look good, then, you need to pick the right colours for the job. Photoshop 5.5 gives you an impressive amount of control over GIF images' characteristics. As in ImageReady 1.0, Photoshop's Save For Web window lets you see and control all the colours in a GIF image's palette. By cleverly controlling the palette of a GIF file, you can dramatically reduce the file size. The first thing Photoshop must do is take your source image and throw away all but 256 of its colours. To make this easier, the program lets you choose from a series of pre-set palettes, including not only a "Web-safe" palette but also an Adaptive palette, optimized for the colours that appear most often in the image, and a Perceptual palette, weighted toward the colours in the image that the eye notices most. Although choosing one of these palettes is a good shortcut to creating a fairly small, good-looking GIF file, perfectionists will want to make even more changes. After all, just because you can have as many as 256 colours doesn't mean it's a good idea. The fewer colours you have, the smaller the file size of the image and the shorter its downloading time. One option in the Save For Web window helps you slim down your colours by directly controlling the number in your GIF image. We took a sample image with 204 colours and knocked it down to 64 colours. In the process, the image's size fell from 15.3K to only 9.3K. Palette power A limited colour palette may make a faster-downloading image file, but it can also make a deathly boring one. One way to approximate a more expansive variety of colours is through dithering - simulating a colour by placing dots of two other colours close together so that from a distance, they appear to be a third colour. Photoshop 5.5 offers three different dithering effects. It also allows you to set a dithering percentage, so you can vary the amount of dithering in your image and see how it affects image quality and file size. Although it's nice to have these options, avoid using dithering if you can. It usually increases file size. For the ultimate in colour control, Photoshop lets you edit the GIF colour palette. This is a powerful and quite useful feature, allowing you to lock colours that you don't want to change under any circumstance (for example, the colours in a company's logo). You can also select individual colours and shift them to their nearest Web-safe equivalent (so they won't dither, even on a monitor that can display only 256 colours), or delete colours one by one from the palette to simplify your images and reduce their file sizes. One innovation The features in the Save For Web window are new to Photoshop, but it's only fair to point out that they're not new altogether - most of them will be familiar to users of ImageReady or Fireworks. There is one unique feature offered for the first time in Photoshop 5.5: the lossy GIF. Adobe's lossy-GIF algorithm cleverly exploits the way that GIF images are compressed, by taking large areas of a single colour and describing them in shorthand, rather than pixel by pixel. This lets it create a lower-quality image with a smaller file size. As you increase the lossy compression, you'll start to see distortions, including 1-pixel-high horizontal streaks across your image, but you may not mind when you're in a pinch. Photoshop's new pal
After years of ignoring the Web, Photoshop is finally Internet-savvy - but is it too late? Macromedia's competing product, Fireworks 2.0, is powerful and popular. Although its mix of drawing-program and Photoshop-like abilities makes it harder for many people to learn, it also gives the program unique strengths. It's also tightly integrated with Dreamweaver - an HTML editor that seems to have a lot of momentum, at least for now. On the other hand, if Photoshop and ImageReady can provide most of Fireworks' features in one package with one price tag, Adobe may have a major advantage. Regardless of who wins this battle, one fact can't be denied: Web pros who use Photoshop finally won't have to pay extra to get the basic tools they need. It's been a long time coming, but Photoshop has finally embraced the Web.