Working with graphics

The Portable HTML Standard Edition template can produce three different graphics formats: GIF, JPEG, and PNG. By default, a graphic that is imported into FrameMaker by reference in one of these formats (and that resides in an anchored frame by itself-no callouts) is passed through. This means that during conversion, WebWorks Publisher Standard Edition copies the referenced graphic to the output directory. This is by far the fastest conversion method because no processing is necessary.

To be passed through by default, a graphic must meet the following requirements:

• It must be in GIF, JPEG, or PNG format.
• It must be imported by reference.
• It must be the only object in its anchored frame (no other graphics, callouts, or any other items).

If Publisher does not pass your graphic through by default, then you can explicitly map it to any one of the imported by reference styles. However, the results of the conversion will only include the first imported graphic contained in the anchored frame. No other objects are converted. However, markers are still processed (you can use them to create image maps).

If a graphic does not meet these requirements, it is processed to create the GIF, JPEG, or PNG output. During processing, the contents of the anchored frame are printed to a temporary PostScript file. The PostScript file is then converted to the final output format.

In the Portable HTML template, the GIF graphics style is used by default. This translates all the anchored frames into GIF files with a transparent background and interlacing.

Assigning alternate text to graphics

Alternate text is an image label that describes the graphic. It is displayed if:

• The reader moves the mouse over an image.
• The graphic is not displayed (perhaps because the reader is browsing without downloading graphics).
• The reader is using a nongraphic browser, including screen readers.

Providing alternate text is critical to make your HTML accessible (that is, useful even if a reader cannot see the graphics).Here's how to do it:

1. Create a custom marker in your FrameMaker documents. You must name it ImageAltText so that it automaps to the corresponding Publisher marker style.
2. Inside each anchored frame, insert a text column and create an ImageAltText marker with the text that you want to use as the alternate text.
3. Save your FrameMaker file and regenerate your project.

Creating image maps

Building image maps manually is tedious and time-consuming, but with WebWorks Publisher Standard Edition, the process is automated. You build hypertext in your FrameMaker files to create an image map in your output. The image map makes different areas of your graphic point to different links. Here's how to do it:

1. In the anchored frame, draw a text column on top of the graphic that covers an area where you want a hyperlink.
2. In the text column, insert a hyperlink that points to the location you want to link to. You can use either:

 gotolink filename:linkname

or

 message URL http://www.yourURLhere.com

3. If you're using the gotolink command, insert a hypertext marker at the target location. It should look like this:

 newlink linkname

4. Repeat steps 1 and 2 until you have defined all the areas you need.
5. Save your FrameMaker file and regenerate the project. Publisher automatically creates all the information required to generate the image map.

In addition to the image map, you can create pop-up labels for each hotspot. These are supported in HTML version 4.0 (but not earlier versions), so only the newest browsers will display these labels. Here's how to create them:

1. Create a custom marker type in your FrameMaker documents. You must name it ImageAreaAltText so that it automaps to the corresponding Publisher marker style.
2. In each text column that defines a hotspot, insert an ImageAreaAltText marker with the text that you want to use as the alternate text.
3. Save your FrameMaker file and regenerate your project.

Creating thumbnail images

If your document contains lots of large graphics, and you're concerned about download times, consider using thumbnail images. A thumbnail is a small version of the graphic; the reader clicks it to display the full-sized version. Because initially only the thumbnail is loaded, the page loads much more quickly than the equivalent page with full-sized graphics.

To set up thumbnails in your output, map the graphics to GIFWithThumbnail.

Quadralay Corporation http://www.webworks.com Voice: (512) 719-3399 Fax: (512) 719-3606 sales@webworks.com