คืออะไร เขียนอย่างไร และทำไมจึงมีความสำคัญต่อ SEO

เผยแพร่แล้ว: 2023-07-28


วันนี้เกือบ 19% ของ SERPs ของ Google แสดงรูปภาพ นั่นหมายความว่า แม้ว่าคุณจะพยายามทำ SEO อย่างดีที่สุดแล้ว คุณก็ยังอาจพลาดแหล่งที่มาของการเข้าชมทั่วไปอื่น ซึ่งก็คือรูปภาพของเว็บไซต์ของคุณ

นักการตลาดเขียนข้อความแสดงแทนรูปภาพ

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

สารบัญ

ปรับปรุงเว็บไซต์ของคุณด้วย SEO ทางเทคนิคที่มีประสิทธิภาพ เริ่มต้นด้วยการดำเนินการตรวจสอบนี้

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

เหตุใดข้อความแสดงแทนรูปภาพจึงมีความสำคัญ

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

การเข้าถึง

ในปี 1999 W3C ได้เผยแพร่ แนวทางการเข้าถึงเนื้อหาเว็บ 1.0 เพื่ออธิบายวิธีการทำให้เนื้อหาสามารถเข้าถึงได้มากขึ้นสำหรับผู้ใช้ที่มีความพิการ หนึ่งในแนวทางเหล่านี้คือ "ให้ทางเลือกที่เทียบเท่ากับเนื้อหาการได้ยินและภาพ" หมายความว่าหน้าเว็บใดๆ ที่มีรูปภาพ (หรือภาพยนตร์ เสียง แอปเพล็ต ฯลฯ) ควรมีข้อมูลที่เทียบเท่ากับเนื้อหาภาพหรือเสียง

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

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

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

ประสบการณ์ผู้ใช้

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

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

รูปภาพแสดงภาพไอคอนแตกและข้อความแสดงแทนคำอธิบายที่อ่านถ้วยกาแฟเต็มเจ็ดบนโต๊ะไม้

ที่มาของภาพ

การจราจรภาพ

ข้อความแสดงแทนที่สำคัญอีกอย่างหนึ่งสำหรับคุณคือแสดงรูปภาพของคุณในผลการค้นหา ไม่ว่าจะเป็นใน Google รูปภาพหรือเป็นแพ็ครูปภาพ ชุดรูปภาพเป็นผลลัพธ์พิเศษที่แสดงเป็นแถวแนวนอนของลิงก์รูปภาพที่สามารถปรากฏในตำแหน่งทั่วไปใดๆ (รวมถึงตำแหน่ง #1 บน SERP ตามที่เห็นในตัวอย่างในบทนำ)

และรูปภาพที่ปรากฏในผลการค้นหาทั้งสองประเภทยังเป็นอีกวิธีในการรับผู้เข้าชมทั่วไป ซึ่งอาจส่งผลให้มีผู้เข้าชมเพิ่มขึ้นอีกหลายพันคน อย่างน้อยก็ในกรณีของ HubSpot

ตั้งแต่ปี 2018 ทีมงาน HubSpot Blog ได้ปรับใช้กลยุทธ์ SEO แบบใหม่ ซึ่งส่วนหนึ่งเน้นไปที่การปรับข้อความแสดงแทนรูปภาพให้เหมาะสมมากขึ้น สิ่งนี้ช่วยเพิ่มการเข้าชมรูปภาพของบล็อกถึง 779% ในเวลาน้อยกว่าหนึ่งปี ซึ่งส่งผลให้มีการดูแบบออร์แกนิกเพิ่มขึ้น 160,000 ครั้ง คุณสามารถอ่านเพิ่มเติมเกี่ยวกับความสำเร็จของทีมได้ในบล็อกโพสต์นี้

วิธีเพิ่มข้อความแสดงแทนในรูปภาพของคุณ

ในระบบจัดการเนื้อหา (CMS) ส่วนใหญ่ การคลิกที่รูปภาพในเนื้อหาของบล็อกโพสต์จะสร้างการปรับแต่งรูปภาพหรือโมดูล Rich Text ซึ่งคุณสามารถสร้างและเปลี่ยนข้อความแสดงแทนของรูปภาพได้

มาดูขั้นตอนต่อไปสำหรับ CMS Hub และ WordPress ด้านล่าง

วิธีเพิ่มข้อความแสดงแทนใน HubSpot CMS

ใน HubSpot เมื่อคุณคลิกรูปภาพและคลิกไอคอนแก้ไข (ซึ่งดูเหมือนดินสอ) กล่องป๊อปอัปการปรับแต่งรูปภาพจะปรากฏขึ้น

นี่คือลักษณะของหน้าต่างปรับแต่งรูปภาพใน CMS ภายในพอร์ทัล HubSpot ของคุณ:

ช่องข้อความแสดงแทนภายในป๊อปอัพ Image Optimization ใน CMS Hubs Content Editor

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

แท็กข้อความแสดงแทนรูปภาพที่ไฮไลต์ในซอร์สโค้ด HTML ของบล็อกโพสต์ใน CMS Hub

วิธีเพิ่มข้อความแสดงแทนใน WordPress CMS

ใน WordPress การคลิกที่รูปภาพจะเป็นการเปิดแท็บ บล็อก ในแถบด้านข้างโดยอัตโนมัติ ภายใต้ส่วนที่ชื่อว่า “การตั้งค่ารูปภาพ” ให้เพิ่มข้อความแสดงแทนในฟิลด์ว่าง

เพิ่มข้อความแสดงแทนในส่วนการตั้งค่ารูปภาพของแท็บบล็อกในแถบด้านข้างของแดชบอร์ด WordPress ของคุณ

เมื่อคุณพร้อม ให้คลิก อัปเดต จากแถบเครื่องมือที่ด้านบนสุดของหน้าจอ

กฎที่สำคัญที่สุดของข้อความแสดงแทน? มีคำอธิบายและเฉพาะเจาะจง อย่างไรก็ตาม โปรดทราบว่ากฎข้อความแสดงแทนนี้อาจสูญเสียคุณค่าหากข้อความแสดงแทนของคุณไม่พิจารณาบริบทของรูปภาพด้วย ข้อความแสดงแทนสามารถพลาดเครื่องหมายได้สามวิธี พิจารณาตัวอย่างด้านล่าง

3 ตัวอย่างข้อความ Alt รูปภาพ (ดีและไม่ดี)

1. คำหลักเทียบกับรายละเอียด

ภาพจิตรกรรมฝาผนังสีส้มที่เขียนว่า 'จัดส่ง' บนผนังที่สำนักงานในสิงคโปร์ของ HubSpot

ข้อความแสดงแทนไม่ดี

alt="HubSpot office wall Singapore inbound marketing workplace murals orange walls ship it"

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

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

ที่เลวร้ายที่สุด Google แจกบทลงโทษสำหรับการบรรจุคำหลัก

ข้อความแสดงแทนที่ดี

เมื่อคำนึงถึงข้อความแสดงแทนที่ไม่ดี (ด้านบน) ข้อความแสดงแทนที่ดีกว่าสำหรับภาพนี้อาจเป็น:

alt="Orange mural that says 'ship it' on a wall at HubSpot's Singapore office"

2. รายละเอียดกับความเฉพาะเจาะจง

David Ortiz จาก Boston Red Sox ตีจากโฮมเพลตที่ Fenway Park

ที่มาของภาพ

ข้อความแสดงแทนไม่ดี

alt="Baseball player hitting a ball at a baseball field"

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

ข้อความแสดงแทนที่ดี

เมื่อคำนึงถึงข้อความแสดงแทนที่ไม่ดี (ด้านบน) ข้อความแสดงแทนที่ดีกว่าสำหรับภาพนี้อาจเป็น:

alt="David Ortiz of the Boston Red Sox batting from home plate at Fenway Park"

3. ความเฉพาะเจาะจงเทียบกับบริบท

อาจารย์การตลาดชี้ไปที่หน้าจอคอมพิวเตอร์ของนักเรียนระหว่างบทเรียนเกี่ยวกับข้อความแสดงแทน

ที่มาของภาพ

ทั้งสองภาพด้านบนมีบริบทที่ชัดเจนซึ่งช่วยให้เราเขียนข้อความแสดงแทนได้ดี ภาพหนึ่งมาจากสำนักงาน HubSpot และอีกภาพคือ Fenway Park แต่จะเป็นอย่างไรหากรูปภาพของคุณไม่มีบริบทอย่างเป็นทางการ (เช่น ชื่อสถานที่) ที่จะใช้อธิบาย

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

สำหรับบทความเกี่ยวกับการเข้าเรียน Business School

ข้อความแสดงแทนไม่ดี

alt="Woman pointing to a person's computer screen"

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

ข้อความแสดงแทนที่ดี

เมื่อคำนึงถึงข้อความแสดงแทนที่ไม่ดี (ด้านบน) ข้อความแสดงแทนที่ดีกว่าสำหรับภาพนี้อาจเป็น:

alt="Business school professor pointing to a student's computer screen"

สำหรับเว็บเพจเกี่ยวกับซอฟต์แวร์การศึกษาสำหรับครูผู้สอนในโรงเรียนธุรกิจ

ข้อความแสดงแทนไม่ดี

alt="Teacher pointing to a student's computer screen"

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

ข้อความแสดงแทนที่ดี

เมื่อคำนึงถึงข้อความแสดงแทนที่ไม่ดี (ด้านบน) ข้อความแสดงแทนที่ดีกว่าสำหรับภาพนี้อาจเป็น:

alt="Professor using education software to instruct a business school student"

แนวทางปฏิบัติที่ดีที่สุดสำหรับข้อความแสดงแทนรูปภาพ

ท้ายที่สุดแล้ว ข้อความแสดงแทนรูปภาพต้องมีความเฉพาะเจาะจง แต่ยังเป็นตัวแทนของหัวข้อของหน้าเว็บที่รองรับด้วย เข้าใจรึยัง? ต่อไปนี้เป็นกุญแจสำคัญบางประการในการเขียนข้อความแสดงแทนรูปภาพที่มีประสิทธิภาพ:

Alt Text ส่งผลต่อ SEO อย่างไร

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

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

ด้วยการเปิดตัว Search Generative Experience (SGE) ของ Google ข้อความแสดงแทนตามบริบทคุณภาพสูงทำให้มั่นใจได้ว่าเนื้อหาของคุณอยู่ในการผสมผสานของสแนปชอตข้อมูลสำคัญที่ขับเคลื่อนด้วย AI แบบใหม่

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

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

ตัวอย่างเช่น ผู้เยี่ยมชมที่ค้นหาวิธีลบรายการที่ซ้ำกันใน excel อาจต้องการภาพหน้าจอเพื่อให้พวกเขาเข้าใจวิธีการทำงานให้เสร็จได้อย่างรวดเร็ว

บล็อกโพสต์ที่อธิบายวิธีลบรายการที่ซ้ำกันใน Excel รวมถึงรูปภาพพร้อมข้อความแสดงแทนเพื่อสนับสนุนเนื้อหา

ที่มาของภาพ

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

การเพิ่มข้อความแสดงแทนรูปภาพในเว็บไซต์ของคุณ

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

ยิ่งคุณเพิ่มประสิทธิภาพรูปภาพมากเท่าไหร่ กลยุทธ์ SEO ของคุณก็จะยิ่งดีขึ้นเท่านั้น

หมายเหตุบรรณาธิการ: โพสต์นี้เผยแพร่ครั้งแรกในเดือนกันยายน 2018 และได้รับการอัปเดตเพื่อความครอบคลุม

ปรับปรุงเว็บไซต์ของคุณด้วย SEO ทางเทคนิคที่มีประสิทธิภาพ เริ่มต้นด้วยการดำเนินการตรวจสอบนี้