Learn HTML Coding, Webpage Designing using image tag, how to add image in in HTML Page

Image tag in HTML

Learn how to add image in html page, set image width height using css style.

How to add Image in Web Page

Images are everywhere on the web, Image make any web page more attractive, They are the most commonly shared content on social media and every modern web page contains good number of image to draw visitors attention. The web page reader love to view beautiful images,

There is a saying that one image talk thousand words.

But still many websites are not using images to their full potential

Image tag in HTML
Image tag <img src="" alt="use of image tag in html" title="html image tag" /> is used when we want to display some image on our webpage

image tag example: This is how your image tag may look like.
<img src="image-folder/image_name.jpg" alt="image name for search engine" title="image title for end user and search engine" /> 

You also can write many other additional property for display using Css Class.

Image tag Properties in HTML

  • src

    Required attribute. This is the path to the image, this is virtual path, so you can display image from any sources

  • width

    Optional attribute. This specifies the width to display the image

  • height

    Optional attribute. This specifies the height to display the image, Most of the time we don’t specify the height of image, unless we need to fit the image within a specific container

  • alt

    This is also optional, alternate text used in case the browser/user agent can't render the image, but this property is very helpful for search engine optimization

  • title

    Title is an optional property, but very useful for SEO

<img src="imageName.jpg" style="width:400px;height:200px;" /> 

Optimize Images for your Webpage
Very big size image can slow down the page load, and visitor may not wait for long, so while using any image on webpage make sure they optimized and use right percentage of width to make them responsive for different device

Though you can use any images from external site, technically possible, but that may be bad idea of finding images for your website. There are many images are protected by copyright laws, that means using them without permission can land you in very legal and financial problem, so be careful using any free images from web


Web Designing Tutorials
Image Tag in Html

digital marketing software

HTML Tutorial | Join Web Designing Course | HTML5 Introduction