Indexing & Rendering - Google đọc HTML vs JavaScript - Cách dùng URL Inspection

1. Định nghĩa và nguyên lý

Indexing và Rendering là hai giai đoạn khi Googlebot xử lý trang web. Indexing là lưu trữ và lập chỉ mục nội dung, rendering là xử lý HTML cùng JavaScript để hiểu nội dung người dùng thấy. Nội dung HTML được index ngay khi crawl, nội dung JS có thể trễ 1-3 ngày hoặc lâu hơn.

Indexing & Rendering là hai giai đoạn quan trọng trong quá trình Googlebot xử lý trang web:

• Indexing: Quá trình Google lưu trữ và lập chỉ mục nội dung để hiển thị trong kết quả tìm kiếm.
• Rendering: Quá trình Googlebot đọc và xử lý mã nguồn trang web, bao gồm HTML và JavaScript, để hiểu nội dung cuối cùng mà người dùng nhìn thấy.

1.1 Google đọc HTML

HTML được Googlebot xử lý trực tiếp mà không cần chạy bất kỳ mã nào. Nội dung có sẵn trong HTML sẽ được lập chỉ mục ngay khi crawl.

1.2 Google đọc JavaScript

Googlebot có thể thực thi JavaScript để render nội dung động, nhưng quá trình này phức tạp và tốn thời gian hơn.

2. Ứng dụng thực tế

Hiểu cách Google đọc HTML so với JavaScript giúp bạn quyết định ba việc. Đưa nội dung quan trọng vào HTML để được lập chỉ mục nhanh, để JavaScript lo phần tương tác không ảnh hưởng SEO, và tránh lỗi hiển thị khi bot không chạy được mã. Ranh giới ở đây là nội dung nào bạn cần được index.

Hiểu cách Google đọc HTML vs JavaScript giúp SEO:

• Xác định nội dung quan trọng nên render bằng HTML để được index nhanh.
• Sử dụng JavaScript cho các phần tương tác không quan trọng cho SEO.
• Tránh lỗi hiển thị khi Googlebot không thực thi được JS.

3. Kỹ thuật và cấu trúc thực tế

Kỹ thuật và cấu trúc thực tế nhằm để Googlebot thấy đúng nội dung, kiểm bằng URL Inspection Tool. Nội dung quan trọng, meta tag, canonical và schema markup phải nằm trong HTML. Với JavaScript, dùng SSR hoặc pre-render, lazy-load ảnh nhưng không ẩn nội dung chính, rồi so View Source với Inspect Element.

URL Inspection Tool trong Google Search Console giúp xác định cách Googlebot thấy trang:

Để xử lý “Kỹ thuật và cấu trúc thực tế” mà không phá vỡ phần đang chạy, Khóa Học SEO Master đi vào thứ tự thay đổi và cách theo dõi sau mỗi lần sửa.

3.1 Kiến trúc HTML chuẩn

Ba nguyên tắc của một kiến trúc HTML chuẩn đều xoay quanh việc đặt đúng chỗ. Nội dung quan trọng phải xuất hiện thẳng trong phần thân, các thẻ meta cùng canonical và schema phải nằm trong HTML, và giảm phụ thuộc vào JavaScript cho những phần quan trọng với SEO. Schema sinh bằng script là chỗ hay hỏng.

• Nội dung quan trọng nên xuất hiện trực tiếp trong <body>.
• Meta tag, canonical, schema markup phải nằm trong HTML.
• Giảm phụ thuộc vào JavaScript cho SEO-critical content.

3.2 Kiến trúc JavaScript

Ba nguyên tắc cho phía JavaScript đều nhằm để bot vẫn thấy được nội dung. Dùng kết xuất phía máy chủ hoặc dựng sẵn, dùng tải trễ cho ảnh và video nhưng không ẩn nội dung chính, và kiểm bằng cách so mã nguồn gốc với phần tử đã dựng. Phép so đó cho biết ngay bot thấy gì.

• Render server-side (SSR) hoặc pre-render để Google dễ index.
• Sử dụng lazy-load cho hình ảnh, video nhưng không ẩn nội dung chính.
• Kiểm tra JS bằng Chrome DevTools → “View Source” vs “Inspect Element”.

4. Cách dùng URL Inspection kiểm tra

Cách dùng URL Inspection để kiểm tra là mở Google Search Console, vào URL Inspection và nhập URL. Chọn View Crawled Page để xem HTML Googlebot nhận, rồi View Rendered Page để thấy nội dung render từ JavaScript. So sánh hai kết quả để chắc nội dung quan trọng xuất hiện đúng.

1. Truy cập GSC → URL Inspection → nhập URL cần kiểm tra.
2. Chọn “View Crawled Page” để xem HTML Googlebot nhận.
3. Chọn “View Rendered Page” để thấy nội dung render từ JavaScript.
4. So sánh hai kết quả, đảm bảo nội dung quan trọng xuất hiện trong HTML hoặc được render chính xác.

5. Checklist triển khai

Checklist triển khai cho Indexing & Rendering gồm việc cần làm và câu hỏi kiểm tra. Xác định nội dung cần index nhanh, kiểm nó có trong HTML, kiểm JavaScript không chặn crawl, bật SSR nếu dùng SPA và test bằng URL Inspection Tool. Sau đó so View Crawled Page với View Rendered Page, lỗi JavaScript và schema.

Giữa bản kế hoạch và website đang chạy còn người duyệt, hệ thống cũ và thời gian. Đào Tạo SEO đưa cả ba vào phần thực hành.

5.1 Checklist task cho Indexing & Rendering

Sáu việc trong checklist đi từ xác định tới đo. Xác định nội dung nào cần được lập chỉ mục nhanh, kiểm nó có trong HTML không, kiểm JavaScript không chặn bot, bật kết xuất phía máy chủ nếu dùng ứng dụng một trang, kiểm bằng công cụ kiểm tra URL, và đo thời gian dựng cùng tốc độ tải.

• Xác định nội dung quan trọng cần index nhanh.
• Kiểm tra nội dung quan trọng có trong HTML không.
• Kiểm tra JavaScript không chặn crawl.
• Kích hoạt SSR hoặc pre-render nếu dùng SPA.
• Test URL bằng URL Inspection Tool.
• Kiểm tra thời gian render và tốc độ tải trang.

5.2 Checklist task kiểm tra

Năm câu hỏi kiểm đều so giữa bản bot thu thập với bản bot dựng ra. Nội dung quan trọng có trong bản thu thập không, nội dung động có dựng đúng trong bản dựng không, có lỗi JavaScript chặn lập chỉ mục không, liên kết nội bộ và canonical có đọc đúng không, và schema có hiện đúng không.

• Nội dung quan trọng có xuất hiện trong View Crawled Page?
• Nội dung động JS có render đúng trong View Rendered Page?
• Không có lỗi JavaScript gây chặn index?
• Các link internal và canonical được Google đọc đúng?
• Schema markup được hiển thị đúng?

6. Lỗi thường gặp

Bốn lỗi trong bảng đều làm nội dung biến mất khỏi mắt bot. Nội dung chính chỉ tải bằng JavaScript mà dựng không đúng thì không được lập chỉ mục; JavaScript bị chặn hoặc lỗi thì không dựng được; ứng dụng một trang không dựng sẵn thì lập chỉ mục rất chậm; tải trễ quá tay thì bot không thấy gì.

• Nội dung chính chỉ tải bằng JS mà không render đúng → không index.
• JS bị chặn bởi robots.txt hoặc lỗi 404 → Google không thể render.
• SPA không sử dụng SSR hoặc pre-render → delay index lâu.
• Lazy-load quá mức → nội dung không hiển thị với Googlebot.

7. Hiểu lầm thường có

Ba hiểu lầm đều nằm ở hai thái cực. JavaScript vẫn được đọc nhưng phải dựng đúng, chỉ dùng HTML là đủ với nội dung tĩnh nhưng ứng dụng một trang thì không, và Google không lập chỉ mục ngay vì nội dung dựng bằng script có thể mất vài ngày. Vài ngày đó là khoảng trống nhiều người không tính tới.

• “JavaScript không được Google đọc” → Sai, nhưng cần render đúng.
• “Chỉ cần HTML là đủ” → Đúng với nội dung tĩnh, nhưng SPA cần JS.
• “Google index ngay lập tức” → Nội dung JS có thể mất vài ngày để render.

8. Ví dụ thực tế

Ví dụ này cho thấy khoảng cách rất rõ. Blog tĩnh được lập chỉ mục sau một tới hai giờ; ứng dụng một trang thì nội dung chính chỉ xuất hiện sau khi dựng nên mất hai tới ba ngày nếu không kết xuất phía máy chủ. Kiểm bằng công cụ kiểm tra URL cho thấy 70% nội dung không dựng ra.

• Một trang blog tĩnh: Nội dung HTML được index ngay sau 1-2 giờ.
• SPA React: Nội dung chính chỉ xuất hiện sau khi render → index mất 2-3 ngày nếu không SSR.
• Dùng URL Inspection, kiểm tra thấy 70% nội dung JS không render → cần SSR.

9. Kết quả và kinh nghiệm thực tế

Ba kết luận đều gắn với con số cụ thể. Nội dung nằm trong HTML thì lập chỉ mục nhanh và lưu lượng ổn định; nội dung dựng bằng script cần kiểm kỹ, và dùng kết xuất sẵn cải thiện việc lập chỉ mục khoảng 60 đến 80%. Google cũng công bố việc dựng script có thể trễ một tới ba ngày.

• Nội dung quan trọng HTML → index nhanh, traffic ổn định.
• Nội dung JS → cần kiểm tra kỹ, SSR/pre-render → cải thiện index 60-80%.
• Google công bố: rendering JS có thể trễ 1-3 ngày (nguồn: Google Search Central).

10. Lời kết

Hiểu rõ cách Google đọc HTML và JavaScript, kết hợp URL Inspection Tool, là chìa khóa để tối ưu khả năng index và hiển thị nội dung. SEO hiệu quả không chỉ dựa vào HTML tĩnh mà còn phải đảm bảo JavaScript render đúng, tránh chặn crawl và đảm bảo trải nghiệm người dùng mượt mà.