HTML and IMG SRC Code
- When you want to add an image to a web page, and you are editing it using HTML, you have to use the IMG SRC tag. It should look like the following: <img src="image.jpg" />
This is the simplest image insertion code. Typically, it has a few more attributes added onto it, like dimensions, any sort of link, a hover-caption or alignment. You can also substitute a URL for the image name, if the image you would like to display is not actually stored in your file manager. In that case, your image code would be <img src="http://www.site.com/image.jpg" /> - To add dimensions to an image that might be too large to place in the website, all you do is add dimensions (in pixels) to the image tag: <img src="image.jpg" height=200 width=300 />
Try to make sure the dimensions you give the image are proportional to the original. If you do not take care to keep proportion, your image will end up skewed and stretched. - To add a link to an image, you have to add an <a href> tag. A linked image would be coded like this: <a href="/links/?u=link URL"> <img src="image.jpg" height=200 width=300 /> </a>
The <a href> tag works for any hyperlink, so if you left out the IMG SRC code and typed some text where it appears in above, the text would be linked, not the image. It would look like this: <a href="/links/?u=link URL"> TEXT </a> - A common addition to the IMG SRC tage is alt, which stands for "alternative." In the code, it usually appears at the end of the list of attributes, like this: <img src="image.jpg" height=200 width=300 alt="image name" /> So if your image does not load, text will appear with the broken image icon, and the name of the image will appear. The advantage of doing this is that instead of just a broken image icon, site visitors will at least know the name of the image.