In HTML, what is the tag for image and how do you add an image from your hard drive?

Question

I am getting a bit confused.

Answer 1

If you want to publish your site to the Web, you don't want to add images from your hard drive, because no one else would be able to see it.

You should upload all of your images to a web server and link to them as you would your hard drive. For example, if image A is in directory B, do this

Answer 2

Well the standard HTML tag is



The picture in this case has to be in the same directory as your HTML page.

If you are uploading that to a web site your page and the picture will need to be loaded to the same directory.

So far getting it to work on your hard drive.. copy the picture to work into the directory that you are saving your HTML page into. It should then work.

You can tell the page what directory the image is in....

in this case the picture would be in the images directory.
Be sure your image is .gif .png .jpg if you plan on putting it on a web page. These are the correct types of images for the web. Most pictures will be jpg for the best quaility etc.

Answer 3

If you plan on submitting this to an actual web server then you should use relational paths instead of direct paths.
You should have a very strict structure to your site design in the folder layout.
WEB (root folder)
-WebPages (contains all web pages ~html, asp, ect..)
-IMG (contains all images used in the site)
-DATA (contains databases or other sources)
-CSS (contains cascading style sheets if in use)
when you enter the image you need to use the img tag. Here is a basic example:



If you use a direct path name it will not work properly when published to the web. A direct path is:
C:\Photos\WebStuff\Phot123.jpg
A relational path tells the location of the file in relation to the file trying to access it.
../= move up one directory
/img/ = look in the folder called IMG

Try using HTML kit. It is free and a great tool for learning. Follow the link below to get it for free.

Answer 4

The correct W3C syntax for an (X)HTML image tag is



It is important to always include an alt attribute which descripbes the image just in case the image file can't be found or the user has images turned off.

Answer 5