How to Make Images You Create Show on Web Page

Creating HTML documents that include images is a normal part of web page design. To include images in web pages, you need to add it to the HTML page published on the Internet. This is accomplished using the "<img>" tag in HTML. Adding this tag can be done in software as simple as Notepad, or you can use Microsoft Frontpage, which makes it easy for inexperienced individuals to create websites.

Difficulty: Moderately Easy

Instructions

1. Open the web page to which you want to add the image. You can either create a new page or add the image to an existing web page. The easiest way to add the image quickly is opening the web page in Frontpage.

2. Click the "Code" tab to view the HTML file. Find the location of where you want to place the image. You can also add the file using the designer, but adding the code allows you to more quickly add images to web pages by typing the text directly into the code.

3. Type the following code in the HTML file:
   <img src="image_location">
   The "<img>" tag tells the browser an image is located in this area of the page. The "src" property points to the location of the image. This is the location on the web server. If your image is located at mydomain.com/image/myimage.jpg, then the image tag is written as the following:
   <img src="image/myimage.jpg">

4. Add the "alt" attribute to the image tag. The "alt" attribute is shown in case the image is accidentally deleted or for slow web connections where your readers need to wait a few seconds before the image loads. This text is shown by default whenever the image isn't shown. Below is an example of an image tag using the "alt" attributes:
   <img src="image/myimage.jpg" alt="My Image">

5. Save the HTML file and upload it to your website host server. Open a browser window and navigate to the web page in your domain. The image will now show in the web page.

References

• W3 Schools