Alt Text (Alternative Text)
อยากเพิ่มโอกาสให้รูปภาพบนเว็บติดหน้าแรก Google ผมแนะนำให้อ่านบทความนี้ครับ !
Alternative Text หรือ Alt Text คืออะไร ? มีวิธีการใส่ยังไง ? จำเป็นต้องตั้งชื่อ Image SEO ทุกรูปไหมตอนทำเว็บไซต์ Opkung สรุปข้อมูลให้เข้าใจง่าย ๆ แบบเดิม อ่านต่อกันได้เลย
การใส่ Alt Text คืออะไร ?
Alternative Text หรือ Alt Text คือ ข้อความที่บอกว่าภาพในเว็บไซต์นั้นคืออะไร หมายถึงอะไร สื่อถึงอะไร โดยจะเขียนไว้ในรูปแบบโค้ด HTML รูปภาพ
การเพิ่ม Alt Text ให้รูปภาพ มีประโยชน์อย่างไร ทำไมควรใส่ ?
สาเหตุที่ควรใส่ Alt Text ให้รูปภาพบนเว็บไซต์ Opkung สรุปไว้ดังนี้ครับ
- ช่วยให้ Google เข้าใจว่าภาพคืออะไร – ช่วงหลัง ๆ เราเชื่อว่า Google เก่งพอที่จะรู้ว่าภาพนั้น ๆ คืออะไร (แม้จะไม่ 100% แบบมนุษย์) แต่การใส่ Alt Text จะช่วยเพิ่มความเข้าใจให้ Google ได้มากขึ้นครับ
- ส่งผลดีต่อการทำ SEO ในหน้านั้น ๆ – การใส่ Alt Text จะทำให้ Bot ที่เข้ามาเก็บรวบรวมข้อมูลในเว็บ (Crawling) เข้าใจเนื้อหาหน้าเว็บมากขึ้น ว่าเกี่ยวกับเรื่องอะไร กำลังพูดถึงประเด็นไหน เพิ่มโอกาสในการติดอันดับบน Google
- เพิ่มโอกาสแสดงผลในหน้า Google Images – ภาพในเว็บไซต์ที่ใส่ Alt Text แบบมีคีย์เวิร์ด (Keyword) ประกอบชัดเจน มีโอกาสที่ภาพนั้นจะติดอันดับต้น ๆ บนหน้า Google Images เพิ่มโอกาสให้คนกดคลิกมายังเว็บไซต์ได้
- รองรับการใช้งานผู้พิการทางสายตา – ผู้ใช้งานที่เป็นผู้พิการทางสายตา มักจะใช้โปรแกรมอ่านหน้าจอ (Screen Reader) ให้ช่วยอ่านเนื้อหาแบบออกเสียงด้วยการฟังครับ การใส่ Alt Text จะช่วยให้ User เข้าใจว่าภาพนั้นคืออะไร เกี่ยวข้องกับอะไร
- ช่วยให้เข้าใจเมื่อไฟล์ภาพไม่โหลด – เมื่อไฟล์ภาพบนเว็บมีปัญหา เช่น โหลดไม่ขึ้น จะแสดงข้อความ Alt Text แทนครับ ทำให้ผู้ใช้งานพอเข้าใจเบื้องต้น ว่าภาพตรงนั้นเป็นแบบไหน
วิธีใส่ Alt Text ทำยังไง ใส่ตรงไหน ?
วิธีการใส่ Alt Text จะต่างกันไปตามแพลตฟอร์มที่ใช้งานครับ เราขอยกตัวอย่างวิธีใส่ Alt Text สำหรับเว็บที่ Custom เอง และ เว็บไซต์ที่สร้างด้วย WordPress ดังนี้
วิธีใส่ Alt Text ใน HTML โดยตรง
- หาปุ่ม Source Code หรือ HTML Code
- มองหา หา แล้วใส่ Alt Text เช่น
วิธีใส่ Alt Text บนเว็บไซต์ WordPress
- Login เข้าหลังบ้าน WordPress -> คลิก Media
- เลือกรูปภาพ หรือ อัปโหลดรูปภาพที่ต้องการ
- ใส่ Alt Text ช่อง Alternative Text
Opkung แนะนำ
สามารถตั้งชื่อไฟล์รูปภาพให้มีคีย์เวิร์ดได้นะครับ หรือจะตั้งชื่อรูปเป็นภาษาอังกฤษก็ได้เช่นกัน
แต่ส่วนตัว Opkung ชอบตั้งรูปก่อนลง Alt Text เป็นภาษาไทยครับ
สามารถใส่ Alt Text หรือ Image SEO ที่ไหนได้บ้าง ?
การใส่ Alt Text ไม่จำเป็นต้องทำแค่บนเว็บไซต์ทั่วไปเท่านั้นครับ สามารถทำผ่านแพลตฟอร์มอื่นได้ เช่น
- Facebook – ใส่ Alt Text เมื่ออัปโหลดรูปภาพ โดยสามารถคลิก “แก้ไขภาพ” และพิมพ์ Alt Text ได้ที่ช่อง “ข้อความแสดงแทน” หรือ “Alternative Text” // คลิกดูขั้นตอนการใส่ Alt Text Facebook
- Instagram – ใส่ Alt Text ได้ตอนโพสต์รูป ด้วยการกด “การตั้งค่าขั้นสูง” -> “เขียน Alt Text” เพื่ออธิบายภาพ // คลิกดูขั้นตอนการใส่ Alt Text Instagram
- Twitter (X) – เมื่อแนบรูปภาพในทวีต ให้กดปุ่ม “Alt” ที่มุมของภาพเพื่อใส่คำบรรยาย ใส่ได้สูงสุด 1,000 ตัวอักษร // คลิกดูขั้นตอนการใส่ Alt Text Twitter (X)
- LinkedIn – ตอนที่กำลังอัปโหลดรูปภาพ จะมีตัวเลือก “Alt Text” ให้เราใส่คำอธิบายภาพก่อนโพสต์ // คลิกดูขั้นตอนการใส่ Alt Text LinkedIn
- Pinterest – ขณะสร้าง Pin ใหม่ ระบบจะให้ใช้คำอธิบายหลักแทน แต่สามารถตั้งค่า Alt Text ผ่านฟีเจอร์เสริม หรือระบบ CMS ที่เชื่อมกับ Pinterest แทนได้ // คลิกดูขั้นตอนการใส่ Alt Text Pinterest
ส่วนใครจะทำ Alt Text ผ่าน Google My Business (Google Business Profile) ต้องเสียใจด้วยครับ เพราะไม่มีช่องสำหรับใส่ Alternative Text โดยตรง แต่เราสามารถตั้งชื่อไฟล์ + ใส่คำอธิบายภาพเพิ่มเติมแทนได้
แนวทางตั้งชื่อ Alternative Text ที่ดี
แนวทางการตั้งชื่อ Alternative Text รูปภาพ ที่ดี มีดังนี้
- ใส่คำอธิบายชัดเจน ตรงกับสิ่งที่เห็น
- อย่าลืมใส่คีย์เวิร์ดหลัก คีย์เวิร์ดรอง หรือคีย์เวิร์ดที่เกี่ยวข้อง
- ตั้งชื่อโดยใช้ภาษาคน เป็นธรรมชาติ
- เลี่ยงการใช้คำว่า “รูปภาพของ”, “ภาพถ่ายของ”
- ไม่ควรใส่คีย์เวิร์ดซ้ำกัน เช่น “คราฟเบียร์ คราฟเบียร์”
- ก่อนใส่ Alt Text ต้องดูบริบทของรูปภาพเสมอ
- Alt Text สั้น กระชับ ไม่ยาวเกินไป 5-15 คำ กำลังสวย
| แนวทางการตั้ง Alt Text | สิ่งที่ควรทำ | ไม่ควรทำ |
| คำอธิบายชัดเจน | ร้านมัทฉะโซนอารีย์ | IMG_0017.jpg หรือ ไม่ใส่อะไรเลย |
| มีคีย์เวิร์ดที่เกี่ยวข้อง | ร้านเพียวมัทฉะแถวอารีย์ | โซนอารีย์มัทฉะ |
| ใช้ภาษาธรรมชาติ | ร้านมัทฉะลาเต้ติด BTS อารีย์ | ร้านจำหน่ายมัทฉะลาเต้ตั้งอยู่ใกล้สถานีรถไฟฟ้าอารีย์ |
| หลีกเลี่ยงคำซ้ำซาก | ร้านมัทฉะลาเต้ติด BTS อารีย์ | มัทฉะเกรด A มัทฉะเกรด A มัทฉะเกรด A |
| ดูบริบทของภาพ | ลูกค้าสั่งซื้อเพียวมัทฉะ (ใช้ในบทความรีวิวอาหาร/เครื่องดื่ม) | ลูกค้านั่งหายใจเล่นมือถือ (ไม่เกี่ยวกับเนื้อหา) |
| ตั้งชื่อให้กระชับ | นมสำหรับชงมัทฉะลาเต้ | นมยี่ห้อหนึ่งตั้งอยู่ในตู้เย็น สามารถหยิบมาชงมัทฉะลาเต้ได้ |
ตารางแสดงตัวอย่างการตั้ง Alt Text
ควรใส่ Alt Text ทุกรูปในเว็บไซต์หรือไม่ ?
โดยส่วนตัวแล้ว Opkung มองว่าไม่จำเป็นต้องใส่ Alt Text ทุกภาพในเว็บครับ โดยเฉพาะภาพ Element ตกแต่งต่าง ๆ สามารถข้ามการใส่ Alt Text ไปได้เลย
แต่กรณีที่ทำบทความ เช่น บทความเรื่องบริษัทรับทำ SEO กรณีนี้ควรใส่ Alt Text ให้กับภาพประกอบบทความด้วยตามแนวทางด้านบนได้ครับ จะทำให้ Google เข้าใจบริบทของบทความและภาพในเว็บเรามากขึ้น
คำถามที่พบบ่อยเกี่ยวกับ Alt Text
Alt Text คือการกำหนดค่าอะไร ?
Alt Text คือ การกำหนดค่าให้รูปภาพ ว่าเป็นรูปเกี่ยวกับอะไร คืออะไร หมายถึงอะไร
ALT Text ใน HTML คืออะไร ?
ALT Text ใน HTML คือ ข้อความที่อยู่ในโค้ด HTML ตรง Tag ใส่ไว้เพื่อให้ Bot ของ Search Engine เข้าใจว่าภาพนี้คืออะไร เกี่ยวกับเรื่องอะไร
Img Alt tag กับ Alt Text เหมือนกันไหม ?
Img Alt tag กับ Alt Text คือ สิ่งเดียวกัน ความหมายเหมือนกันครับ จะต่างก็แค่ชื่อเรียกและบริบทการใช้งาน เช่น
- Alt Text – ใช้เรียก พูดคุยกันทั่วไป เช่น “ฝากแจ้งทีมเว็บหน่อยนะครับ ว่าให้ใส่ Alt Text บทความรีวิวเบียร์ IPA ด้วย”
- Img Alt tag – เป็นศัพท์เฉพาะที่ใช้เวลาเขียนโค้ด มีความถูกต้องตามหลัก HTML คือ alt attribute ของแท็ก <img>
สรุปเรื่องการใส่ Alt Text รูปภาพ
สรุปแบบเข้าใจง่าย ๆ Alt Text หรือ Alternative Text คือ การอธิบายภาพในเว็บไซต์เพื่อให้แพลตฟอร์มต่าง ๆ เข้าใจ ว่าภาพคืออะไร เกี่ยวกับอะไร มีบริบทแบบไหน เป็นเหมือนกับการทำให้ภาพ “พูดได้” แม้ว่าจะไม่มีปากแบบมนุษย์ก็ตามครับ
โดยควรตั้งชื่อ Alt Text ให้เกี่ยวข้องกับภาพ อย่าไปหลอก Bot ครับ เพราะเดี๋ยวนี้ระบบมันฉลาดแล้ว ที่สำคัญควรมีคีย์เวิร์ดประกอบด้วย เพื่อเพิ่มโอกาสการติด Google Images Search
