7 สิ่งสำคัญ SEO ที่นักออกแบบเว็บไซต์ทุกคนต้องรู้

เผยแพร่แล้ว: 2017-09-05

นักออกแบบเว็บไซต์และผู้เชี่ยวชาญด้าน SEO มักจะหัวเสีย

ทำไม

เพราะในขณะที่องค์ประกอบทั้งสองนี้มีความสำคัญอย่างยิ่งต่อเว็บไซต์ใด ๆ แต่บางครั้งก็ทำงานร่วมกัน

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

หากปราศจากการออกแบบ เว็บไซต์ก็จะถูกประเมินค่าต่ำไป แต่หากไม่มี SEO ผู้อ่านจะไม่มีวันค้นพบแม้แต่เว็บไซต์ที่ออกแบบมาอย่างยอดเยี่ยม

เลย์เอาต์โดย flywheel SEO Essentials แล็ปท็อปบนโต๊ะโดยเปิดเว็บเพจ Google และหนังสือปากกาและอุปกรณ์มือถือ

มีวิธีแก้ไขความขัดแย้งหรือไม่?

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

1. ให้เสิร์ชเอ็นจิ้น “อ่าน” ภาพของคุณ

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

แท็ก HTML <img> จะบอกเครื่องมือค้นหาว่ามีรูปภาพอยู่ อย่างไรก็ตาม เนื้อหาที่แท้จริงของรูปภาพนั้นไม่สามารถอ่านได้สำหรับบอทของเครื่องมือค้นหา

แล้วเราจะปล่อยให้เสิร์ชเอ็นจิ้น "อ่าน" รูปภาพนั้นได้อย่างไร?

WordPress Media Manager ช่วยให้เราสามารถเปลี่ยนชื่อและข้อความแสดงแทนของรูปภาพใดๆ ที่เราใช้

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

ต้องการเพิ่มสื่อในเว็บไซต์ของคุณหรือไม่? เรียนรู้วิธีสร้างแกลเลอรีวิดีโอ WordPress ด้วยบทช่วยสอนนี้!

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

สิ่งนี้ช่วย SEO สำหรับหน้านั้น และยังช่วยให้รูปภาพปรากฏในการค้นหาประเภทเพิ่มเติม: การค้นหารูปภาพ

2. ตรวจสอบให้แน่ใจว่าคุณได้รับการปรับให้เหมาะสมสำหรับการเข้าถึงมือถือ

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

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

เลย์เอาต์โดยมู่เล่ SEO Essentials ผู้หญิงกับกาแฟเย็นบนโทรศัพท์มือถือ

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

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

3. ใช้แบบอักษรของเว็บและ HTML เพื่อสร้างการออกแบบที่รวบรวมข้อมูลได้

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

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

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

4. แทรก div ที่ขยายได้เพื่อรวมการออกแบบที่เรียบง่ายเข้ากับเนื้อหาที่ปรับให้เหมาะสม

หากคุณรู้สึกทึ่งกับการออกแบบที่เรียบง่ายแต่ไม่แน่ใจว่าจะใส่ข้อความสำหรับ SEO ในหน้าอย่างไร ให้ฟังเลย!

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

คาดเดาอะไร: ผู้เชี่ยวชาญด้าน SEO ของคุณยังไม่มีความสุข

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

ข้อความนี้สามารถรวบรวมข้อมูลได้โดยเครื่องมือค้นหา อย่างไรก็ตาม เนื่องจากจะมองไม่เห็นจนกว่าจะคลิก คุณจึงยังคงรักษาการออกแบบที่เรียบง่ายไว้

เลย์เอาต์โดยคนสำคัญของ SEO มู่เล่ที่เดสก์ท็อป Mac ที่ทำงานเกี่ยวกับโค้ด

5. รหัสด้วย HTML5 และ CSS3 สำหรับฟังก์ชันไซต์ขั้นสูง

มีข้อดีหลายประการในการใช้ HTML5 และ CSS3 เฉพาะเจาะจงมากขึ้นสำหรับหัวข้อของวันนี้ ภาษามาร์กอัปที่ปรับปรุงแล้วทั้งสองนี้สามารถมีผลกระทบอย่างชัดเจนต่อ SEO ของหน้าเว็บ

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

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

ดูบทช่วยสอนที่ยอดเยี่ยมนี้เกี่ยวกับวิธีสร้างการออกแบบ 3 มิติด้วยคุณสมบัติการแปลง CSS3!

6. ปรับการออกแบบให้เหมาะสมเพื่อการตอบสนองที่รวดเร็ว

ในปี 2010 Google ประกาศว่าพวกเขาจะรวมความเร็วไซต์เป็นส่วนหนึ่งของอัลกอริทึมการจัดอันดับ ตั้งแต่นั้นมา ความเร็วของเว็บไซต์ก็มีความสำคัญมากขึ้นเรื่อยๆ ใน SEO

ดังนั้นการออกแบบของคุณจะทำให้เว็บไซต์ของคุณทำงานได้อย่างรวดเร็วได้อย่างไร

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

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

(หมายเหตุ: ข้อดีอีกประการของการใช้ HTML5 และ CSS3 คือช่วยให้เว็บไซต์ตอบสนองเร็วขึ้น อีกเหตุผลหนึ่งที่เหมาะสำหรับ SEO!)

7. ร่วมทีมกับผู้สร้างเนื้อหาที่ยอดเยี่ยม

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

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

บทสรุป

เลย์เอาต์โดย Flywheel SEO Essentials แท็บเล็ตบนโต๊ะพร้อมแผนภูมิการวิเคราะห์และข้อมูลบนหน้าจอ

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

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

ใช้เคล็ดลับ SEO เหล่านี้ในการออกแบบเว็บของคุณ แล้วคุณจะเห็นผลลัพธ์ที่ดีกว่าที่เคย!

พร้อมที่จะเรียนรู้สิ่งใหม่ ๆ แล้วหรือยัง? ตรวจสอบบทความเหล่านี้:

  • 3 เหตุผลที่จัดการโฮสติ้ง WordPress นั้นสมบูรณ์แบบสำหรับธุรกิจของคุณ
  • กุญแจสำคัญในการจัดการไซต์ WordPress หลายไซต์
  • คู่มือเริ่มต้นสำหรับ SEO พื้นฐานและการเขียนเนื้อหาบน WordPress