คำสั่งแทรกภาพใน HTML คือการใช้แท็ก `<img>` เพื่อแทรกรูปภาพเข้าไปในหน้าเว็บไซต์ โดยแท็กนี้เป็นหนึ่งในแท็กที่สำคัญในการสร้างเนื้อหาที่มีภาพเป็นส่วนประกอบ ซึ่งช่วยเพิ่มความน่าสนใจและการเข้าใจเนื้อหาของผู้ใช้มากยิ่งขึ้น
### รูปแบบของแท็ก `<img>`
แท็ก `<img>` เป็นแท็กที่ไม่มีปิด (self-closing tag) โดยมีรูปแบบทั่วไปดังนี้:
```html
<img src="url_of_image" alt="description_of_image" width="width_value" height="height_value">
```
### อธิบายส่วนประกอบของแท็ก `<img>`
1. **src**: เป็นคุณสมบัติที่จำเป็น ต้องระบุที่อยู่ (URL) ของไฟล์ภาพที่ต้องการแสดง ซึ่งสามารถเป็นลิงก์ไปยังภาพบนเว็บไซต์อื่น หรือพาธไปยังไฟล์ภาพในโฟลเดอร์ภายในเว็บไซต์
2. **alt**: เป็นคุณลักษณะที่ใช้ระบุคำอธิบายของภาพ หากภาพไม่สามารถแสดงได้หรือผู้ใช้ใช้โปรแกรมอ่านหน้าจอ คำอธิบายนี้จะถูกอ่านให้ผู้ใช้ทราบ ช่วยให้การเข้าถึงเนื้อหาเป็นไปได้ดีขึ้น
3. **width** และ **height**: เป็นคุณสมบัติที่ใช้กำหนดขนาดของภาพที่แสดงในหน้าเว็บ สามารถระบุเป็นพิกเซล (px) หรือเปอร์เซ็นต์ (%) ได้
### ตัวอย่างการใช้งาน
```html
<img src="https://example.com/image.jpg" alt="A beautiful scenery" width="600" height="400">
```
ในตัวอย่างนี้ รูปภาพจะถูกแทรกจาก URL ที่ระบุ โดยมีคำอธิบายภาพว่า "A beautiful scenery" และกำหนดขนาดภาพเป็น 600 พิกเซลกว้าง และ 400 พิกเซลสูง
### หมายเหตุ
- คำสั่งแทรกภาพไม่อาจแสดงผลได้ถ้า URL ที่ระบุผิดพลาดหรือไฟล์ภาพไม่มีอยู่จริง
- การใช้คุณสมบัติ `alt` เป็นสิ่งที่สำคัญมากในด้าน SEO และช่วยการเข้าถึงของผู้ที่มีความพิการ
- ควรเลือกใช้ภาพที่มีขนาดเหมาะสม เพื่อลดเวลาในการโหลดหน้าเว็บและปรับปรุงประสบการณ์ของผู้ใช้
การแทรกรูปภาพใน HTML เป็นวิธีที่ง่ายและรวดเร็วในการทำให้เว็บไซต์ของคุณดูดีขึ้น การใช้แท็ก `<img>` อย่างถูกต้องสามารถเพิ่มความน่าสนใจและความเข้าใจในเนื้อหาของเว็บไซต์ได้อย่างมากมาย.