Putting Graphics on Your Home Page


The following are suggestions for placing graphics on your Home Page:

Preliminary Graphics Work

Graphics displays may come from a variety of sources. They can be pictures, homework papers, or sketches.

Digitizing Images

If the item is not digitized, the first task is to digitize it by using a scanner.

Note that today there are digitizing cameras, such as QuickTake or ZapShot that will automatically take pictures that are digitized. Graphics created by computer generated paint programs, saved screens, or captured screens are already digitized. Save the digitized image or graphic on your disk.

Note if you want to use a graphic that you find on the web, hold down your mouse and move the option to (for Windows machines, try using the right button)

Save this Image as...

and save it to your disk. If it is already a GIF file you do not have to use the GIF converter so you can skip the next section and then continue to the section after that.

GIF Conversion

After the graphic is digitized then it needs to be converted to either a GIF or JPG graphic. A program called GIF Converter allows for such conversion. Open the file for your digitized image from within the GIF Converter. After the image is loaded, save it to your disk as a GIF file on your disk.

PhotoShop can also serve as a graphics converter. First go to File and Open your file. Then go to Save As or Save Copy As and change the Format of the file to either gif or jpg (jpeg) and make sure the appropriate suffix is completed. Then save.

Getting Graphics Code Into Your Workspace

Once you have your graphic the way you want it translated into a GIF file, you need to copy it into your workspace using the Fetch (Mac) or FTP (Windows) tool. To start set up your connection with the following, where the host is where your workspace is, such as:

garnet.acns.fsu.edu

or

mailer.fsu.edu

User ID is your signon name. Password is your password. Directory is where you want to put the file, for example, public_html. Use the Put File command and set the data as Raw Data.

or

Referencing Graphics within Your Home Page

Decide where you want the graphic on your page then between < ... > place a statement like:

img src="graphicname.GIF"

If you are using garnet, you may need to add a permission code, such as:

chmod ugo+r *.*

Also keep in mind that this system is case sensitive, so use upper or lower case respectively.

Placing and Sizing Graphics on Your Page

To place a graphic at a particular place on your page use an align command following img. To resize the graphic use width and height to tell what size you want. For example, between the < > use expressions such as the following:

img align=center width=500 height=300 border=0 src="fetch.GIF"

Click here to return to J. Flake's Home Page.

Click here to return to CGS 5112's Home Page.

Click here to return to the HTML Help Page.