Skip to main content

กำลังโหลด...

Southern Whale
รับ SEO Audit ฟรี
SEO 9 นาทีอ่าน

Core Web Vitals คือ? วิธีทำเว็บให้ PageSpeed 90+ (ไม่ต้องเป็น Dev)

Core Web Vitals คือ — อธิบาย LCP, CLS, INP สำหรับเจ้าของธุรกิจ พร้อมวิธีแก้ที่ทีม Dev ใช้ได้จริงและ Tool ฟรีที่ใช้วัด

Core Web Vitals คืออะไร

ปัญหาที่ธุรกิจประเภทนี้พบจริง

Pattern ที่เห็นซ้ำที่สุดเมื่อลูกค้าเข้ามาขอ Performance Audit — เว็บที่ Desktop ดีพอใช้ (PageSpeed 75-85) แต่ Mobile ตกอยู่ที่ 28-45 ปัญหาคือ 70-85% ของ Traffic จริงมาจาก Mobile โดยเฉพาะธุรกิจท่องเที่ยวและบริการในภาคใต้

ปัญหาที่ Trigger ให้ลูกค้าติดต่อเรา:

  1. โรงแรมบูทีคในกะรนและป่าตอง Google Search Console แจ้ง “Poor URLs” 60-80% หลัง Core Web Vitals กลายเป็น Ranking Factor (2021) แต่ไม่รู้จะแก้ยังไง LCP เฉลี่ย 5.5-7.2 วินาที CLS 0.35-0.48 เพราะ Hero Image 3-5MB ที่ไม่ได้ Optimize
  2. คลินิกในกรุงเทพและภูเก็ต ที่ใช้ Page Builder (Elementor/Divi) PageSpeed Mobile ตันที่ 38-50 ลง Plugin Speed Optimize 4-5 ตัวก็ไม่ขยับเกิน 60 จ่ายค่า Plugin License เดือนละ $30-50 รวมแล้วเสียเงินโดยไม่ได้ผล
  3. E-commerce Shopify ที่ติด App มากเกินไป (Reviews, Pop-up, Upsell, Chat, Loyalty) — แต่ละ App โหลด JS เพิ่ม 50-150KB INP เกิน 400ms ทำให้ Mobile Conversion ตก 22%
  4. เว็บข่าวและสื่อท้องถิ่น ที่ Ads + Tracker หนัก โหลดทับซ้อนกัน LCP ทะลุ 8 วินาที Bounce Rate Mobile 78%

ตัวเลขที่ต้องเข้าใจ: Google CrUX Data พิสูจน์แล้วว่า LCP ลดลง 1 วินาที Conversion เพิ่ม 8-12% และ INP < 200ms เพิ่ม Engagement Time 15-25% — Performance ไม่ใช่ Vanity Metric แต่เป็นรายได้

ทำไม Solution ทั่วไปไม่ได้ผล

คำแนะนำที่ลูกค้ามักเจอก่อนมาหาเราคือ “ลง WP Rocket” หรือ “เปิด Cloudflare APO” — ซึ่งช่วยได้ระดับ 5-15 คะแนน PageSpeed แต่ไม่แก้ Root Cause:

  • Cache แก้ TTFB ได้ แต่ไม่แก้ JavaScript Bundle ที่หนัก
  • Image Compression Plugin บีบ JPEG ได้ 30-40% แต่ไม่เปลี่ยนไป WebP/AVIF ที่ลดได้ 80-95%
  • Page Builder ใส่ Inline CSS + DOM Node เยอะ — ไม่มี Optimization Plugin ไหนแก้ได้
  • Third-party Script (Analytics, Chat, Pixel) คือ Tax ที่ทุก Plugin Optimize ไม่แตะ

ถ้าคุณมาใช้บริการเรา จะวิเคราะห์และแก้ยังไง

เริ่มจาก Performance Diagnosis ด้วย CrUX Real User Data (ไม่ใช่ Lab Test) เพราะ Google ใช้ CrUX ในการ Rank — ใช้ PageSpeed Insights + Google Search Console + WebPageTest วัด Median LCP, CLS, INP ของเว็บคุณ Cross-reference กับคู่แข่ง

จากนั้นวาง 4 เสาหลักของ Performance Strategy:

1. Image Pipeline Overhaul (แก้ LCP ได้ 50-70%)

Convert ทั้งหมดเป็น WebP/AVIF (JPEG 2MB → WebP 200KB → AVIF 100KB) Implement Responsive Image (srcset) ที่โหลด Size ตามจอ Lazy Load สำหรับ Below-the-fold Reserve Width/Height ทุกภาพป้องกัน CLS ใช้ CDN เช่น Cloudflare Images หรือ Imgix ที่ Convert + Resize ตอน Request

2. JavaScript Diet (แก้ INP + LCP)

Audit Third-party Script — Hotjar, Intercom, Chat Widget, Pixel ทุกตัวคือ Performance Tax พิจารณาความจำเป็นจริง Defer Non-critical JS Implement Code Splitting (Next.js/Astro ทำ Auto) สำหรับ WordPress ใช้ Plugin Async JS แต่ระวังจะแตก

3. Server Response + CDN (แก้ LCP)

Target TTFB < 600ms — Upgrade จาก Shared Hosting → VPS หรือดีกว่าคือย้ายไป Edge (Cloudflare Pages, Vercel) Enable Server-level Cache (Nginx FastCGI สำหรับ WordPress) ใช้ Cloudflare APO ถ้ายังใช้ WordPress

4. Stack-Level Decision

ถ้าเว็บคุณติดที่ 70-80 PageSpeed ไม่ขยับเกินนั้น Root Cause มักจะเป็น Stack — Page Builder หรือ Plugin Bloat การแก้ยั่งยืนคือ Migrate ไป Modern Stack อย่าง Astro ที่ PageSpeed 95+ เป็น Default ไม่ใช่ Stretch Goal

กระบวนการทำงาน (4-8 สัปดาห์)

สัปดาห์ที่ 1: Diagnosis + Baseline

  • Lab Test (PageSpeed Insights, WebPageTest)
  • Real User Data (GSC Core Web Vitals Tab, CrUX Report)
  • Identify Top 5 Pain Points + Quick Wins
  • Deliverable: Performance Audit Report + Prioritized Action Plan

สัปดาห์ที่ 2-3: Quick Wins (Image + Cache)

  • Bulk Convert Images → WebP/AVIF (ใช้ Squoosh, ImageOptim, หรือ Server-side Pipeline)
  • ใส่ Width/Height + Lazy Loading
  • Setup CDN (Cloudflare Free Tier เพียงพอ 90% ของเคส)
  • Implement Page Cache + Object Cache

สัปดาห์ที่ 4-5: JS Optimization

  • Audit + Remove Unused JS
  • Defer Non-critical Scripts
  • Move Heavy Third-party ไป Web Worker (Partytown สำหรับ Astro)
  • Reduce Web Font Files (Subset + Preload Critical)

สัปดาห์ที่ 6-7: CLS + INP Fix

  • Reserve Space ทุก Image, Video, Iframe, Ad
  • Font Display Strategy (optional/swap + preload)
  • Reduce Main Thread Work
  • Replace Heavy Widget (Disqus → Giscus, Live Chat → Lighter)

สัปดาห์ที่ 8: Monitor + Documentation

  • Setup Performance Monitoring (SpeedCurve, DebugBear, หรือ Free: GSC + PageSpeed)
  • Knowledge Transfer + Maintenance Playbook

Pitfalls ที่ต้องระวัง

1. Optimize เฉพาะ Homepage ทิ้ง Inner Pages — Google Rank ทุกหน้า ไม่ใช่แค่ Homepage Inner Page ที่ Convert จริง (Product, Service, Booking) ต้อง Performance ดีพอกัน

2. ลบ Plugin แล้วเว็บแตก — บาง Plugin Inject CSS/JS ที่ Page Template ใช้อยู่ ต้อง Audit Dependency ก่อนลบ และ Test ทุกหน้าหลังลบ

3. เชื่อ Lighthouse Score 100 แล้วเลิกทำ — Lab Score ต่างจาก Real User Performance (CrUX) ต้อง Monitor 28-day Trailing Data ใน GSC ถึงจะรู้ผลจริง

Expected Outcomes และขั้นตอนต่อไป

หลัง 8-12 สัปดาห์ของ Performance Project ลูกค้าที่ Implement ครบเห็น:

  • PageSpeed Mobile: 35-50 → 88-96
  • LCP: 5-7s → 1.2-2.2s
  • CLS: 0.30+ → < 0.05
  • INP: 350-500ms → < 200ms
  • Mobile Conversion +15-40% (Direct Impact จาก Performance)
  • Google Search Console “Good URLs” 80-95% ของหน้า

ถ้าเว็บคุณ PageSpeed Mobile < 60 และอันดับห่วย ขอ SEO Audit — เราให้ Benchmark + Action Plan ภาษาไทย หรือถ้าตัดสินใจแล้วว่าต้องการ Migrate ไป Modern Stack ดู Web Development

คีย์เวิร์ดที่เกี่ยวข้อง

core web vitals คือ, core web vitals, page speed insights, wordpress speed