Technical SEO คือ การทำ SEO ที่ต้องอาศัยความรู้เชิงเทคนิคเข้ามาเกี่ยวข้อง ซึ่งอาจมีความยุ่งยากอยู่นิด แต่ถ้าเรามีความเข้าใจส่วนนี้ที่ดีแล้ว จะทำให้การทำ SEO ประสบความสำเร็จได้มากขึ้นทวีคูณ
โดยการทำ Technical SEO จุดประสงค์หลัก ๆ มี 2 ส่วน คือ
- เพื่อให้ Google เข้ามา crawl หรือเข้าถึงข้อมูลหน้าเว็บเราได้ง่ายและสะดวกมากยิ่งขึ้น พูดง่าย ๆ คือเราอำนวยความสะดวกให้ Google มาเก็บเกี่ยวเนื้อหาของเว็บเราได้ดีที่สุดเท่าที่จะเป็นไปได้ เพื่อให้ Google index เว็บเราได้ดียิ่งขึ้น
- มอบประสบการณ์ใช้งานที่ดีต่อผู้ใช้ เช่น เว็บไหลลื่น โหลดเร็ว มีลิงก์นำทาง หรือ Navigation Link ที่ชัดเจน กดไปหน้าต่าง ๆ ได้สะดวก โดยมีจำนวนการคลิกที่น้อยที่สุดเท่าที่จะเป็นไปได้ รวมไปถึงเว็บมีความปลอดภัยด้วย
Technical SEO Checklist เบื้องต้นแบบง่าย ๆ
- ความเร็วของเว็บไซต์ หรือ Page Speed
- Site Structure
- URL Structure
- Mobile Friendly
- SSL Connection
- Structured Data หรือ JSON-LD
- robots.txt
- JavaScript Rendering
จริง ๆ ยังมีอีกมากมายหลายส่วนนะครับ แต่อันนี้ขอเป็นภาพรวมบางส่วนละกันครับ
1. ความเร็วของเว็บไซต์ (Page Speed)
Page Speed ถือว่าเป็นอีกหนึ่งปัจจัยที่สำคัญมากในการทำ Technical SEO เพราะว่าถ้าเว็บเราใช้เวลาโหลดหน้าเว็บนานเกินไป จะทำให้คนหมดความอดทนในการรอหน้าเว็บเรา จนทำให้เขาเหล่านั้นกดออกจากหน้าเว็บเราไปในทันที ซึ่งเป็นการสร้างประสบการณ์การใช้งานของผู้ใช้ที่ไม่ดี หรือ Bad UX
โดยเราสามารถวัดความเร็วหรือ performance ของเว็บผ่าน PageSpeed Insights ได้เลยครับ
ทดสอบ performance ของเว็บใน PageSpeed Insights
ถ้าเว็บเรามี technical performance ที่ดี มันจะขึ้นสีเขียวเกือบทุกตัว แต่ไม่จำเป็นต้องได้ครบ 100 หรือสีเขียวทุกตัวนะครับ บางเว็บที่คอนเทนต์เยอะ ๆ มีการใช้ JavaScript หรือ animation ต่าง ๆ หนัก ๆ ก็เป็นไปได้ยากที่จะเขียวหมด แต่ถ้าเป็นไปได้ก็จะดีมาก
ดังนั้นเราจะต้อง optimize การโหลดของหน้าเว็บเราให้เร็วและไหลลื่นมากที่สุดเท่าที่จะเป็นไปได้ โดยมาตรฐานแล้ว ช้าสุดไม่ควรเกิน 3 วินาที รวมไปถึง Core Web Vitals ก็ต้องดีหรือผ่านเกณฑ์ด้วย ซึ่งเหล่านี้เป็น metric ที่วัดผลได้
2. Site Structure (โครงสร้างของเว็บไซต์)
นอกเหนือจากเว็บของเรามีโครงสร้างที่ดี เป็นมิตรและเอื้ออำนวยให้ Search Engine เข้ามาเก็บข้อมูลได้อย่างสะดวก ยังมีอีกส่วนที่สำคัญมาก ๆ คือ ต้องออกแบบโครงสร้างให้เป็นมิตรกับผู้ใช้งานด้วยเช่นกัน เพื่อสร้างประสบการณ์ใช้งาน หรือ User Experience ที่ดีที่สุด
ซึ่งการปรับโครงสร้างเว็บไซต์นั้นแน่นอนว่าไม่มีอะไรที่สมบูรณ์แบบตั้งแต่ต้น แต่ก็คงดีกว่าแน่ ๆ ถ้าเราวางแผนส่วนนี้มาให้ดีตั้งแต่แรก จะได้ไม่ต้องปวดหัวหรือรื้อโครงสร้างในภายหลัง
ตัวอย่างการวางแผน Site Structure สำหรับ Technical SEO
หน้าสำคัญ ๆ ไม่ควรอยู่ลึกเกินไป
การออกแบบโครงสร้างเว็บไซต์ที่ดี ควรแบ่งเส้นทางของ URLs ได้แบบชัดเจน โดยแยกหมวดหมู่ หรือ Category ของแต่ละหน้าออกให้ชัดเจน เพื่อรองรับ short-tail และ middle-tail keywords
ถ้าเป็นเว็บ e-commerce ก็มักจะเป็นพวก commercial keyword ที่วางไว้หน้าหมวดหมู่ ซึ่งสัมพันธ์กับคีย์เวิร์ดที่เกี่ยวข้องกัน ทั้งส่วนที่เป็น commercial / transactional intents เช่น หน้าขายสินค้าหรือบริการ และ informational intent เช่น blog หรือ news
พอ user เสิร์ชคำสั้น ๆ ที่เกี่ยวข้องเข้ามา เราก็จะให้มาเจอหน้า category นี่แหละครับ เพราะมันรวมความเกี่ยวข้องของหลาย intent ไว้ในหน้านี้ ซึ่งส่วนนี้ผมคิดว่ามีความเกี่ยวข้องกับ Semantic Search ด้วยครับ
ลองดูเว็บขายสินค้าชื่อดังอย่าง Big C จะเห็นว่าก็จะวาง category ไว้ประมาณนี้
ตัวอย่างโครงสร้าง Category ของเว็บ Ecommerce
ตัวอย่าง URL สำหรับหน้า Category:
https://www.bigc.co.th/category/dry-cat-food
อันนี้จากประสบการณ์ของผมนะครับ
โดยหมวดหมู่แบบนี้อาจไม่ได้ตายตัวเหมือนภาพด้านบน ซึ่งขึ้นอยู่กับขนาดหรือบริบทของเว็บไซต์นั้น ๆ ถ้าเว็บใหญ่ก็จะมีหมวดหมู่ต่าง ๆ เยอะและมี Navigation ที่ซับซ้อนมากกว่าเว็บไซต์ขนาดเล็ก
3. URL Design & Structure
โครงสร้าง URLs ที่ดีมีชัยไปกว่าครึ่ง ทำไมผมถึงบอกแบบนี้ ก็เพราะว่าการออกแบบ URLs นั้นเป็นทั้งศาสตร์และศิลป์อีกอย่างเลยก็ว่าได้
ถ้าเราดีไซน์ URL ได้ดี จะส่งผลดีต่อทั้ง Search Engine ให้ทำความเข้าใจเว็บเราได้ง่ายและดียิ่งขึ้น และสำคัญเลยก็คือทำให้ผู้ใช้งานเว็บเรามีประสบการณ์การใช้งานหน้าเว็บที่ดียิ่งขึ้นเช่นกัน หากเราออกแบบ URL ไว้ดี มีคีย์เวิร์ดและเป็นหมวดหมู่ที่ชัดเจน
แนวทางการออกแบบ URL ที่ดีและเป็นมิตรต่อ SEO
บทความแนะนำ: การออกแบบ SEO Friendly URLs
4. Mobile Friendly
อย่างที่ทราบกันดีว่า ในปัจจุบัน Google ให้ความสำคัญกับการแสดงผลบนมือถือมากที่สุด มากกว่าอุปกรณ์แบบอื่น ๆ ดังนั้นหน้าเว็บเราควรจะเป็นมิตรกับผู้ใช้งานบนอุปกรณ์เคลื่อนที่ เช่น มือถือหรือแท็บเล็ต
โดยปกติแล้วเว็บส่วนใหญ่ในปัจจุบันก็ Mobile-friendly หรือ Mobile Responsive กันหมดแล้วครับ
ตัวอย่างการทดสอบ Mobile Friendly สำหรับ Technical SEO
5. SSL Connection
นี่ก็เป็นมาตรฐานไปแล้วครับ ที่ทุกเว็บไซต์ควรจะมีก็คือ การติดตั้ง SSL Certificate บนเว็บไซต์ของเรา
SSL จะช่วยทำให้เว็บเรามีความปลอดภัยสำหรับผู้ใช้งานมากยิ่งขึ้น ซึ่งเป็นการสร้างประสบการณ์ใช้งานที่ดีอย่างไม่ต้องสงสัย เพราะว่ามันช่วยให้ผู้ใช้งานเว็บเรารู้สึกอุ่นใจได้มากขึ้นนั่นเอง
วิธีดูว่าเว็บไซต์ไหนมี SSL ติดตั้งหรือไม่ ก็คือเว็บนั้นมีโปรโตคอล https หรือสังเกตง่าย ๆ คือมีสัญลักษณ์กุญแจปรากฏอยู่บน address bar ของ URL
ตัวอย่าง SSL Certificate และ HTTPS สำหรับความปลอดภัยของเว็บไซต์
6. Structured Data
Structured Data เรียกได้อีกแบบว่า Schema Markup เป็นฟอร์แมตที่ช่วยให้ Google เข้าใจเกี่ยวกับหน้าเว็บเพจของเรามากยิ่งขึ้น
เมื่อ Google เข้าใจหน้าเว็บของเรามากขึ้น ก็มีโอกาสที่หน้าเว็บของเราจะแสดงผลแบบ Rich Snippets ในหน้า SERPs ได้ดีมากยิ่งขึ้น นำมาซึ่งการที่เราได้ส่วนแบ่งพื้นที่ในหน้า Google Search ได้เยอะมากขึ้นอีกด้วย
จากตัวอย่าง Rich Snippets แบบรีวิวในหน้า SERP Google ไม่ได้แสดงผลรีวิวหรือรูปดาวแบบนี้ให้เราอัตโนมัติครับ โดยเจ้าของเว็บไซต์ต้องสร้างหรือกำหนด Structured Data ขึ้นมาเพื่อให้ Google แสดง Rich Snippets ในแบบที่เราต้องการ
ซึ่งตัวอย่างด้านล่างเป็น Structured Data แบบ Review โดยใช้ JSON-LD ซึ่งเป็นรูปแบบที่ Google แนะนำ แต่ Google ก็ได้บอกว่าไม่ได้การันตีเช่นกันว่าจะแสดงผลแบบนี้ให้เราเสมอไป
ตัวอย่าง Structured Data แบบ JSON-LD:
<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Product",
"image": "http://www.example.com/iphone-case.jpg",
"name": "The Catcher in the Rye",
"review": {
"@type": "Review",
"reviewRating": {
"@type": "Rating",
"ratingValue": "4"
},
"name": "iPhone 6 Case Plus",
"author": {
"@type": "Person",
"name": "Linus Torvalds"
},
"datePublished": "2016-04-04",
"reviewBody": "I loved this case, it is sturdy and lightweight. Only issue is that it smudges.",
"publisher": {
"@type": "Organization",
"name": "iPhone 6 Cases Inc."
}
}
}
</script>
จากตัวอย่างโค้ด JSON-LD ด้านบน เราต้องมีความรู้ด้าน coding ด้วยครับ ถึงจะสามารถออกแบบและกำหนด Structured Data ได้อย่างราบรื่น แต่ถ้าไม่มีความรู้ coding มากเท่าไหร่นัก ก็สามารถให้ทีม developer ของเราจัดการให้ได้
โดยโค้ดด้านบนจะถูกนำไปวางไว้ในส่วนของแท็ก <head> ... </head> ภายใน HTML code ของหน้าเว็บเพจของเราครับ
เครื่องมือแนะนำ: Rich Results Test สำหรับทดสอบ Rich Snippets ของเว็บไซต์
7. robots.txt
robots.txt เป็นไฟล์ที่ใช้บอก Search Engine เช่น Google ว่าส่วนไหนของเว็บไซต์ที่เราไม่อยากให้ bot เข้ามาเก็บเกี่ยวหรือ crawl
เช่น หน้า Admin, หน้า Dashboard, หน้า Private หรือหน้าอื่น ๆ ที่ไม่อยากให้คนภายนอกเห็นและไม่ต้องการให้นำไป index แล้วโชว์ในหน้า SERPs
ตัวอย่างไฟล์ robots.txt
User-agent: *
Disallow: /admin/
Disallow: /private/
Allow: /images/
Sitemap: https://www.example.com/sitemap.xml
8. JavaScript Rendering / Blocking
สำหรับเว็บไซต์สมัยใหม่ที่ใช้ JavaScript เป็น Tech Stack หลักในการสร้างหรือแสดงผลเนื้อหา แบบ CSR หรือ Client-Side Rendering ปัญหาคลาสสิกที่คนทำ Technical SEO ต้องเจอเลยก็คือ “ปัญหาการแสดงผลเนื้อหาที่ไม่ครบ”
ซึ่งปัญหาส่วนใหญ่มักจะเกิดจากฝั่งเว็บไซต์ของเราเอง ที่มีโค้ด JavaScript บางอย่างไปบล็อก resources ที่จำเป็น จนทำให้ Crawler หรือ Bots ของ Google ไม่สามารถ render หน้าเว็บเพจนั้น ๆ ของเราออกมาได้อย่างสมบูรณ์
อ่านเพิ่มเติม: JavaScript SEO
อย่างเช่นตัวอย่างด้านล่าง จะเห็นความแตกต่างระหว่างหน้าที่ Google render ได้สมบูรณ์ กับหน้าที่ render ได้ไม่ครบเพราะอาจมีปัญหาเรื่อง JavaScript ครับ
ตัวอย่างเปรียบเทียบหน้าเว็บที่ถูก render ด้วย JavaScript และผลกระทบต่อ Googlebot (ที่มาของภาพ: Sitebulb)
สรุป
ปัจจัยในการทำ Technical SEO เหล่านี้ที่ได้อธิบายไปนั้น สำหรับผู้เริ่มต้นให้ค่อย ๆ ทำความเข้าใจไปก่อนครับ ซึ่งผมก็หวังว่าจะทำให้เพื่อน ๆ มองภาพรวมในส่วนนี้ออก แล้วไปค้นคว้าด้วยตนเองเพิ่มเติมได้เป็นอย่างดีครับ
หากเพื่อน ๆ หรือท่านเจ้าของธุรกิจสนใจให้เราออกแบบโครงสร้างเว็บ รวมถึงไปถึง Technical SEO Service แบบครบจบในที่เดียว สามารถปรึกษาหรือสอบถามเพื่อติดต่อเราได้เลยครับ
