การทำ SEO รูปภาพ

การทำ SEO รูปภาพ

รูปหนึ่งรูปแทนคำพูดร้อยพัน เป็นประโยคอมตะที่ใช้กันมาตลาด ในโลกออนไลน์ การทำ seo กับรูปภาพและวีดีโอมีความสำคัญอย่างมาก และไม่แปลกที่ search engine จะให้ความสำคัญกับสื่อทั้งสองไม่ด้อยไปกว่าเนื้อหา

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

แล้วกูเกิ้ลอ่านภาพออกได้มากแค่ไหน? จริงๆเทคโนโลยี่การวิเคราะห์ภาพพัฒนาไปอย่างมากไม่ใช่เฉพาะกับ google หรือ search engine ต่างๆ ถ้าคุณเคยสังเกตแอพหลายค่ายสามารถอ่านภาพออกทั้งนั้นไม่ว่าจะเป็น Instagram หรือ Facebook ถึงแม้กูเกิ้ลจะไม่ใช่แอพแบบนั้นก็ตามแต่อย่างน้อยก็แยกออกว่านี่เป็นภาพวิวหรือภาพคน ภาพวาดหรือภาพเขียน ดังนั้นถ้าคุณคิดว่ากูเกิ้ลอ่านภาพไม่ออกล่ะก็คุณเข้าใจผิด

Table of Contents

เลือกรูปให้ตรงกับเนื้อหา

ใน WordPress จะมี featured image สำหรับใส่รูปกำกับไปกับโพสต์หรือเพจ นี่เป็นด่านแรกของการใส่รูปให้กับบทความ คุณต้องเลือกรูปที่สื่อความหมายกับเนื้อหาโดยรวมมากที่สุดและต้องคิดไว้ก่อนว่า google อ่านรูปออก(จะมากน้อยแค่ไหนก็ช่าง) เทคนิคง่ายๆอย่างหนึ่งก็คือใส่ข้อความแบบพิมพ์ตัวอักษรลงไปในรูปภาพ(ไม่ใช่เขียนโดยเอาเมาส์ลาก) ซึ่งกรณีนี้กูเกิ้ลอ่านออกแน่นอนและการใส่ keyword เข้าไปในรูปที่กำกับ post/page อย่างพอเหมาะก็ให้ผลดีในบางกรณี

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

เลือกรูปประกอบ paragraph

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

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

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

แหล่งรูปภาพประกอบบทความ

ปัญหาหนักใจอย่างหนึ่งของคนเขียนบทความคือจะหาภาพที่ตรงกับความต้องการได้จากที่ไหน? วิธีที่ง่ายที่สุดคือค้นหาจาก image ของ google มีเรื่องที่ต้องระวังคือลิขสิทธิ์ ทางเลี่ยงก็คือเลือกภาพที่เป็น free image หรือ stock image สำหรับการเขียนบทความฉบับร่าง (draft) คุณอาจเลือกใช้ภาพเท่าที่หาได้วางลงไปก่อนเพื่อให้เห็นโครงร่างของบทความก่อนที่จะเผยแพร่ (publish) จากนั้นค่อยมาแก้ภาพให้เป็นเอกลักษณ์ทีหลัง

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

สำหรับโปรแกรม Photoshop และ Illustrator มีแหล่งที่ให้คุณดาวน์โหลดรูปย่อยอยู่มากมาย รวมทั้งรูปภาพทั้งรูป เช่น

freepik.com เป็นแหล่งรวมไฟล์ภาพ vector(.ai) ที่วาดด้วย Illustrator และไฟล์ภาพ(.psd) ที่วาดด้วย Photoshop ให้คุณดาวน์โหลดมาใช้ได้ฟรี คนที่ชำนาญโปรแกรมทั้งสองเพียงเล็กน้อยก็สามารถนำเอา element หลายๆตัวมาวางเป็นภาพประกอบเว็บโดยใช้เวลาไม่นานนัก

เพื่อเป็นการตอบแทนซึ่งกันและกัน แหล่งรูปภาพฟรีเหล่านี้มักขอให้เราให้เครดิตเขา ซึ่งเราก็ควรจะทำและยังได้ outbound link ไปยังเว็บอื่นอย่างเป็นธรรมชาติด้วย อย่างเช่นเว็บ unsplash.com ที่ผมเอารูปมาทำเป็น background ของ featured image ของบทความนี้ผมก็ copy รหัส HTML ของเขามาใส่

เครดิต unsplash-logoJacob Morchเป็นรูปภาพที่เอามาดัดแปลงเป็น Featured Image

สิ่งแรกที่คุณจะต้องทำก่อนที่จะใส่รูปภาพนี้เข้าไปในเว็บก็คือลดขนาดของมันลงซะก่อน รูปที่ผมเอามานี้เป็น png ขนาดประมาณ 3MB คุณจะต้องลดมันให้เหลือประมาณ 1000px ในกรณีของผม ผมเลือก 700px ซึ่งเมื่อลด size จะเหลือ 139KB ซึ่งก็ยังมากเกินไป เอามาบีบอีกทีแล้วเหลือ 25.7KB ซึ่งถือว่าโอเค

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

หากคุณชอบรูปภาพประเภทภาพวาด ก็ต้องขยับไปใช้โปรแกรม Illustrator ซึ่งไอเดียก็คล้ายๆกัน คือคุณไปหา background ที่เป็น image หรือ vector แล้วนำ element ที่เป็น vector มาวางก็จะได้รูปภาพประกอบบทความในแนวภาพเขียน

รูปฟีเจอร์ถือว่าเป็นหน้าเป็นตาและเป็นตัวแทนของบทความ เพราะฉะนั้นคุณต้องเลือกอย่างพิถีพิถัน ภาพที่เล็กเกินไปจะถูกมองว่าไม่สำคัญ โดยทั่วไปจะถือเอาความกว้าง viewport ของจอเบราเซอร์บน desktop เป็นหลักซึ่งธีมส่วนใหญ่จะเซตไว้ที่ประมาณ 1000px คุณอาจเลือกรูปประมาณ 700-800px เพื่อไม่ให้ดูเต็มพื้นที่มากไป ส่วนบน mobile จะถูกปรับขนาดโดยอัตโนมัติ

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

ได้เวลาทำ seo

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

ตั้งชื่อไฟล์ให้ตรงกับรูปภาพ

ถ้าคุณทำเว็บโชว์ภาพถ่ายแล้วได้ไฟล์ชื่อประเภท DSCxxxx.jpg ถ่ายปุ๊บก็อัพโหลดเข้า WordPress ปั๊บ ถึงเวลาที่คุณต้องเปลี่ยนความเคยชินแล้ว ชื่อไฟล์เป็นด่านแรกที่จะเป็นตัวบอกว่าภาพนั้นคือภาพอะไร ถ้าคุณถ่ายภาพทะเลหัวหิน ง่ายๆคือคุณเปลี่ยนชื่อไฟล์เป็น seaside-huahin.jpg ถ้าคุณอยากเน้นว่านี่คือ “ภาพวิวทะเลแห่งหนึ่ง” หรือ huahin-seaside.jpg ถ้าคุณอยากเน้นว่านี่คือ “ภาพหัวหิน” หลักง่ายๆคือใช้ keyword ที่คุณต้องการเป็นคำแรกของรูปภาพจะเป็นด่านแรกที่ชี้นำว่าภาพนั้นคือภาพอะไร นี่เป็นสเต็ปแรกของการทำ seo ให้กับรูปภาพและทำได้อย่างง่ายๆ

อย่าตั้งชื่อไฟล์ให้ยาวเกินไป ซึ่งโดยธรรมชาติก็ไม่ควรยาวเพราะเราจะใส่เฉพาะคำที่เกี่ยวข้องกับรูปภาพ ตั้งชื่อเป็นภาษาอังกฤษดีที่สุดเพราะเกิดปัญหาน้อยและกูเกิ้ลสามารถแปลกลับเป็นไทยได้ไม่มีปัญหา และอย่าใส่คำฟุ่มเฟือยอย่าง a, an, the, this, that, those อะไรทำนองนี้ลงไป เช่น this-is-the-seaside-of-our-place คำฟุ่มเฟือยจะทำให้ชื่อไฟล์ยาวโดยไม่จำเป็น กรณีนี้อาจตั้งเป็น seaside-place หลักง่ายๆคือใส่เฉพาะคำหลักๆที่เกี่ยวกับภาพอย่าใส่เป็นประโยค ซึ่งคำบรรยายเราจะไปใส่ในส่วนอื่น

ปรับขนาดรูปภาพให้เหมาะสม

Mobile-first

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

เพราะว่ามือถือมีขนาดเล็กและคนเปิดเว็บผ่านมือถือก็มีความอดทนน้อยกว่าคนที่เปิดเว็บผ่าน desktop ถ้าเปิดเว็บใดแล้วต้องค้างเป็นเวลานานเกินกว่า 5-10 วิ (ตามที่มีการวิจัย-จริงๆแล้วแต่พฤติกรรมของแต่ละคน)ก็จะผละหนีจากเว็บนั้นไปทันที ดังนั้นแต่ละหน้าเว็บของเราจะต้องมีขนาดเล็กที่สุดเท่าที่จะทำได้(ในขณะที่ต้องมีเนื้อหามากพอที่จะได้รับความสนใจจากกูเกิ้ล)

Size does matter

ข้อความไม่ใช่ปัญหาเพราะมีขนาดไม่เท่าไหร่ แต่ที่เป็นปัญหาคือรูปภาพ ดังที่ได้กล่าวมาตอนต้น google นั้นปรารถนาให้บทความของเรามีรูปภาพประกอบที่นอกเหนือจาก featured image แต่ก็ไม่ต้องการให้ขนาดของรูปภาพในหน้านั้นใหญ่เกินไปจนเสียเวลาในการโหลดนาน ทางแก้ง่ายๆก็คือ “คุณต้องลดขนาดรูปภาพทุกรูปให้เล็กลงเท่าที่จะทำได้โดยไม่สูญเสียรายละเอียดและง่ายต่อการดู”

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

ถ้าคุณใช้โปรแกรมจับภาพเต็มจอของจอ full HD (1920×1080) คุณจะได้ภาพประมาณ 500KB คุณอาจบอกว่าเป็นขนาดที่จิ๊บจ่อยมาก ใช่ครับสำหรับเก็บบนฮาร์ดดิสต์หรือ flash drive แต่ไม่ใช่สำหรับใส่เข้าไปในหนึ่งหน้าเว็บไซต์เพราะมันเท่ากับ 0.5 MB หรือ 30% ของลิมิต(1.5MB)ที่นิยมใช้เป็นเกณฑ์

ลดขนาดไฟล์ภาพลง (compression)

การอัพโหลดไฟล์ขนาด 500KB ไปที่ Media ไม่ใช่ความคิดที่ดี แม้ว่า WordPress จะสร้างไฟล์ขนาดเล็กลงมาให้อัตโนมัติก็ใช่ว่าจะได้ขนาดที่เหมาะสมเสมอไป ทางที่ดีคือคุณต้องลดขนาด full size ของมันลงมาก่อนแล้วค่อยอัพโหลดไปที่ Media ซึ่งเมื่อทำเช่นนี้แล้วคุณอาจลดขนาดไฟล์ลงเหลือ 125KB หรือประมาณ 7% ของลิมิต เล็กพอไหม? คำตอบคือไม่พอครับ

โดยทั่วไปขนาดของภาพที่ 50KB ก็ถือว่าเต็มกลืนแล้วสำหรับใส่เข้าไปในหน้าเว็บไซต์ เพราะขนาดนี้ถ้าเทียบเป็นตัวอักษรคร่าวๆก็ประมาณ 5 หน้ากระดาษ A4, ถ้าคุณใส่หนึ่งรูปต่อเนื้อหา 1 หน้า A4, อัตราส่วนขนาดเนื้อหาต่อรูปภาพก็ประมาณ 1 ต่อ 5 ! อย่าเพิ่งตกใจ ผมยกตัวอย่างนี้มาไม่ใช่ไม่ให้คุณใส่รูปภาพ(ซึ่งควรใส่) แต่อยากให้คุณเห็นว่าภาพที่คุณใส่เข้าไปไปเพิ่มขนาดของข้อมูลแค่ไหน

โดยทั่วไปคุณอาจถือเอาขนาดภาพ 50KB เป็นขนาดสูงสุดที่ยอมได้ โดยทั่วไปการลดขนาดของภาพลงจาก 125KB ไปเป็น 50KB มักไม่ง่ายนักเพราะขึ้นอยู่กับรายละเอียดของภาพ ถ้าภาพใหญ่จะหลีกเลี่ยงยาก ถ้าภาพรายละเอียดไม่มากก็จะมีโอกาสมากขึ้น พยายามทำให้เฉลี่ยแล้วเหลือภาพละ 20KB กำลังดี

เครื่องมือช่วยลดขนาดไฟล์ภาพ

มีเครื่องมือออนไลน์อยู่หลายแห่งที่ช่วยลดขนาดของไฟล์ลง ถ้าภาพต้นฉบับมีขนาดใหญ่มากกว่า 1000px คุณควรลดขนาดภาพลงมาให้เหลือ 700px-1000px (ขึ้นกับรายละเอียดของภาพ) จากนั้นก็นำไปลดขนาดไฟล์ ช่วงที่ผมยกมานี้เป็นขนาดที่ผมใช้อยู่สำหรับภาพขนาดใหญ่และมีความละเอียดสูง คุณอาจเลือกตัวเลขตามที่คุณเห็นว่าเหมาะสม การลดขนาด pixel ผมแนะนำให้ใช้โปรแกรมบนเครื่องดีกว่า โปรแกรมจับภาพอย่าง HyperSnap ก็ทำได้สบายมากหรืออะไรก็ได้ที่คุณถนัดซึ่งขนาดของไฟล์ก็จะลดลงด้วย

จากนั้นจึงไปลดขนาดไฟล์อีกทีโดยใช้โปรแกรมออนไลน์ ที่ผมใช้อยู่ประจำก็เช่น jpeg.io, tinypng.com

ทำให้รูปภาพ responsive

เว็บไซต์ที่ responsive หมายถึงเว็บที่สามารถปรับตัวให้แสดงบนหน้า desktop ได้ดีพอๆกับหน้า mobile เว็บแบบนี้จะถือว่าผ่านหลัก mobile-first โดยปริยาย ถ้าคุณเข้าเว็บไซต์บางแห่งที่ยังไม่ได้ปรับปรุงให้ดูได้ดีบน mobile คุณจะเห็นว่ามันแสดงเหมือนกับดูบน desktop ซึ่งตัวอักษรก็จะเล็กๆต้อง zoom ดูถึงจะเห็น อย่างนี้เรียกว่าเว็บไม่ responsive

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

มีวิธีทดลองง่ายๆคือคุณเปิดเว็บๆหนึ่งใน desktop แล้วลองลดความกว้างของเบราเซอร์ลง เลย์เอาท์ที่เรียงจากซ้ายไปขวาจะถูกจัดให้เรียงจากบนลงล่างเมื่อความกว้างของเบราเซอร์แคบลง

responsive web จะปรับ layout แบบ 3-column เป็น 1-column
Layout แบบ 3-column เมื่อดูบน desktop
layout บน mobile ถูกเปลี่ยนเป็นแบบ top-down
เว็บแบบ responsive เมื่อลดความกว้างของเบราเซอร์ลงแต่ละกล่องจะเรียงใหม่จากบนลงล่าง ซึ่งจะเหมือนกับดูบน mobile

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

เลือกจากขนาดภาพที่ WordPress เซตไว้ให้

ถึงแม้ว่าดูเหมือนว่าทุกอย่างจะอัตโนมัติสำหรับคุณ แต่มีข้อต้องระวังเล็กน้อย เวลาที่คุณใส่รูปภาพเข้าไปในบทความ(หรืออัพโหลดไฟล์ไปที่ media) WordPress จะสร้างไฟล์หลายไฟล์เผื่อไว้ให้คุณเลือกมีขนาด Thumbnail, Small, Medium และ Full Size คุณควรจะเลือกขนาดของไฟล์จาก option เหล่านี้ อย่าไปปรับขนาดของรูปเองเพราะจะทำให้การเซตอัตโนมัติเปลี่ยนไป และอาจจะทำให้ google มองว่ารูปนั้นไม่ responsive คืออาจล้นหน้าจอมือถือ(ทั้งๆที่คุณทดสอบดูแล้วว่าไม่ล้น) ที่ผมใช้คำว่า “อาจจะ” เพราะว่าใน seo tool ออนไลน์บางแห่งจะเตือนเช่นนี้ ซึ่งกูเกิ้ลจะซีเรียสในกรณีมากน้อยขนาดไหนผมไม่รู้

มีเว็บไซต์ออนไลน์หลายแห่งที่ช่วยวิเคราะห์ให้ seo score ในหลายๆองค์ประกอบ ซึ่งรูปภาพก็เป็นองค์ประกอบหนึ่ง เว็บที่ผมใช้เป็นประจำคือ sitechecker.pro ซึ่งจะให้คะแนนออกมาในหลายๆส่วนรวมทั้งคำแนะนำ ในหมวด User Experience – Size content to viewport จะบอกถึงภาพที่อาจมีปัญหาล้นกรอบหรือ viewport หากดูบนมือถือ

sitechecker.pro จะช่วยวิเคราะห์ page แนะนำจุดบกพร่อง
ในหมวด user Experience ของ sitechecker.pro สามารถตรวจสอบปัญหาที่อาจเกิดจากความกว้างของภาพล้นเกินกรอบ(viewport) ซึ่งอาจเป็นปัญหากับการดูบน mobile และอาจจะทำให้ seo score ลดลง

ใส่ Caption ให้รูปภาพ

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

อันนี้เป็นส่วนสำคัญที่คนเขียนบทความส่วนมากละเลย คำบรรยายใต้ภาพเป็นส่วนสำคัญที่คนมักอ่านมากกว่าที่คุณไปเขียนบรรยายในพารากราฟ เวลาเราอ่านหนังสือเราก็จะมีพฤติกรรมคล้ายๆกัน เรามักจะอ่านคำบรรยายสรุปใต้ภาพมากกว่าไปอ่านในเนื้อหา เพราะฉะนั้นจงให้ความสำคัญกับ caption และระลึกว่าคุณต้องใส่คำบรรยายภาพไม่ใช่ใส่ข้อความเรียกร้องความสนใจแบบใน social media

การใส่ caption ทำได้ง่ายๆเพียงคลิกที่ใต้รูปภาพแล้วพิมพ์คำบรรยายลงไป

ใช้ Alt Text

สิ่งที่เรียกว่า alt text ดูจะเป็นเรื่องเทคนิคไปหน่อย แต่เป็นสิ่งที่ใส่ได้ง่ายใน WordPress และผู้เริ่มต้นการทำ seo มักจะไม่ให้ความสนใจหรือไม่รู้ว่ามันมีประโยชน์อย่างไร

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

Alternate Text ถูกออกมาให้ใช้กับคนพิการสายตาที่ต้องฟังเสียงจากโปรแกรมอ่านข้อความในเว็บไซต์ ถ้ามีรูปโปรแกรมอ่านเสียงไม่สามารถอ่านได้ จึงมีมาตรฐานอันหนึ่งให้ใส่ข้อความบรรยายรูปภาพไว้ใน tag img เพื่อให้โปรแกรมเสียงอ่านออกมาให้รู้ว่าเป็นรูปอะไร

<img src="https://web.com/image.png" alt="huahin is sea vicinity">

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

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

เว็บ WooCommerce ควรใส่รหัสสินค้าและชื่อสินค้าลงไปใน alt text ของรูปสินค้าหลักเพียงรูปเดียว เพราะนั่นจะเป็นการตอกย้ำว่า page นี้เกี่ยวกับสินค้าตัวนี้

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

สำหรับ Gutenberg ใน WordPress 5.x คุณเพียงแต่คลิกที่รูปภาพแล้วใส่ alt ที่กล่องทางขวา ซึ่งคุณสามารถบรรยายได้เท่าที่คุณต้องการ ถึงแม้จะไม่มีข้อจำกัดแต่กูเกิ้ลแนะนำว่าให้ใส่เฉพาะคำบรรยายที่เกี่ยวกับรูปภาพจริงๆเท่านั้น สั้นๆแต่ได้ใจความ

ใน gutenberg คลิกที่รูปจะมีช่องให้ใส่ alt text
ใส่ Alt Text ที่บรรยายว่าเป็นรูปอะไร ใส่ keyword เฉพาะรูปที่เป็น highlight ของบทความ

ข้อสังเกต

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

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

อันนี้เป็นข้อสังเกตเดียวกับ blogger ทาง seo หลายรายในต่างประเทศและรวมทั้งการทดลองของผมเองด้วย ผมเคยเขียนบทความขนาดหลายหน้ากระดาษ A4 ลงในเว็บไซต์แห่งหนึ่งเมื่อรวมข้อความและรูปภาพแล้วประมาณ 3.5MB โดยที่ขนาดข้อมูลส่วนใหญ่มาจากรูปภาพ เมื่อลดขนาดของรูปภาพลงจนเหลือขนาดข้อมูลสุทธิประมาณ 1.2MB ก็ไม่ได้ทำให้อันดับบน mobile เปลี่ยนไปอย่างมีนัยสำคัญ!

สิ่งที่มีผลต่ออันดับใน google ยังคงเป็นปริมาณ content โดยรวมของทั้งเว็บไซต์และ backlinks จากเว็บไซต์อื่น รวมทั้ง traffic ที่เข้ามาในแต่ละเดือน รายละเอียดทางเทคนิคเล็กๆน้อยๆยังไม่เป็นทำให้เห็นผลที่ชัดเจนนัก(ในตอนนี้)

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

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