This tutorial explains how to use the <img> tag in HTML, including the src, alt, width, and height attributes. It also covers image SEO best practices and the use of figure and figcaption.
The <img> tag is used to display images on a webpage. It is an empty tag, meaning it does not have a closing tag.
Example: <img src="image.jpg" alt="Sample Image">
The src attribute specifies the path of the image file.
Example: <img src="images/photo.jpg" alt="Photo">
The alt attribute provides a text description for the image. It is important for accessibility and helps search engines understand the image.
Example: <img src="dog.jpg" alt="A brown dog running">
You can control the display size of the image using width and height attributes.
Example: <img src="banner.jpg" alt="Website Banner" width="400" height="200">
Result: For Banner JPG
If only one value is set, the image scales proportionally.
● Use meaningful file names, e.g., "yellow-flower.jpg"
● Add a descriptive alt text for accessibility
● Use compressed images for fast loading
● Prefer modern formats like WebP for optimization
The <figure> element groups an image and its caption together. The <figcaption> element describes the image.

This method is useful for articles, blogs, or images that require explanation.
"ATP Web Creation transformed our online presence with amazing design and effective strategies. Highly recommended!"
"The tutorials and latest web technology updates are invaluable for learners and professionals alike."
"Excellent service, responsive design, and cutting-edge solutions. ATP Web Creation is my go-to for IT solutions."
1. ATP Web Creation kis tarah ki website banata hai? ›Hum business, portfolio, educational aur custom tool-based websites banate hain — har project client ke goal ke hisaab se tailor-made hota hai.
2. Website responsive hone ka kya matlab hai? ›Responsive website har screen size — mobile, tablet aur desktop — par perfect layout dikhata hai, bina zoom ya scroll ke.
3. Kya ATP Web Creation SEO-friendly websites banata hai? ›Haan, hum har site me on-page SEO, sitemap aur meta optimization integrate karte hain jisse ranking aur visibility dono improve hoti hain.
4. Custom tool development service me kya include hai? ›Custom tool development me hum aapke business ke hisaab se PHP-based web tools (jaise link scanner, sitemap generator, text editor) create karte hain.
5. Website ke saath hosting aur domain setup bhi milta hai kya? ›Haan, hum domain aur hosting setup me bhi help karte hain — chahe aapke paas existing provider ho ya naya account banana ho.
6. Kya website ko baad me edit kar sakte hain? ›Bilkul, har site ko editable banaya jata hai — aap khud changes kar sakte hain, ya hum maintenance plan ke through support dete hain.
7. Website banne ke baad support milta hai kya? ›Haan, hum post-launch support aur technical maintenance dono provide karte hain taaki aapka website smooth chale.
8. Kya aap WordPress ya custom PHP site banate hain? ›Dono! Hum WordPress CMS aur pure PHP custom websites dono banate hain — requirement aur scalability ke hisaab se recommend karte hain.
9. Website ka loading speed kitni important hai? ›Page speed SEO aur user experience dono ke liye critical hai. Hum lightweight code aur optimized images se speed improve karte hain.
10. Website development start karne ke liye kya process follow hoti hai? ›Pehle requirement discussion hoti hai, fir layout design, coding, testing aur final delivery — poori process transparent aur stepwise hoti hai.