Yesterday we created a picture in ClarisWorks and put a copy of it on our web page. This page reviews the steps that we took, and includes a copy of Sarah Seastone's message about other options you might want to consider in the future, and a note from Suzanne Alejandre.
|1. In ClarisWorks select your picture and copy it to the clipboard.||You now have a copy of the picture in PICT format, which is a Macintosh graphics format. Next we need to change it to a format that any type of computer can read so that we can put it on our Web page.|
|2. Open the program clip2gif - it should be in your Math Forum folder.||This is a free program that we downloaded Wednesday morning from the Forum's server. It converts PICT files into GIF files without your having to do very much work.|
|3. Select "Open Clipboard" from the File menu.||This lets you take a look at your picture and see if you've really copied what you think you copied!|
|4. Select "Save Clipboard As..." from the File menu and save your new file in your Math Forum folder - give it a name that ends with .gif, so something like "annie.tess.gif" would be a good one.||
You have just saved a copy of your picture as a GIF. Any kind of computer can read it, and many pictures you see on Web pages are in GIF format. You must give your graphic a name that ends with .gif so that you and the computer will know what kind of file it is and what to do with it.
Of the two commonly used formats for images, a GIF (Graphic Interchange Format) is best for diagrams and drawings; JPEG (Joint Photographic Experts Group, the original name of the committee that wrote the standard) is best for photographs.
|5. In your Math Forum folder, double-click on the source file for your home page (i.e. annie.fetter.html).||We have our picture; now we need to tell our home page to display it. We'll do this on our "local" copy and check it before we put the picture, with our updated home page, on the server.|
6. Somewhere on your home page put a line that reads
||You're telling the web browser, "show a picture, and the source of that picture is filename.gif".|
|7. Save your file; then go into Netscape and using "Open File" from the File menu, open your home page.||Make sure you are opening the local copy of your home page, not the one on the forum server, since you haven't changed that one yet.|
|8. If you see what you want, you'll want to put a copy of both the new home page and the picture on the server. Open Fetch, hit cancel when that window pops up and choose "Open Bookmark" from the File menu.||I'm guessing that we have saved a bookmark on everyone's computer to the right place on our server - so that you don't have to type all that information again.|
|9. Put in your password, and then hit the "Put File..." button. Find your home page and open it. Make sure the bottom box says "Text"; say okay, and watch the dog run.||You're putting a new copy of your home page on the server, and since it's just a text file, you'll upload it as text. (The computer can use different "languages" to put files on the server, and you want to make sure it's speaking the right one for the right kind of files.)|
|10. Hit the "Put File..." button again, find your picture, and open it. Make sure it is going to upload as "raw data" - choose that from the popup menu in the bottom box.||A picture is a different kind of file from a text file.|
|11. Go into Netscape and go to your home page on the server (you probably have a bookmark to it). If your picture does not show up, hit the Reload button.||You've put a new copy of your page together with a copy of the picture on the server, and you need to take a look at it.|
Sarah Seastone sent the following message about doing graphics using clip2gif and some of the "advanced" features you might want to use in that program:
Hi folks - I just sent this message to one of our new 'math doctors' who wants to learn to make a gif, and thought it might be useful for you, too. If you have questions, please write and ask me about them! First, download a program called clip2gif from the following Forum Web page (it's toward the bottom of the page under "Other Useful Applications"): http://mathforum.org/workshops/workshop.software.html Now make your diagram in whatever program you would like to use and copy it to the clipboard. Sketchpad is a great program to use for math diagrams. Open clip2gif, and, to check to see that you're going to make the gif you want, go to the File menu and Open Clipboard (if that choice is greyed out, you haven't copied anything yet). If what you see in the window that comes up is what you want, choose Save Clipboard As (again from the File menu), give your gif a name, and save it, always with the extension .gif . You'll have a gif - it's as simple as that! A couple of embellishments I always use as defaults: 1. Under the clip2gif Options menu, choose Interlaced. 2. Under the Options menu/Transparent Background, choose White. This makes your gif "transparent" so the white space around it won't show and it will just 'float' against whatever background your page has. Transparency is almost always the best choice. If you "Save Options" under the Options menu, these choices will become the default; otherwise you'll have to remake them the next time you open clip2gif. Sarah Seastone Editor, Archivist, Web Page Designer The Math Forum http://mathforum.org/ firstname.lastname@example.org
Suzanne Alejandre added a note:
To add a thought to what Sarah told you about making GIFs with clip2gif - you can use clip2gif to resize an image by going to the Options menu BEFORE you "open clipboard" - so, 1. Open Clip2Gif 2. Go to Options and slide down to 50% or any of the other sizes (including "other" if you want to type a specific percentage). 3. Choose Interlaced. 4. Slide down to Transparent Background and over to "white". 5. Under File - Open Clipboard 6. Under File - Save Clipboard As Voilà. This may cause some images to degrade, but it works for most and it's better than posting HUGE gifs! Suzanne Alejandre http://mathforum.org/alejandre/ email@example.com
Home || The Math Library || Quick Reference || Search || Help