Kỹ thuật SEO Ajax

Xin chào mọi người, hôm nay mình xin giới thiệu với các bạn một kỹ thuật trong SEO, đó là SEO Ajax.

Ajax là gì? Theo mình hiểu thì ajax là một kỹ thuật lập trình, lấy dữ liệu từ form người dùng để thực hiện truy vấn mà không vần submit form như thông thường.

Ví dụ: Khi user nhập vào user để đăng ký thành viên, thì lúc này bạn có thể lấy giá trị user đã gõ để truy vấn ngay cho user đó biết username đó có trùng hay chưa mà không để user đó  nhập hết thông tin rồi kiểm tra.

Hoặc là những site về giỏ hàng, họ thường sử dụng ajax, bạn có thể tìm hiểu sâu hơn về kỹ thuật này.

Nhưng điểm yếu của ajax là viết bằng Javascript và một ngôn ngữ đi kèm như php, asp, java,… và chúng ta điều biết js với google là hoàn toàn vô nghĩa, vì nó không thể đọc dữ liệu thuộc về javascript.

Vậy đâu là giải pháp? Những chuyên gia nước ngoài đã tìm ra một kỹ thuật SEO, nói đúng hơn nó là kỹ thuật lập trình Ajax mà khi tắt Javascript nội dung vẫn hiển thị.

Đầu tiên, chúng ta cần có 1 template html cơ bản như sau:

ky-thuat-seo-ajax

Kỹ thuật SEO Ajax cở bản

Tiếp theo, các bạn cần chèn thư viện jquery vào để code ajax và đổi tên file index.html thành index.php

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

Các bạn có thể upload lên host và chèn trên hosting của mình, còn không các bạn có thể dùng thư viện của Google cũng rất tốt.

 

ky-thuat-seo-ajax-1

template html cơ bản SEO Ajax

Khi preview các bạn sẽ thấy 1 page php đơn giản như sau:

 

ky-thuat-seo-ajax-2

View template cơ bản SEO Ajax

Tiếp theo, ta tiến hành lập trình ajax theo 2 bước.

Bước 1: Các bạn tạo thêm 1 file php mới với tên bất kì, mình sẽ đặt là ajax_text.php

Bước 2: Tiến hành code ajax để lấy dữ liệu từ file ajax_text.php đổ vào file index.php

Nội dung trong file ajax_text.php mình chỉ print một vài dữ liệu, ví dụ:

 

ky-thuat-seo-ajax-3

Tạo file để lấy dữ liệu Ajax

Giờ quay lại file index.php, chúng ta tiến hành viết hàm lấy dữ liệu:

 

ky-thuat-seo-ajax-4

Kỹ thuật SEO Ajax

Mình sẽ giải thích về đoạn code ở trên:

1)      Dòng 6 – 10: CSS để nội dung dễ nhìn hơn

2)      Dòng 14: Div có id là noidung để hiển thị dữ liệu lấy từ file ajax_text.php

3)      Dòng 15 – 21: Code ajax lấy dữ liệu từ file ajax_text.php đổ vào div có id noidung

  1. Dòng 16: Khai báo khi website load xong, sẽ chạy hàm bên trong
  2. Dòng 17: Ở đây mình dùng phương thức post, các bạn có thể dung get cũng được, hàm .post mình truyền vào 2 tham số là tên file cần lấy nội dung và nội dung lấy được gán vào biến data
  3. Dòng 18: Biến data sau khi lấy được sẽ đổ vào Div có id là noidung thông qua hàm .html

Đây là kiến thức thiên về lập trình ajax, nếu các bạn không hiểu cũng không nên lo lắng, vì với cách lý giải, bạn có thể làm việc với bộ phận coder dễ dàng hơn, hoặc nhờ sự hỗ trợ của những code tại cty.

Và giờ, ta xem website của chúng ta đã chạy thành công hay chưa?

 

ky-thuat-seo-ajax-5

Phần màu đen chính là dữ liệu ajax

Phần màu đen chính là nội dung của file ajax_text.php

Vậy giờ ta tắt javascript xem có còn đoạn nội dung đó không.

 

ky-thuat-seo-ajax-6

Tắt Javascript dữ liệu ajax sẽ mất đi

Các bạn có thể thấy, điều bất lợi vô cùng của ajax đó là khi tắt javascript nó không thể hiển thị nội dung, và bây giờ, chúng ta sẽ tìm ra giải pháp cho trường hợp này.

Thực tế Google đã hỗ trợ những website chạy ajax, nhưng đa số rất ít người tận dụng và bỏ qua, đó chính là chúng ta xác định cho Google bot định tuyến “_escaped_fragment_”

Ví dụ sau đây sẽ cho các bạn thấy cung cấp định tuyến cho Google như thế nào, tạo một file php mới với nội dung như sau:

 

Kỹ thuật SEO Ajax
Kỹ thuật SEO Ajax


9

10

23197

About Trọng Khiêm

Chào các bạn, mình là Khiêm. Niềm đam mê của mình là SEO và Website Deverloper, rất vui khi được làm quen với tất cả các bạn. Nếu cần hỗ trợ, hãy mail cho mình: buitrongkhiem2010@gmail.com Mình sẽ tư vấn SEO tổng thể website, On Page, Off Page hoặc tư vấn chiến lược khôi phục Website sau khị dính thuật toán của Google. :)
This entry was posted in Seo On Page, Thảo Luận SEO and tagged , , . Bookmark the permalink.

2 Responses to Kỹ thuật SEO Ajax

  1. ví dụ sau đâu vậy bạn?

Gửi phản hồi

Bài viết này thuộc về Bùi Trọng Khiêm - ©hocseodelam 2013