On-page SEO

Alt Text SEO คือ เขียนคำบรรยายภาพยังไงให้ช่วยทั้งคนและ Google

อธิบาย alt text ว่าคืออะไร ทำไมสำคัญกับผู้ใช้ที่มองไม่เห็นภาพและกับ Google Images พร้อมวิธีเขียนที่ไม่ใช่การยัดคีย์เวิร์ด และตัวอย่างที่เขียนถูกกับผิด

ทีม NOAH · เผยแพร่ 2 กันยายน 2569 · อัปเดต 2 กันยายน 2569 · อ่าน 13 นาที

สรุปสั้น

✓Alt text คือข้อความสำรองที่แสดงแทนภาพเมื่อโหลดภาพไม่สำเร็จ และเป็นข้อความที่โปรแกรมอ่านหน้าจอใช้อ่านให้ผู้พิการทางสายตาฟัง
✓Google ใช้ alt text เป็นสัญญาณหลักในการทำความเข้าใจว่าภาพนั้นคืออะไร โดยเฉพาะสำหรับผลการค้นหาแบบรูปภาพ
✓alt text ที่ดีต้องบรรยายสิ่งที่อยู่ในภาพจริง ไม่ใช่การเรียงคีย์เวิร์ดต่อกันโดยไม่สนใจว่าภาพนั้นมีอะไรอยู่
✓ภาพที่เป็นของตกแต่งล้วน ไม่มีความหมายต่อเนื้อหา สามารถเว้น alt เป็นค่าว่างได้ เพื่อให้โปรแกรมอ่านหน้าจอข้ามไป
✓ตรวจสอบ alt text ของทั้งเว็บได้ง่าย ๆ ด้วยการเปิดโค้ดหน้าเว็บดู ไม่จำเป็นต้องมีความรู้เขียนโปรแกรม

ลองปิดการโหลดรูปภาพในเบราว์เซอร์แล้วเปิดหน้าเว็บของตัวเองดูสักครั้ง ถ้าเจอแต่กล่องว่างไม่มีข้อความอธิบายเลย นั่นแปลว่าเว็บนั้นไม่มี alt text หรือใส่ไว้แบบไม่มีความหมาย ผู้ใช้ที่เน็ตช้า ผู้ใช้โปรแกรมอ่านหน้าจอ และบอทของ Google ต่างเจอปัญหาเดียวกันคือมองไม่เห็นว่าภาพนั้นคืออะไร

Alt text จึงไม่ใช่ช่องกรอกคีย์เวิร์ดเพิ่มอีกช่องหนึ่ง แต่เป็นข้อความที่ต้องทำหน้าที่แทนภาพได้จริงเมื่อภาพนั้นแสดงผลไม่ได้ บทความนี้อธิบายตั้งแต่ความหมาย วิธีเขียนที่ถูกต้อง ตัวอย่างเปรียบเทียบก่อน-หลัง ไปจนถึงวิธีตรวจสอบว่าเว็บของคุณมี alt text ครบหรือไม่

Alt Text คืออะไร

Alt text คือแอตทริบิวต์ alt ในแท็ก img ที่ใส่ข้อความบรรยายสิ่งที่ปรากฏในภาพ ทำหน้าที่เป็นข้อความสำรองเมื่อภาพโหลดไม่สำเร็จ และเป็นข้อความที่โปรแกรมอ่านหน้าจออ่านให้ผู้ใช้ที่มองไม่เห็นภาพฟัง Google ใช้ alt text เป็นสัญญาณหลักในการทำความเข้าใจเนื้อหาของภาพ โดยเฉพาะสำหรับการแสดงผลใน Google Images

ในเชิงเทคนิค alt text เขียนอยู่ในโค้ด HTML ของภาพ เช่น <img src="..." alt="ข้อความตรงนี้" /> ถ้าใช้ระบบจัดการเว็บไซต์อย่าง WordPress หรือ Shopify มักมีช่องให้กรอกข้อความนี้แยกจากชื่อไฟล์ภาพและคำบรรยายใต้ภาพอยู่แล้ว ไม่จำเป็นต้องแก้โค้ดเอง

Alt Text สำคัญกับใครบ้าง

กลุ่มแรกคือผู้ใช้โปรแกรมอ่านหน้าจอ ซึ่งพึ่งพา alt text เป็นทางเดียวที่จะรู้ว่าภาพนั้นมีอะไร ถ้าไม่มี alt หรือใส่ไว้ไม่ตรงกับภาพ ประสบการณ์ใช้งานของกลุ่มนี้จะแย่ลงทันที กลุ่มที่สองคือผู้ใช้ที่เน็ตช้าหรือภาพโหลดไม่สำเร็จ alt text ทำให้ยังเข้าใจบริบทของหน้าได้แม้ภาพไม่ขึ้น

กลุ่มที่สามคือ Google เอง ซึ่งไม่สามารถ “มองเห็น” ภาพในแบบเดียวกับมนุษย์ อาศัย alt text ร่วมกับบริบทรอบภาพเพื่อทำความเข้าใจและจัดหมวดหมู่ ภาพที่มี alt text ดีมีโอกาสปรากฏในผลการค้นหารูปภาพและใน image pack มากกว่าภาพที่ไม่มีคำบรรยายเลย อ่านเพิ่มเติมเรื่องรูปแบบผลการค้นหาที่เกี่ยวกับภาพได้ที่ SERP Features คืออะไร

ทำไมธุรกิจที่ขายสินค้าผ่านรูปภาพควรใส่ใจ Alt Text เป็นพิเศษ

ธุรกิจที่ขายสินค้าที่ต้องอาศัยรูปภาพเป็นหลัก เช่น เสื้อผ้า เฟอร์นิเจอร์ หรืออาหาร มักมีลูกค้าจำนวนไม่น้อยที่ค้นหาผ่าน Google Images โดยตรงก่อนตัดสินใจ ถ้าภาพสินค้าไม่มี alt text ที่บรรยายชัดเจน โอกาสที่ภาพนั้นจะถูกจัดอยู่ในผลการค้นหารูปภาพสำหรับคำที่เกี่ยวข้องก็จะลดลง ทั้งที่ภาพสวยและคุณภาพดีอยู่แล้ว

วิธีเขียน Alt Text ที่ดี

1บรรยายสิ่งที่อยู่ในภาพจริง เช่น สินค้า สถานที่ หรือกราฟที่แสดง ไม่ใช่คำโฆษณาหรือคำขายของ
2เขียนให้กระชับ ไม่ต้องยาวเป็นย่อหน้า เพราะโปรแกรมอ่านหน้าจอจะอ่านทุกคำที่ใส่ไว้
3ใส่คำสำคัญเฉพาะเมื่อมันปรากฏในภาพจริงตามธรรมชาติ ไม่ใช่ยัดเข้าไปทั้งที่ภาพไม่เกี่ยวข้อง
4ภาพที่เป็นของตกแต่งล้วน เช่น เส้นแบ่งหรือไอคอนซ้ำ ให้ใส่ alt เป็นค่าว่าง (alt="") เพื่อให้โปรแกรมอ่านหน้าจอข้ามไปไม่ต้องอ่านสิ่งที่ไม่มีความหมาย
5อย่าเริ่มต้นทุกประโยคด้วยคำว่า “ภาพของ” หรือ “รูปภาพ” เพราะโปรแกรมอ่านหน้าจอบอกอยู่แล้วว่าเป็นภาพ

อย่ายัดคีย์เวิร์ดลง alt text

การใส่รายการคีย์เวิร์ดต่อกันเป็น alt text เช่น ใส่ชื่อสินค้าซ้ำสิบครั้งในภาพเดียว ไม่ได้ช่วยอันดับ และเสี่ยงถูกมองว่าเป็นการยัดคำ ซึ่งขัดกับหลักการที่ Google เน้นย้ำเรื่องเนื้อหาที่มีประโยชน์ต่อผู้อ่านจริง

ตัวอย่างเปรียบเทียบ Alt Text ที่เขียนถูกกับผิด

ตัวอย่างสมมติต่อไปนี้ใช้ภาพเก้าอี้ไม้สีน้ำตาลตัวหนึ่งเพื่อให้เห็นความต่างระหว่างการเขียนที่ดีและไม่ดี

รูปแบบ	ข้อความ alt	ปัญหา / จุดดี
ผิด — ไม่มีความหมาย	IMG_00231.jpg	เป็นชื่อไฟล์ ไม่บอกอะไรเลยว่าภาพคืออะไร
ผิด — ยัดคีย์เวิร์ด	เก้าอี้ไม้ เก้าอี้ไม้ราคาถูก เก้าอี้ไม้สวย ซื้อเก้าอี้ไม้ที่นี่	เรียงคำซ้ำ ไม่ใช่ประโยคที่อ่านรู้เรื่อง โปรแกรมอ่านหน้าจออ่านแล้วสับสน
ผิด — เป็นคำโฆษณา	สินค้าคุณภาพดีที่สุดในราคาสุดคุ้ม	ไม่ได้บอกว่าภาพคืออะไรเลย
ถูก	เก้าอี้ไม้สีน้ำตาลทรงเรียบ พนักพิงโค้ง วางอยู่ในห้องนั่งเล่น	บรรยายสิ่งที่อยู่ในภาพจริง กระชับ อ่านแล้วเข้าใจทันที

ตัวอย่าง alt text ที่เขียนถูกและผิด (สมมติ)

Alt Text กับ Title Attribute ต่างกันอย่างไร

ประเด็น	alt	title
หน้าที่หลัก	ข้อความสำรองแทนภาพ / อ่านโดยโปรแกรมช่วยเหลือ	ข้อความที่ปรากฏเมื่อเอาเมาส์ไปวางค้างบนภาพ
จำเป็นต้องมีไหม	ควรมีทุกภาพที่สื่อความหมาย	ไม่จำเป็น ใช้เสริมได้เมื่อมีประโยชน์
ผลต่อการเข้าถึง (accessibility)	สำคัญมาก	แทบไม่มีผล เพราะอุปกรณ์สัมผัสไม่มีการเอาเมาส์ชี้ค้าง
Google ใช้ทำความเข้าใจภาพไหม	ใช้เป็นสัญญาณหลัก	มีผลน้อยกว่ามาก

เปรียบเทียบ alt กับ title ของแท็ก img

วิธีตรวจสอบว่าเว็บมี Alt Text ครบหรือไม่

ตรวจ alt text ของหน้าเว็บด้วยตัวเอง

1
เปิดหน้าเว็บที่ต้องการตรวจ
เข้าไปที่หน้าเว็บซึ่งมีภาพที่ต้องการตรวจสอบ
2
คลิกขวาแล้วเลือกดูซอร์สโค้ด
ในคอมพิวเตอร์ กดคลิกขวาที่พื้นที่ว่างบนหน้าเว็บ แล้วเลือก View Page Source หรือ ตรวจสอบ
3
ค้นหาคำว่า alt
ใช้ Ctrl+F หรือ Cmd+F ค้นหาคำว่า alt= ในโค้ดที่เปิดขึ้นมา จะเห็นข้อความ alt ของแต่ละภาพ
4
ดูว่าช่องไหนว่างเปล่า
ถ้าเจอ alt="" ในภาพที่สื่อความหมาย เช่น ภาพสินค้าหรือภาพประกอบเนื้อหา ให้จดไว้แล้วกลับไปเพิ่มข้อความในระบบจัดการเว็บไซต์

ทางลัดสำหรับผู้ที่ไม่ถนัดโค้ด

ถ้าเว็บใช้ WordPress หรือ Shopify สามารถตรวจสอบและแก้ไข alt text ได้จากหน้าจัดการสื่อ (Media Library) โดยไม่ต้องแตะโค้ดเลย เข้าไปคลิกที่รูปแล้วมองหาช่อง Alt Text หรือ คำบรรยายรูปภาพ

ภาพแบบไหนควรมี Alt Text แบบไหน

ภาพสินค้า: บรรยายลักษณะเด่นที่เห็นในภาพ เช่น สี วัสดุ รูปทรง
ภาพประกอบบทความ: บรรยายสิ่งที่เกิดขึ้นในภาพให้เชื่อมกับเนื้อหารอบข้าง
โลโก้: ใส่ชื่อแบรนด์ เช่น alt="โลโก้ชื่อร้าน"
กราฟหรือตาราง: สรุปสิ่งที่กราฟนั้นแสดง ไม่ใช่แค่คำว่า "กราฟ" เฉย ๆ
ปุ่มที่เป็นรูปภาพ เช่น ไอคอนตะกร้าสินค้า: บรรยายการทำงานของปุ่ม เช่น alt="เพิ่มสินค้าลงตะกร้า"
ภาพตกแต่งล้วน เช่น เส้นคั่น พื้นหลังลวดลาย: ใส่ alt เป็นค่าว่าง

Alt Text ส่งผลต่อ Core Web Vitals หรือ Accessibility อย่างไร

แม้ alt text จะไม่ได้เกี่ยวข้องโดยตรงกับความเร็วเว็บหรือ Core Web Vitals แต่มีความเกี่ยวข้องทางอ้อมกับประสบการณ์ผู้ใช้โดยรวม เพราะเว็บที่ดูแลรายละเอียดเล็ก ๆ อย่าง alt text มักดูแลเรื่องอื่นที่กระทบผู้ใช้ควบคู่กันไปด้วย เช่น ขนาดภาพที่เหมาะสมซึ่งช่วยให้เว็บโหลดเร็วขึ้นในเวลาเดียวกัน การใส่ alt text ที่ดีจึงเป็นส่วนหนึ่งของงาน on-page ที่ควรทำควบคู่ไปกับการปรับปรุงคุณภาพภาพและความเร็วเว็บโดยรวม

ข้อผิดพลาดที่เจอบ่อย

ปล่อยให้ CMS ใส่ชื่อไฟล์ เช่น IMG_2024.jpg เป็น alt text อัตโนมัติโดยไม่แก้ไข
เขียน alt text เหมือนกันทุกภาพในหน้าเดียวกันทั้งที่แต่ละภาพแสดงเนื้อหาต่างกัน
ลืมใส่ alt ให้ภาพสินค้าที่เป็นภาพหลักของหน้า ซึ่งเป็นภาพที่มีโอกาสติดผลการค้นหารูปภาพมากที่สุด
ใส่คำโปรยการตลาดแทนคำบรรยายภาพจริง เช่น เขียนว่า “สินค้าคุณภาพดีที่สุด” แทนที่จะบอกว่าภาพนั้นคือภาพอะไร
ใส่ alt เป็นค่าว่างให้ภาพที่สำคัญ เช่น ภาพสินค้าหลัก ทั้งที่ควรบรรยายให้ชัดเจน

เช็กลิสต์สรุปก่อนเผยแพร่หน้าเว็บ

เช็กลิสต์ 4 ข้อ

1) ภาพที่สื่อความหมายทุกภาพมี alt text ที่บรรยายภาพจริง 2) ไม่มีการยัดคีย์เวิร์ดซ้ำ ๆ ในช่อง alt 3) ภาพตกแต่งล้วนใส่ alt เป็นค่าว่าง 4) ภาพสินค้าและภาพหลักของหน้าเขียน alt ที่ชัดเจนและกระชับ

คำถามที่พบบ่อย

ภาพทุกภาพในเว็บต้องมี Alt Text ไหม+

ภาพที่สื่อความหมายต่อเนื้อหาควรมี alt text เสมอ ส่วนภาพที่เป็นของตกแต่งล้วนไม่มีความหมาย สามารถใส่ alt เป็นค่าว่างได้ เพื่อให้โปรแกรมอ่านหน้าจอข้ามไปโดยไม่รบกวนผู้ใช้

Alt Text ยาวเกินไปมีผลเสียไหม+

มีผลเสียทางปฏิบัติ เพราะโปรแกรมอ่านหน้าจอจะอ่านทุกคำที่ใส่ไว้ ทำให้ผู้ใช้ต้องฟังนาน ควรเขียนให้กระชับและตรงประเด็น

ใส่ Alt Text แล้วช่วยให้ติดอันดับ Google Images เลยไหม+

ช่วยเพิ่มโอกาส แต่ไม่ใช่ปัจจัยเดียว Google ยังพิจารณาคุณภาพภาพ บริบทรอบภาพ และความเกี่ยวข้องกับเนื้อหาทั้งหน้าประกอบกัน

Alt Text กับคำบรรยายใต้ภาพ (caption) ใช้แทนกันได้ไหม+

ใช้แทนกันไม่ได้ caption เป็นข้อความที่แสดงให้ผู้ใช้ทุกคนเห็นบนหน้าเว็บ ส่วน alt text เป็นข้อความสำรองที่มองไม่เห็นในสถานการณ์ปกติ ควรมีทั้งสองอย่างถ้าภาพนั้นสำคัญ

ต้องแก้ Alt Text ของภาพเก่าทั้งหมดทันทีไหม+

ไม่จำเป็นต้องรีบทำทีเดียวทั้งเว็บ แนะนำให้เริ่มจากหน้าที่มีทราฟฟิกสูงหรือหน้าสินค้าหลักก่อน แล้วค่อยทยอยแก้หน้าอื่นตามลำดับความสำคัญ

สรุป

เขียน alt text ด้วยหลักการเดียวกับที่ใช้อธิบายภาพให้เพื่อนที่มองไม่เห็นฟัง คือบรรยายสิ่งที่อยู่ในภาพจริงให้กระชับและชัดเจน ไม่ใช่ช่องสำหรับยัดคีย์เวิร์ด วิธีนี้ได้ผลดีทั้งกับผู้ใช้จริงและกับ Google ไปพร้อมกัน ดูหัวข้อ on-page อื่นเพิ่มเติมได้ที่ /on-page-seo

ถ้าอยากเห็นภาพรวมของหัวข้อนี้ทั้งหมด เริ่มที่หน้ารวมOn-page SEO แล้วค่อยเจาะรายละเอียดต่อที่ Breadcrumb คืออะไร ทำไมบางผลการค้นหาไม่โชว์ URL เต็ม

จัดระเบียบ on-page SEO ให้ครบทุกหน้าในที่เดียว

NOAH ช่วยวางแผนคอนเทนต์และตรวจสถานะ index ของหน้าเว็บที่เชื่อมไว้ เพื่อให้เห็นภาพรวมว่าจุดไหนยังขาดอยู่

สร้างบัญชี