The inclusion of images in web pages adds a new dimension to the distribution of information. The inclusion of an image makes the information much more attractive, and as the saying goes, a picture is worth a thousand words.
Including an image is your page is quite easy. It requires only that you have available the image to be displayed, and that it be in one of the formats accepted by the browser. GIF and JPG are the standard graphic file formats accepted by the web.
CompuServe's GIF format, shorts for graphics interchange format, can be used on different hardware platforms, such as the PC and the Mac-intosh. Compared to the standard windows format, it generates much smaller files.
A second format considered a standard is the JPG format from the joint photographic experts group. It manages to reduce the size of an image by up to ten times. Version 2 and above of Netscape navigator and Internet explorer work with this type of file.
Obtaining the Image
The first thing you should do is have your chosen images in one of these formats. We particularly recommend starting with the GIF format. If you have a scanner to capture the images. excellent! if not, look for a desktop publishing bureau to scan your images in the GIF or JPG format or try to download an image from the internet. Be aware of copyright restrictions!
There are several programs that converts BMP or other format image to GIF. Among them are sharewere paintshop, Wingif, and most of the image editing programs such as Photoshop, picture publisher, and photopaint.
Recommendations
Before including a large number of images in your pages, remember that the transmission speed on the internet can be very slow, around 1 kb per second or, depending on the traffic, just tens of byte per second. Therefore, 100 KB image can take several minutes to be displayed, frustrating the audience. In the advanced part of this book, we will cover images in Greater detail. Meanwhile, big recommend using small images captured with the resolution of 78 pixels per inch, the resolution used in the VGA and SVGA standard of most users. The number of colours of an image influences its size. In the case of photographs, try to use 256 colour for GIF files, unless this compromises the quality.
At first, make things easier by placing the image files in the same directory as the page. Using the image linking feature, you can display an image which is in another directory or in another computer by specifying its URL.
The HTML command used to insert an image in the current position where it is specified is :
<IMG SRC="FileName.gif"> or <IMG SRC="FileName.jpg">
If a URL is not specified, the browser looks for the image in the current directory. Simple, isn't it?
Important Command Options
If you place an image close to text, you may specify the alignment of the image in relation to the text around it.
As standard, the image is aligned with its bottom in the same line as the text. Through the ALIGN attribute, you can align the text at the bottom, which is the standard, at the middle, or at the top.
<IMG ALIGN="top" SRC="image.gif">
<IMG ALIGN="middle" SRC="image.jpg">
<IMG ALIGN="bottom" SRC="image.gif">
Load the Examp07a.htm file in the browser. This file generates the two figures on the next page. Analyze the contents :
<HTML>
<HEAD>
<TITLE>inserting images examp07a</TITLE>
</HEAD>
<body>
<h1>Images</h1>
An image <img src="w95gp03.gif"> can be inserted into any place<p>
In order to show and image without text around it use the<B>P</B>command before the <b>IMG</b> command.<p>
<p> <img src="w95gp03.gif">
<hr>
<img align=top src="w95gp03.gif">image align using top<p>
<img align=middle src="w95gp03.gif">image align using middle<p>
<img align=bottom src="w95gp03.gif">image align using bottom<p>
</body>
</HTML>
And see what it does :
No comments:
Post a Comment
If you have any doubts. Please let me know.