Basic HTML Tutorial: Adding Graphics
to Your Page
Home > Build
> Programming > HTML
> Basic
HTML Tutorial
2.2 Adding Graphics to Your Page
Web Pages need graphics. There was a time, not
too long ago in fact, when there were no web browsers capable
of displaying graphics, which made the internet very dull.
Fortunately, browsers started supporting graphic formats long
ago, so there isn't much of a concern with compatibility.
There are still text browsers out there, and often users will
set their browsers to not download images, so we need to make
sure they still receive the content.
For more information on how to create graphics,
click
here.
To link to a graphic, use the <IMG> tag.
Then, use the SRC attribute to specify the path to that graphic.
Here is an example of a graphic displayed on
a web page:
<HTML>
<HEAD>
<TITLE>Placing a graphic on your page</TITLE>
<BODY>
<IMG SRC="..\..\..\graphics\w3nation.gif">
</BODY>
<HTML>
See
it in the browser
The SRC path pointed down 3 levels, to the root
directory, to the 'graphics' subdirectory, to a w3nation logo
(one that was never used.)
If the graphic file is in the same directory
as the HTML file, then no path has to be given. You can simply
use the filename as the SRC:
<IMG SRC="w3nation.gif">
You can also link to a graphic that resides
on another server on the internet. For that you must type
the Absolute URL of the graphic. For example, if you wanted
to use this logo on your page, but didn't want to have to
download it to your server, you could use our URL as the SRC
path. Be careful with this. Most webmasters frown on people
using graphics from their site, and it's also against the
law unless you have permission.