This tutorial shows you
some tips on how to create drawings for, and publish drawings
to, the Internet. You have access to many features for creating
drawings with powerful, visual impact for the World Wide Web.
Select a topic:
Common World Wide Web terms explained
Creating your drawing for the Internet
Publishing your drawing to the Internet
The World Wide Web is a hypertext information
system that allows users to navigate through information on the
Internetusing a browser as a graphical interface.
Select an option:
What is a Uniform Resource Locator (URL)?
To publish documents on the World Wide Web, you need a server
that stores the HTML documents and relays
information to Web browsers that make requests for your documents.
A browser is software that displays HTML documents and graphics.
The browser reads the HTML documents and displays the information
between the tags according to the specifications
set by the tags.
When someone points their browser to your Web document, the browser
talks to your server to get that document and then display it.
If you're familiar with using styles or tags in word processors,
you'll have no problem with the concept of assigning tags to text.
An HTML document is a text file that contains special tags that
explain how the text in the document is to be displayed, where
graphics are placed, and where links to other documents (such
as graphics files) occur.
To learn more about HTML tagging, select an option:
<TITLE>My Web Page </TITLE>
The tag is made up of an open angle bracket (<), characters
that describes the tag's action (in this example the action is
to make the text a title), and a closing angle bracket (>).
Most tags occur in pairs. HTML tags don't contain specific style
information such as the font, size, and spacing. The way text
is displayed depends on the browser and computer setup of the
person viewing your document.
<IMG SRC= "GIFGRAPIC.GIF">
<IMG SRC= "JPEGRAPHIC.JPG">
It's a good idea to keep your HTML document in the same folder
as your .GIF or .JPG files. This way, you won't need to reference
the entire path name of your graphic.
The following is an example of a portion of an HTML document with
an image map created in CorelDRAW:
<IMG SRC = "GRAPHICNAME.GIF" USEMAP = "#GRAPHICNAME.GIF"
BORDER = 0>
<AREA SHAPE=POLYGON COORDS="100, 0, ..." HREF=http://www.corel.com/corelweb/index.htm
></MAP>
<MAP NAME = "GRAPHIC NAME.GIF">
IMG SRC = " MYWEBDOC.GIF"
indicates that a graphic is to appear here and identifies the
name of the file.
USEMAP = "#MYWEBDOC.GIF"
indicates that the graphic is an image map.
<MAP NAME = " MYWEBDOC.GIF">
indicates the name of the image map.
<AREA SHAPE=POLYGON COORDS="100, 0, 150, 100, . . ."
HREF=http://www.corel.com/corelweb/index.htm ></MAP>
identifies the shape of the graphic and matches the URL to the
pixel coordinates of the graphic.
The final </MAP> tag indicates the end of the image map
information.
http://www.corel.com/news/
Each hyperlink in an HTML
document has an associated URL. When a user clicks a hyperlink,
the user is brought to the document to which the URL associated
with that link points.
Select an option:
Converting paragraph text to HTML text
Click here to open a sample file.
This procedure shows you how to assign a URL using the Internet
Objects toolbar.
Click here to open a sample file.
Graphics are saved separately from the Web pages on which they
appear. When you view a Web page, the browser
retrieves and displays each graphic on the page.
You can save your drawings as graphics or as Web pages on which
graphics appear.
Also, browsers only support certain colors, so it's important
to use these colors when creating your drawings.
This procedure shows you how to choose the correct color palette
to create your drawings and how to save your drawings as Web-ready
graphics.
Select an option:
Creating your drawing using the right color palette
Saving your drawings as Web-ready graphics
This procedure shows you how to decide which format best suits
your changing needs.
Select an option:
GIF supports up to 8-bit color (256 colors) and allows you to
store custom palettes with your image.
The GIF format also offers several advanced Web-publishing options,
including transparent backgrounds and interlacing.
All bitmaps are rectangular, but you can specify transparent areas
in the graphic to create the illusion that it is a different shape
when it appears in your HTML document. The transparent areas appear
in the color and pattern of the Web browser's background color.
An interlaced image displays a little at a time as it downloads,
allowing users to cancel the download if they wish.
Procedure for saving as a transparent or interlaced GIF
Click here to open a sample file.
Procedure for saving your drawing as a .JPG file
Click here to open a sample file.
When you publish your document to HTML, CorelDRAW creates an HTML
file identical to the source CorelDRAW document.
Documents saved in the Java-based, Corel Barista format are saved
as Java applets.
When you publish your document as a single image, CorelDRAW creates
an image map from your drawing.
Select an option:
Each graphic on a Web page is actually an individual graphic file
that exists separately from the HTML document. When you export
your drawing as HTML two types of files are created: an .HTM file
containing all the HTML code and .GIF files for all your graphics.
Each graphic is brought onto the page by the <IMG> tag in
the .htm file when the document is displayed on screen.
To create images that display well in Web pages, you must save
the image in a file format that is readable by Web browsers.
GIF and JPEG are the most common
file formats.
When you publish to HTML, you have the choice to save the graphic
in the GIF or JPEG format. CorelDRAW creates an HTML document
that contains the reference to the GIF or JPEG bitmap and any
URL (Uniform Resource Locator) information that you've assigned
to graphics.
Click here to open a sample file.
You can view documents published in Corel Barista format in your
Web browser. To display your Web document,
place the Corel Barista .CLASS files in the same folder as your
Web document. The Corel Barista .CLASS files are installed in
the DRAW8 subdirectory called BARISTA when you install CorelDRAW.
When you export to Corel Barista, text in your document is converted
to curves to maintain the properties you assigned to it.
Click here to open a sample file.
index.htm
Click Edit menu, Insert
Internet Object, and click the object you want.
Tip
You can also right-click
the Paragraph text, and click Make Text HTML Compatible.
Note
When someone opens your
drawing in a web browser and clicks
on the object, the document associated with the URL assigned to
the object is displayed.
Click View menu, Color
Palette and click either Netscape Navigator or Microsoft Internet
Explorer.
Notes
The HTML Folder list box
keeps a history of the last folder used (default), the folder
containing your source .CDR file, and the default CorelDRAW .CDR
folder. However, you can click the Browse button to choose a different
folder.
The Image folder is a subfolder
of the HTML folder. If you leave the Image Folder box blank, the
bitmaps are saved in the HTML folder.
Tip
To choose whether your
graphics are exported as .GIF or .JPG files, use the Publish to
Internet wizard to export your drawing (to access the wizard options,
press the Next button instead of the Use Internet Dialog button.)
Note
The HTML Folder list box
keeps a history of the last folder used (default), the folder
containing your source .CDR file, and the default CorelDRAW .CDR
folder. However, you can click the Browse button to choose a different
folder.
Tip
To choose whether your
graphics are exported as .GIF or .JPG files, use the Publish to
Internet wizard to export your drawing (to access the wizard options,
press the Next button instead of the Use Internet Dialog button.)