How to Create Web Pages Using HTML : How to Add a Picture to a Web Page


Hello, my name is Luis Estrada, and I am a
software developer. In this video, I will show you how to add a picture to a web page.
To do this inside the body tag, you add a new image tag. Type img, short for image,
and then src, short for source, and then type inside quotation marks the location of this
image. In this case I have a car image in the same folder as my HTML file. So type car.jpg,
save the file, and reload the browser. If you want to make your image appear smaller
or bigger on your page, you can do that by using the width and height attributes of the
image tag. Type: width=equals “300”, and height=”200″. This tells the browser to display the image
at a resolution of 300 pixels X 200 pixels. Save the file and refresh. Now you see the
new image on the page. A lot of people use higher resolution images. And by that I mean
images that are larger, and then simply adjust the necessary width and height attribute accordingly.
For example, on the same folder, I have a picture called “my car” with a resolution
of 3072 width X 2304 height. I will include it, instead of the car’s image. You will see that the image is displayed,
but it gets a little distorted. And most importantly, even when this picture is displayed at a smaller
percentage of its actual size, the image still needs to be loaded completely. So, if you
have a two megabyte picture displayed at a smaller size, it would be an image that would
take a lot of time to load on the page. Instead, use an image editor to resize the image. You
will see that the new image file size will be only a small fraction of its original,
and this would make your pages faster to load. I’m Luis Estrada, and I’ve just shown you
how to create web pages using HTML.

Leave a Reply

Your email address will not be published. Required fields are marked *