Tutorial on IMG SRC in HTML
HyperText Markup Language (HTML) is the language used to create Web pages. As you design your pages with HTML, learn how to use the image source (IMG SRC) code snippet (tag). This commonly-used tag enables you to call up a digital image and place it on your page, which is an especially crucial task considering that most Web documents utilize images for various purposes. Using the text editor application that comes with your computer, add your own photos with the HTML image source code.
Instructions
-
-
1
Place your digital image on a free Web host like FileFactory or MediaFire. Follow the provider's prompts to add (upload) your picture to the server and get the URL address of your graphic after it is added. A host allows you to link your image to a page so that it is displayed on the Internet.
-
2
Launch your text editor and open a document. Place your cursor in the area where you want the picture to show up.
-
-
3
Type the HTML image source code within angle brackets. Follow this with an equal sign and enter a pair of quotation marks after the entry. For example:
<img src="">This code creates a placeholder for your image information.
-
4
Enter the URL address from Step 1 in between the quotation marks in the tag. To illustrate:
<img src="http://www.webhost.com/image.jpg"> -
5
Type an "alt=" within the angle bracket and follow this with a description of what the image is. Place this information between quotation marks. For instance:
<img src="http://www.webhost.com/image.jpg" alt="A map of the United States.">The "alt" data is used when your visitor views your page with a screen reader, or if your picture does not load successfully.
-
6
Save your HTML document.
-
1
Tips & Warnings
If you need help obtaining the URL address of your image (Step 1), click the "Help" or "Support" link on the provider page for specific instructions.
References
Resources
- Photo Credit digital camera age image by Steve Brase from Fotolia.com