Skip to content

Part 7 - Other Graphics Formats

Vector Graphics

Vector graphics programs are primarily used to create what is often called "outline art." Examples of outline art are everywhere: think of a typical company logo, or a starburst shape in an advertisement, or a technical drawing, or the lettering on virtually any commercial product. It is called outline art because you simply draw the outline of a shape, assign it a fill and the drawing program automatically fills in the shape as a solid. Outline art is also known as a vector graphic and vector graphics programs are sometimes refereed to as "draw" programs, as opposed to bitmap-oriented programs such as Photoshop, which as categorized as "paint" programs.

With the appropriate plug-in, it is possible for Internet users to view vector format files online as opposed to the traditional GIF or JPEG files (raster format) currently associated with Internet use.

FutureSplash becomes Flash

Many people are not too fond of developing Web pages that depend on plug-ins, but FutureSplash, the forerunner to Flash, changed some minds. Now renamed and owned by Macromedia, the Flash software, for Mac and Windows 95/NT, is a Cel Animation utility that creates animated pages that load fast and look elegant. Flash retails for about US$300 (and is made freely downloadable as a time-limited trial version). It comes with a great collection of tutorials. The fact that it loads and converts a wide range of existing artwork, including Adobe Illustrator files, is a bonus. Well worth checking out if, like many, you are tired of waiting three minutes for a few seconds of (Macromedia) Shockwave animation. Flash is vector-based and animations not only stream, but they load practically instantly.


Plug-ins, as mentioned earlier, require Netscape Navigator 2.0 (or newer) or Microsoft Internet Explorer. Note that now all formats are supported on multpile platforms. The Corel CMX format, for example, is viewable via a plug-in that is only available for Windows 95 and Windows NT.

Here are a few common graphics titles in the vector graphics category, and their respective web-related filetypes, and where you can obtain more info:

  • CorelDraw - CMX (www.corel.com)
  • Illustrator - Acrobat PDF (www.adobe.com)
  • FreeHand - ShockWave for FreeHand (www.macromedia.com)
  • Micrografx Draw - (www.microgrfx.com)
  • NetWriter - (www.paragraph.com)
  • Flash (formerly FutureSplash) - www.macromedia.com (originally from www.futurewave.com)

Adobe Illustrator can save files as PDF (Portable Document Format). You may find that printing the file to disk as a PostScript file, and then opening this file in Distiller is the best solution in Illustrator 5.5, as attempting to save a PDF file directly from Illustrator 5.5 sometimes fails. Illustrator 6.0 or newer does not seem to have this problem. These files are readable by any of the Adobe Acrobat family of products, which include a free Acrobat Reader for Mac, Windows, DOS, and Unix-based computers. A free plug-in also allows the popular Netscape Navigator web browser to view PDF files over the Internet or on local drives. In other words, almost anybody can open and see your Illustrator graphic exactly as it was created -- complete with the actual fonts and resolution-independent PostScript graphics -- if you save it as a PDF and give them a free Acrobat Reader application.

Acrobat and ShockWave for FreeHand are thus well-suited for cross-platform delivery, with Acrobat being by far the best supported. You can create PostScript files with virtually any program, and turn them into Acrobat files with the Adobe Acrobat Distiller or PDFWriter software (both commercial products). Some software packages, such as PageMaker and Adobe Illustrator, ship with these tools; several different Acrobat packages for both single and networked users are also available separately.

While a complete discussion of these high-end graphics programs is obviously outside the scope of this manual, suffice it to say that Illustrator, CorelDraw, FreeHand, and MicroGrafx Draw are but a few of the draw-type programs currently capable of creating vector files displayable on the World Wide Web.

In all cases, you need a plug-in to view vector graphics from within a web browser such as Netscape Navigator or MSIE.

Here is an example of how to embed a ShockWave for FreeHand graphic in a Web page.

<html>
 
<title>Sample FreeHand graphic on a Web page</title>
 
<body bgcolor=#ffffff><center><Font FACE="Flexure" color=#000066 size=7>The Evoloids are coming!</font><embed src="Evoloids.FH5" height=230 width=230></center>
 
</body>
 
</html>

Note also that ShockWave for FreeHand provides support for inline TIFF images, and FreeHand file compression.

Incorporating Acrobat PDF files into Web sites

Acrobat Reader is available as a Netscape plug-in for Windows, Mac, Unix and OS/2, and is supported as an ActiveX Control under Windows.

The Acrobat Control for ActiveX uses the Adobe Acrobat Reader to allow users of Microsoft Internet Explorer 3.0 or newer to view and navigate Adobe Portable Document Format (PDF) files. Optimized PDF files can be downloaded one page at a time from Web servers that support byte range serving ("byteserving"). The Netscape plug-in behaves similarly.

The following HTML code sample will insert a PDF file in an HTML page:

<OBJECT CLASSID="clsid:CA8A9780-280D-11CF-A24D-444553540000"
 
WIDTH=423 HEIGHT=333
 
ID=Pdf1
 
CODEBASE="../../rdrx32b6.exe#Version=1,3,0,0">
 
<PARAM NAME="SRC"
 
VALUE="../PDFS/map.pdf">
 
</SCRIPT>

The following HTML code will add an Acrobat Print button to an HTML page:

<!-- Visual Basic Script starts here -->
 
<SCRIPT LANGUAGE="VBSCRIPT">
 
Sub BtnPrint_OnClick
 
Pdf1.Print
 
End Sub
 
</SCRIPT>
 
<!-- here is the Print button -->
 
<input type=submit size=20 maxlength=256 name="BtnPrint" value="Print">

The following HTML code will add an Acrobat About button to an HTML page:

<!-- Visual Basic Script starts here -->
 
<SCRIPT LANGUAGE="VBSCRIPT">
 
Sub BtnAbout_OnClick
 
Pdf1.AboutBox
 
End Sub
 
</SCRIPT>
 
 
<!-- here is the About button -->
 
<input type="button" value="About" Name="BtnAbout">

Additional Information

Information about Adobe Acrobat can be found on the Web at http://www.adobe.com/acrobat/

If you have PDF files which you'd like to optimize for page-at-a-time downloading over the Web and/or hide the Acrobat toolbar, scrollbar, and status bar when displayed in Internet Explorer, you'll need to use Acrobat Exchange 3.0 or newer (which is included, but named differently in Adobe's Acrobat 4.0+ products). This URL also has a link to information on byteserving PDF files.

Once your PDF files have been optimized you will need to "byte serve" them from your Web server to support fast page-at-a-time downloading. If your Web server vendor does not yet provide built-in support for byteserving, you will need to install the byteserver CGI script (available from the Adobe web site) on your server.

The top server companies are providing support for byteserving (using byte-ranging) PDF files.

Web servers which currently include built-in support for byteserving PDF files:

  • OpenMarket Secure WebServer v2.0
  • O'Reilly and Associates' WebSite

Web servers for which built-in support for byteserving has been announced but is not yet available:

  • Netscape Enterprise Server (requires Acrobat 3.0 or newer)
  • QuarterDeck Corporation's WebStar for Macintosh
  • Microsoft's Internet Information Server (version to be included with Windows NT Server 4.0 final)

You can also add byteserving to most Web servers by using a CGI script.

The script implements the HTTP "Byte Range Retrieval Extension to HTTP" protocol documented in
ftp://ftp.internic.net/internet-drafts/draft-ietf-http-range-retrieval-00.txt.

This script has been used successfully with the following servers:

  • Netscape Communications Server
  • Apache 1.0.5 and 1.1.1
  • NCSA HTTPd server 1.5.2

It should be also possible to use this script with most other Web servers which support PERL CGI scripts. The byteserver.pl script is known to be incompatible with early versions of the Microsoft Internet Information Server (IIS). However, the version of the IIS included with Windows NT Server 4.0 or newer includes built-in byteserving support.

Comments

Post new comment

Image CAPTCHA
Enter the characters shown in the image.