# Chapter 20

# Shockwave for Freehand

CONTENTS

- Important Considerations
- Using the URLs Xtra
- Using the Afterburner Xtra
- Embedding the Shocked Freehand File
- Limitations
- Setting the MIME Type for Freehand Files
  - How to Configure UNIX Servers
  - Configuring Mac HTTP Servers
  - Configuring WebSTAR Servers
- From Here…

Shockwave for Freehand enables high-quality vector-based graphics to be placed in Web pages. Unlike raster images, vector graphics are very small and load much more quickly. The Shockwave package consists of two components that are in the form of "Xtras." They are the URL Manager Xtra, which allows the addition of URL hotspots to your Freehand graphics and the Afterburner Xtra, which compresses your Shockwave Freehand files.

A unique ability that is a major feature in Shockwave for Freehand is that the user may zoom in and pan the screen around to get a closer look at a Freehand graphic, without suffering from a loss in image quality due to the inherent nature of vector files.

An application for this technology that comes instantly to mind would be detailed maps and technical illustrations. But before you rush out to publish your Freehand art as Shockwave files, a few things need to be done to ensure that it appears as intended.

This chapter leads you through the following:

- Important considerations
- Using the Urls Xtra
- Using the Afterburner Xtra
- Embedding the Shocked Freehand File
- Limitations
- Setting the MIME type on your Web Server

## Important Considerations

First, be sure to change the unit of measure in your Freehand document from whatever unit you are currently using to "points." This is important because any image or embedded object, such as Shockwave, that is placed or embedded into an HTML document, usually has the dimensions of that object coded into the HTML. As in the case of the `<EMBED></EMBED>` markup, the dimension attributes are mandatory, and given in pixels. By setting the unit of measure within your Freehand document to "points," you are approximating pixels per inch or screen resolution (72 points/pixels per inch).

To change the unit of measure in Freehand, you must go to "Window," then select "Inspector" (see figure 20.1).

Figure 20.1 : Use Freehand's "Page Inspector" to change the unit of measurement.

Select the unit of measure field and highlight "points" if it's not already selected (see figure 20.2).

Figure 20.2 : Select the unit of measure field and highlight "points".

Secondly, creating a graphic that only occupies a couple of square inches in Freehand ends up occupying an 8"¥11" area (which is quite large in points/pixels) unless the page size is adjusted to fit around the graphic itself.

To change the size of the page, bring up the "Inspector" again. If you have a number of items on the page, select and group them all together. Next, move the group to the lower left-hand corner of the page. With the group still selected, click the "Object Inspector" button from the "Inspector" dialogue as shown in figure 20.3.

Figure 20.3 : Select the Object Inspector from the Page Inspector Dialog. Note that our example text is still selected and in the lower left-hand portion of the page.

Toward the bottom of the Inspector dialogue, notice the Width and Height fields that are the last two fields under "Dimensions." Write down these dimensions because they represent not only the size of your Freehand illustration, but the new page size that you want your document to be. For simplicity's sake, round these numbers up. Dimensions that include decimal places may be valid in Freehand but will not be valid when it comes time to embed the Shocked Freehand document into a Web page.

Next, select the "Page Inspector" in the "Inspector" dialogue. Toward the bottom of the dialogue, there is a drop-down list. Select this list and scroll down to "Custom." Observe that the "X" and "Y" fields underneath the drop-down list are no longer dimmed. These two fields are where you insert the dimensions that were written down earlier. After you type a number into a field, hit "Enter" to make the change take effect (figure 20.4).

Figure 20.4 : Select "custom" for the page size and enter the appropriate dimensions into the X and Y fields.

Additionally, keep the use of custom fonts to a minimum. Chances are that the end user doesn't have the same fonts on their system as you do. Try to use a system's default fonts or, if you must use other fonts, try converting them to paths to preserve the original design. Two fonts that are the same on Macs and PCs, though, are Courier and Times. Also, unused colors, layers, and imported images that were traced should all be removed from the document. Finally, objects can be simplified by having excessive points removed through the "Simplify" command.

## Using the URLs Xtra

All the commands related to adding links are available from the URLs (Uniform Resource Locator) Xtra dialogue that is accessible from the "Windows," "Other" menu once Shockwave for Freehand is installed. To install the plug-in for Netscape and the Xtra for Freehand, go to the Shockwave folder on the CD-ROM and double-click the executable. If you have already installed Shockwave for Director or Authorware, the Freehand files are already installed.

To add a new URL, select "Window," "Other" and then "URLs" as illustrated in figure 20.5.

Figure 20.5 : How to get to the URL manager in Freehand.

Click "Options" from the URL dialogue and then select "New." Type in the absolute or relative URL into the "New URL" field and then press enter (see figure 20.6).

Figure 20.6 : Enter the destination of the link that you wish to add.

Next, to apply that URL to a specific element, click and drag the desired URL onto the object that is to serve as the "hot area" for that URL. An alternative method of assigning URLs is to select one or a group of objects, then select the URL that you want to be associated with those objects. Remove URLs by selecting the objects, then selecting "None" from the URLs dialogue. The same can be accomplished by dragging and dropping the "None" option onto the desired objects.

When creating URLs, remember that a URL cannot be assigned to a group of objects that have been "grouped" together, as selecting any one of the objects within that group selects the entire group. Also, when using relative URLs, be sure to use a URL that is relative to the location of the Shocked file on the server and not the HTML document that it is embedded into. If you are unsure, using an absolute URL will work every time.

An absolute URL consists of the protocol, (HTTP); the address of the Web site, which usually consists of "www.mywebsite.com," and the directory or file that is to serve as the destination for the link. Basically, it would look something like this: http://www.mywebsite.com/myfile.html.

## Using the Afterburner Xtra

Now that you are satisfied with the links in your Freehand document, it's time to prep it for use over the Internet. Open up the file that you want to Shock in Freehand, then under "Xtras," "Afterburner," (see figure 20.7) select the "Compress Document" option. Enter the file name that you want to use when prompted. You may also choose to enable the "Lock" option if you want to thwart any future attempts to open the file (see figure 20.8).

Figure 20.7 : Select "Compress Document" to prepare your Freehand document for the Web.

Figure 20.8 : The "Save As" window when "Compress Document" is selected. You may choose to lock your file here.

Non-locked compressed Shockwave Freehand files can be opened in Freehand with the Installed Xtras by choosing the "Decompress Document" option under the "Xtras," "Afterburner" menu.

Compressed Freehand files have the extension "*.FHC."

## Embedding the Shocked Freehand File

As with embedding Shocked Director files, additional parameters exist that allow for further control of the embedded object. These additional parameters are not available in the previously mentioned HTML editors (HotMetaL Pro 3 and Backstage Designer). However, as in embedding Director movies, these additional parameters are not necessary to succesfully embed compressed Freehand files. Basically, follow the same procedure for embedding Director movies, and, if you would like to add these extra features, you may do so by opening the HTML document in a text editor and adding them by hand. The following explains the available parameters and the associated HTML in detail.

The HTML for embedding a Shocked Freehand file would be:

>     <A><EMBED SRC="your_file.fhc" WIDTH="120" HEIGHT="80"></EMBED>
>     </A>

The keyboard commands for controlling the pick tool (used for selecting links), the zoom tool (for magnifying areas of interest) and panning (to view those areas of the image that are "off the screen") are available via keyboard key combinations. Because most users are unfamiliar with these commands, a tool bar can be added to the top or bottom of the Freehand document. This toolbar can be added via some extra HTML in the `<EMBED>` markup. If you want to include a tool bar, you may wish to increase the height of the Shocked Freehand file by 20 pixels (points) because the tool bar spans the width of the Shocked piece and occupies 20 pixels of vertical space. Neglecting to do so will result in part of your image being obscured by the tool bar. Also, for the entire tool bar to be displayed, the Freehand file must be at least 85 pixels (points) wide. The HTML for adding a tool bar to the top of the above example would be:

>     <A><EMBED SRC="your_file.fhc" WIDTH="120" HEIGHT="80" TOOLBAR
>     ="TOP"></EMBED></A>

To place the toolbar on the bottom simply replace the "TOP" parameter with "BOTTOM."

The keyboard commands that are available are:

1. Zooming In
   Mac: Command+Click
   PC: Right Click
2. Zooming Out
   Mac: Command+Option+Click
   PC: Alt+Right Click
3. To return to 1:1
   Mac: Command+Shift+Click
   PC: Shift+CTRL or Shift+Right Click
4. Panning
   Mac: Hold down the Control Key and click and drag
   PC: Hold down the Space Bar while clicking and dragging

Here are a few things to remember when using the tool bar:

- To return to normal "Cursor" mode, you must click the arrow tool after choosing the other tools.
- Links are only available in "Cursor" mode.
- An image can be returned to a zoom state of 1:1 by clicking the Shockwave logo.

Finally, remember to send (FTP) your files to the server in BINARY. Sending them as anything else, such as ASCII, renders them useless. This is because BINARY sends the files on a byte-by-byte basis exactly as the file is, whereas ASCII tries to send the file as if it were a text file, which it is not, and that destroys the contents of the file.

A really good FTP package for PCs can be downloaded via your Web browser from various sources, such as:

> http://www.jtec.com/
> http://www.windows95.com/apps/ftp.html#wsftp

You can download a shareware FTP package for the Mac called Fetch 3.0.1 from the following addresses:

> http://wwwhost.ots.utexas.edu/mac/index-by-date.html
> http://wwwhost.ots.utexas.edu/mac/internet-ftp.html#fetch-301

## Limitations

Shockwave for Freehand does not support the following:

> EPS images.
> Display of such postcript lines and fills such as "textured" and "custom" are not supported.
> Externally linked TIFFs don't display.
> Text effects, tabs, and kerning don't save.
> The last page that was active in a multi-page Freehand document that's compressed will be the page that is displayed in Netscape. The other pages will be available by panning to either side.
> Only Shocked Freehand files that are embedded into an HTML document print from Netscape on the Macintosh. Opening a compressed file into Netscape via Netscape's "Open File" command outside of an HTML document and then attempting to print results in a system crash.
> The opposite is true on the Windows side, with the exception of the system crash; a blank area appears where the Freehand document should be when printing.

## Setting the MIME Type for Freehand Files

Just as in Director movies, serving up Freehand files from your Web server requires that the MIME (Multi-purpose Internet Mail Extensions) types for Freehand files be properly set up. If you are unfamiliar with how to do this or do not have access to the Web server that you use, have the Server Administrator do the following for you.

### How to Configure UNIX Servers

In the file that registers file types, enter the following information or give this information to the Administrator who will be doing this for you.

> MIME Type: image
> Sub Type: x-Freehand
> Extensions: fh4, fh5, fhc

Notice that two of the extensions are the extensions for native Freehand 4 and 5 documents. It is possible to embed uncompressed Freehand files into your Web pages once the Shockwave plug-in for Freehand is installed and the proper MIME types have been set. However, because smaller often times means better on the Internet, serving up uncompressed Freehand files is often undesirable because the file takes longer to download than compressed Freehand (*.fhc) files.

Also, using native freehand files (*.fh4 and *.fh5) means that the end user could open your file and do whatever they wanted with it. Compressing the image and enabling the "lock" option when compressing your Freehand file will prevent this.

### Configuring Mac HTTP Servers

The following information needs to be added to the MacHTTP.config file by someone knowledgeable about the server, preferably the server's Administrator.

> BINARY .FH4 TEXT * image/X-Freehand
> BINARY .FH5 TEXT * image/X-Freehand
> BINARY .FHC TEXT * image/X-Freehand

### Configuring WebSTAR Servers

If you are using WebStar server software, do the following:

1. Run the application called WebSTAR Admin
2. Locate and select your server in the "Pick a Server" window
3. Choose "Suffix Mapping" from the "Configure" Menu
4. Choose the following settings from the "Suffix Mapping" dialogue box:
   Action: Binary
   File Suffix: .FH5
   File Type: TEXT
   Creator: *
   MIME TYPE: image/x-Freehand

Repeat the above process to register the .FH4 and .FHC suffix types. Again, if you are unfamiliar with your server or do not have access to it, have the server Administrator register the MIME types for you.

## From Here…

Also included in this book are three Appendixes to help you apply the information, concepts, and ideas presented in previous chapters. The following references are:

- Appendix A, "Example Gallery": Walks you through a variety of examples using Shockwave.
- Appendix B, "Shockwave Toolkit Reference": Lists the various software packages used for creating Web pages, as well as where to find them.
- Appendix C, "Glossary": A technical listing of terms used in this book.