HTML
Images are placed in Web documents using the IMG HTML tag.
This html tag is empty, and therefore has no closing tag.
The basic form of the html image tag is
<IMG>, but just like <A>, <IMG> by itself is pointless-- it will do nothing. At
the very least, you need to let the browser know
where to find the image that it's supposed to place in the
web document.
This HTML Tutorial section brings up an important point.
Visually speaking, images are part
of a web document, but in reality an
HTML file and any graphics it refers
to are actually all separate files. In
other words, one HTML file which has
five graphics within it makes a total
of six files required to make the page
look right. These files are all stored on
a Web server, but don't have to all be in
the same exact place. (Often, server
administrators will set up separate
directories for pictures.)
In order to make the HTML IMG tag work,
you need to use an SRC attribute.
SRC stands for "source" as in,
"the source of this graphic."
(One way to read a typical html
image tag is "image source equals."
You'll see what it mean in a minute.)
The value of SRC for a graphic of web page is the URL of the graphic
you want to have displayed on your Web page.
Thus, a typical html image tag will take the form:
The URL of the graphic is just like the URLs used in the
anchor tag, except in this case the location used is that of the graphic file. A graphic named "ggl.gif" located in the directory "images" on the server "www.globalguideline.com" would have the
URL https://www.globalguideline.com/images/ggl.gif.
You can use either relative or full URLs to refer to the graphic file. Ok, but
how does the browser know where to put a graphic once it's been loaded? In
relation to the text, the browser puts a graphic wherever an html image tag occurs in
the document. It will do this as though the graphic were just another piece of
the text (which, in a certain way, it is). For example, if we put an image tag
between two sentences, the browser would show the first sentence, then the
graphic, and then the second sentence right after the graphic.
Here in HTML Tutorial the value of ALT is author-defined text, enclosed in double-quotes, and ALT text can be any amount of plain text, long or short. To pick one of an infinite number of examples, a warning symbol could be marked up as follows:
<IMG SRC="ggl.gif" ALT="Global Guide Line logo">
This ALT text will have no effect whatsoever in a graphical browser with image loading turned on. So what's the point? ALT improves the display and usefulness of your document for people who are stuck with text-only browsers such as Lynx, or who have turned image loading off. Since these users cannot see graphics, the browser will substitute a marker such as "[IMAGE]" for any
html image tag.
Home 