Graphics
Putting Images On A Page
On almost EVERY web page on the net, there is some kind of graphic. I would HIGHLY RECOMMEND that you have AT LEAST one picture on your page. There are mainly two kinds of ways to have graphics on your web page. The first, is to use a graphic that is on another web page somewhere on the web. The second, is to upload the graphic to your own account. Personally, I prefer to use the upload method. If you are using the other way, there is always a chance that the person who made that page will decide to delete that graphic. Then a symbol with a circle, square, and triangle will appear where the graphic was supposed to be, sometimes it will look like it has been torn through the middle:
1)
To display a graphic on some one else's page, you need to find the URL. To do this, I recommend that you have Netscape Navigator. Right click or click and hold down on the graphic, until a menu comes up. Choose "View this Image". Then , copy the URL that appears at the top of the screen, in the "location" box. Let's say that the URL was: http://www.infhost.com/members/web/Images/pic.gif You would type:
<IMG SRC="http://www.infhost.com/members/web/Images/pic.gif">
The result is:
2)
To display a graphic that is in your account, all you have to do is type in the filename. If you didn't make separate directories for graphics and pages, then you just need to type the graphic's name.(i.e. <IMG SRC="pic.gif">
Alternate Text for Images
Some World Wide Web browsers cannot display images. Some users turn off image loading even if their software can display images (especially if they are using a modem or have a slow connection). HTML provides a command to tell readers what they are missing on your pages. The "ALT" attribute lets you specify text to be displayed instead of an image. For example:
<IMG SRC="pic.gif" ALT="How to make a web page">
In this example, "pic.gif" is the picture of a sign. With graphics-capable viewers that have image-loading turned on, you see the graphic. With a non-graphic browser or if image-loading is turned off, the words "How to make a web page" is shown in your window. You should try to include alternate text for each image you use in your document, as it is a courtesy for your readers.
Animated Graphics
Some people like to put animation on their web pages. It actually is not that hard. Here is some background history. Most GIFs over the years have only one image per file. According to "technical specifications from 1987", a GIF could have had more than one image per file, making it like a slide show presentation and not a single image. However, most programs that work with GIF are designed around the idea of one image per file. So the multi-image aspect of GIFs was forgotten. In 1989, they added timing and various other abilities to the GIF format, including transparency. Nobody used these new additions either. Then the Web took off. Transparency and interlacing became features people wanted to use and software companies began supporting those features. In order to have animation on your web page, you need to download a program that was made to fit more that one GIF in a file. I recommend GifBuilder for the Mac. Windows users can go here to download another program. Here is one example of a small animation:
Background, text, and link Color
On most pages, you want to have a specific color for the background, text, unvisited links, visited links, and active links. In order to do this, you need to find the code number for the specific color that you are looking for. Here is a HUGE list of code numbers, and here is how you would display this in your page. NOTE: Type these ONLY right below your title. NOTE: You must have the "#" sign before the actual code.
- <body bgcolor="#code">for background color
- <body text="#code">for color of text (all non-links)
- <body link="#code">for color of unvisited links
- <body vlink="#code">for color of visited links
- <body alink="#code">for color of active links (while being selected)
You can also string two or more of these commands together:
<body bgcolor="#000015" text="#000020" link="#000050" vlink="#7a7777" alink="#8f8e8d">
Background Graphics
Instead of having a solid color as a background, you might want to have one graphic that repeats over and over to create a background. Here are several places that you can go to find background graphics. The text that you would type in for a background called "bk.gif" would be:
<body background="bk.gif">
Linking with graphics
Sometimes on your web page, you might want to have a graphic that is a link. This is quite simple, since you just mix the two commands of linking, and displaying graphics. Here is an example of a graphic that leads to Yahoo:
You can also have a text link next to the graphic that leads to the same place.
Here is what you would type in for, first the plain graphic-link, and second, the graphic-link with text:
<A href="http://www.yahoo.com"><IMG SRC="http://www.infhost.com/members/web/Images/yahoo.gif"></A>
<A href="http://www.yahoo.com"><IMG SRC="http://www.infhost.com/members/web/Images/yahoo.gif">Yahoo!</A>
Image Maps
Before you create an image map, you need to make sure that your server supports them. Then, you can follow these steps. First, you need to create an image. Draw a picture with sections that could lead to certain places. Second, you need to create an image map file. There are several programs that can do this for you. I recommend WebMap, for the Mac. You can go to Yahoo's Image Map Directory for others.
.gif)
0 comments:
Post a Comment