Hướng dẫn cấu hình amp wordpress 2023

Cách đây 2 tháng vào ngày 24/2016 Google đã chính thức công bố thuật ngữ Google AMP nhắm đến việc tối ưu kết quả tìm kiếm trên thiết bị di động.

Có thể nói Google AMP chính là động thái đáp trả sau khi Facebook công bố chức năng Facebook Instant Articles (chức năng hiển thị nội dung trên thiết bị di động).

Vậy Google AMP là gì?

Google APM viết tắt của Accelerated Pages Mobile được hiểu là trang dành cho thiết bị di động được tăng tốc. Trang dành cho thiết bị di động được tăng tốc (AMP) là một sáng kiến mã nguồn mở để làm cho các trang web tải nhanh và có giao diện đẹp trên thiết bị di động, thậm chí khi mạng internet kết nối chậm.

Google cũng tuyên bố rằng nếu trang web của bạn tuân thủ AMP thì sẽ có lợi cho các trang này trong kết quả tìm kiếm của Google.

Nếu các bạn để ý thì thấy gần đây trong trang Google Webmasters (Search Console) xuất hiện thêm một mục có tên là “Trang dành cho thiết bị di động được tăng tốc“.

Hướng dẫn cấu hình amp wordpress 2023

Ngọc cũng phải nói rằng nếu Google đưa ra một thuật ngữ hay chức năng nào thì chắc chắn điều đó phải có lý do của nó. Vì vậy nếu bạn đang sở hữu một blog, hay một website thì hãy nhanh chóng tìm hiểu thêm về Google AMP và cài đặt nó ngay nhé. (Video phía trên là hướng dẫn đầy đủ nhất dành cho bạn)

Làm thế nào để cài đặt Google AMP cho WordPress?

Để cài đặt Google AMP cho WordPress đơn giản bạn chỉ cần tải và cài đặt plugin AMP do chính Automatic (công ty quản lý WordPress) phát triển. Sau khi cài đặt gần như bạn không cần thiết lập thêm bất cứ điều gì.

Sau đó, để kiểm tra xem các trang AMP đã hoạt động hay chưa, hãy truy cập một bài viết bất kỳ và thêm “/amp” vào sau đường dẫn của bài viết đó.

Chẳng hạn, link bài viết là: https://ngocdenroi.com/blog/dich-vu-wordpress-hosting-giam-25.html/amp thì link trang AMP của nó sẽ là: https://ngocdenroi.com/blog/dich-vu-wordpress-hosting-giam-25.html/amp

Hướng dẫn cấu hình amp wordpress 2023
Trang AMP sẽ hiển thị như thế này!

Lưu ý:

  • Bạn nên test trên trình duyệt của điện thoại di động để thấy kết quả hiển thị chính xác nhất.
  • Hiện tại AMP chỉ hỗ trợ các bài viết (posts) mà thôi.

Ngoài ra vì hầu như chúng ta đều đang sử dụng plugin Yoast SEO do đó để Google AMP hoạt động tốt hơn Ngọc khuyên bạn nên cài ngay plugin Glue for Yoast SEO & AMP để nó tự động nhận các dữ liệu meta của website.

Sau khi cài đặt plugin Glue for Yoast SEO & AMP, tại menu SEO sẽ có thêm mục AMP.

Trong đó ở tab post types bạn cài đặt như hình dưới đây.

Hướng dẫn cấu hình amp wordpress 2023

Tab Design bạn có thể upload một AMP icon, cài đặt màu chữ,… cho trang AMP nhé.

Hướng dẫn cấu hình amp wordpress 2023

Tab Analytics bạn dán cái mã Google Analytics vào và nhấn Save Changes kích hoạt và theo dõi lưu lượng truy cập cho các trang AMP trên website WordPrees.

Hướng dẫn cấu hình amp wordpress 2023

Cách kiểm tra Google AMP

Nếu bạn đang dùng trình duyệt Chrome thì đơn giản chỉ cần vào trang AMP của một post bất kỳ, sau đó nhấn phím Ctrl + Shift + I.

Một cửa sổ nhỏ xuất hiện bên phía tay phải, bạn chọn tab Console và nếu thấy thông báo như hình dưới tức là Google AMP đã hoạt động tốt trên website của bạn.

Hướng dẫn cấu hình amp wordpress 2023

Ngoài ra ban có thể dùng công cụ kiểm tra AMP của chính Google. Chỉ cần nhập đường dẫn trang AMP vào và nhấn check. Kết quả sẽ như hình bên dưới.

Hướng dẫn cấu hình amp wordpress 2023

Lời kết

Như vậy bạn đã hiểu Google AMP là gì, cách hoạt động cũng như cách cài đặt Google AMP cho WordPress rồi. Hy vọng bài viết này sẽ cung cấp được một ít kiến thức tối ưu website/blog WordPress của bạn nhằm tăng thứ hạng trên Google và tiếp cận được nhiều đọc giả hơn!

Bạn sẽ thích: Hướng dẫn cài đặt Facebook Instant Articles cho WordPress

Nếu bạn thấy bài viết hữu ích đừng quên chia sẻ nó đến với những người khác, và đăng ký để nhận được những bài viết sớm nhất từ Ngọc Đến Rồi chấm Com bạn nhé!

AMP thường được nhắc đến khi nói về tốc độ tải web trên thiết bị di động. Vậy AMP là gì? liệu rằng website của bạn đã được cài AMP hay chưa?

Trong bài viết này, chúng ta sẽ cùng tìm hiểu về AMP là gì và cách sử dụng AMP để cải thiện thứ hạng trang web trên kết quả tìm kiếm di động.

Google AMP là gì

AMP viết tắt của Accelerated Mobile Pages là một công nghệ mã nguồn mở của Google, được phát triển để tối ưu hóa tốc độ tải trang web trên thiết bị di động.

Hướng dẫn cấu hình amp wordpress 2023
AMP là gì?

Mục tiêu chính của Google AMP là cung cấp trải nghiệm duyệt web nhanh chóng và mượt mà cho người dùng di động bằng cách giảm thời gian tải trang và tối ưu hóa hiệu suất.

Kỹ thuật mà Google AMP áp dụng là gì?

Google AMP sẽ áp dụng 3 kỹ thuật như sau:

Kỹ thuật lazy loading image

Kỹ thuật lazy loading image dịch ra là kỹ thuật tải hình ảnh lười biếng. Kỹ thuật này cho phép trang web trì hoãn việc tải hình ảnh cho đến khi người dùng cuộn trang để xem chúng, giúp tăng tốc độ tải trang và giảm áp lực lên máy chủ.

Ví dụ, khi bạn đọc truyện tranh, trang web sẽ chỉ tải hình ảnh truyện khi bạn cuộn đến vị trí chứa hình ảnh đó.

Kỹ thuật tải javascript bất đồng bộ async

Kỹ thuật tải javascript bất đồng bộ async cho phép website thực hiện đoạn mã và tải dữ liệu ở phía dưới trang web mà không cần chờ cho phần dữ liệu ở phía trên được xử lý hoàn toàn. Nhờ điều này, người dùng có thể giảm thời gian chờ đợi khi trang web tải lên.

Hướng dẫn cấu hình amp wordpress 2023
Kỹ thuật tải javascript bất đồng bộ async

Ví dụ: Khi người dùng truy cập một trang web tin tức, trang web có thể sử dụng kỹ thuật tải JavaScript để tải các quảng cáo từ một nguồn khác. Trong khi quảng cáo đang được tải, người dùng vẫn có thể đọc nội dung tin tức mà không cần chờ đợi hoàn toàn cho quảng cáo tải xong.

Kỹ thuật Content Delivery Network (CDN) để javascript nhanh chóng

CDN là viết tắt của Content Delivery Network, là một mạng lưới máy chủ phân phối nội dung trên web đến người dùng từ các vị trí gần họ.

Hệ thống này giúp cho việc truyền tải dữ liệu nhanh hơn đến người dùng vì dữ liệu được lưu trữ ở các máy chủ gần người dùng.

Ví dụ: Nếu bạn có một trang web với một tệp JavaScript chính có kích thước 100KB được lưu trữ trên máy chủ web của bạn tại Hoa Kì.

Khi người dùng ở Việt Nam truy cập trang web của bạn, CDN sẽ tự động cung cấp tệp JavaScript từ máy chủ CDN gần nhất với họ, giảm độ trễ xuống khoảng 50-100 mili giây.

Xem thêm: Bạn có thể tham khảo bài viết Sitemap là gì? Cách tạo và khai báo Google dễ dàng nhất để cập nhật thêm thông tin nhé.

Lợi ích khi sử dụng AMP

Theo thống kê của Statista, tỷ lệ người dùng thiết bị di động truy cập internet trên toàn thế giới đã tăng lên 60% vào năm 2023.

Hướng dẫn cấu hình amp wordpress 2023
Thống kê tỷ lệ người truy cập Internet thông qua thiết bị di động

Từ bảng trên, nhận thấy ngày nay người dùng ngày càng sử dụng thiết bị di động truy cập internet. Google đã phát triển tính năng để tối ưu website trên thiết bị di động, trong đó có AMP.

AMP giúp cải thiện trải nghiệm người dùng và khuyến khích các nhà phát triển web tập trung vào SEO di động.

Ưu điểm của Google AMP

  • Tăng tốc độ tải trang trên thiết bị di động
  • Tăng khả năng hiển thị cũng như lượt truy cập trang
  • Tối ưu hóa hình ảnh tự động
  • Cải thiện trải nghiệm người dùng trên thiết bị di động
  • Cho phép thiết kế tùy chỉnh
  • Nhiều nền tảng, bao gồm cả Google và Bing đều hỗ trợ AMP
  • Cải thiện hiệu suất máy chủ vì giảm tải trên các hosting server.

Trước đây, AMP là một yếu tố xếp hạng trang web trên thiết bị di động của Google nhưng từ tháng 8 năm 2021, Google đã bỏ AMP là yếu tố xếp hạng trang web trên thiết bị di động.

\>>> Tìm hiểu về SEO tổng quan các kiến thức từ cơ bản đến nâng cao về SEO website

Hạn chế khi sử dụng AMP

Google AMP ra đời năm 2016 trong thời đại mạng 3G, 4G còn yếu, khi đó số lượng di động ngày càng tăng nhưng tốc độ tải trang web trên thiết bị di động vẫn còn chậm, gây ra trải nghiệm người dùng kém.

Vì vậy, google đưa ra giải pháp AMP giúp cho người dùng có trải nhiệm tốt hơn và nhà sáng tạo nội dung website để ý nhiều hơn đến SEO trên di động.

Khi mới ra mắt, google AMP là bắt buộc đối với website tức là khi người dùng truy cập website của bạn, giao diện sẽ không phải giao diện chính mà là giao diện tối ưu của google AMP.

Hướng dẫn cấu hình amp wordpress 2023
Giúp tốc độ tải trang nhanh hơn

Tuy nhiên đến nay khi mạng 5G, 6G xuất hiện, tốc độ tải web nhanh hơn rất nhiều ( nếu bạn SEO tốt, website thường load dưới 3s). Vì vậy Google không còn bắt buộc các trang sử dụng AMP với các trang web nữa.

Hiện tại, chủ website có thể lựa chọn cài đặt AMP hoặc không. Tuy nhiên, cần lưu ý rằng AMP có một số hạn chế cần được hiểu rõ, bao gồm:

  • Đầu tiên phụ thuộc vào bộ nhớ Cache, Google không cung cấp bất kỳ công nghệ cụ thể để làm cho trang web tải nhanh chóng. Chỉ đơn giản đáp ứng truy cập nhanh từ bộ nhớ cache.
  • Thứ hai, AMP có thể khó triển khai, AMP yêu cầu một tập HTML và CSS khác với các trang web truyền thống. Việc này, có thể cần phải chỉnh sửa mã nguồn đòi hỏi thời gian và nguồn lực, đặc biệt đối với các trang web có thiết kế phức tạp.
  • Thứ ba, AMP có thể hạn chế tính linh hoạt trong thiết kế, AMP có một số hạn chế về HTML và CSS, điều này có thể hạn chế tính linh hoạt trong thiết kế của các trang web.
  • Thứ 4, AMP có thể gây ra khó khăn khi phân tích vì bạn sẽ phải triển khai trên từng trang AMP của website. Tốn thời gian hơn so với việc không sử dụng AMP.
  • Cuối cùng, nó ảnh hưởng đến quảng cáo và doanh thu. Việc tải trang nhanh hơn có thể giảm cơ hội hiển thị quảng cáo và làm thay đổi cách quảng cáo hiển thị, điều này có thể không phù hợp với một số trang web.

Tóm lại, mặc dù AMP có nhiều lợi ích về tối ưu hóa trải nghiệm trang web trên thiết bị di động, nhưng không phải tất cả trang web đều phù hợp với nó.

AMP hoạt động như thế nào

Google đã giới thiệu khung Trang di động tăng tốc (AMP) mã nguồn mở vào tháng 2 năm 2016. Khung này được phát triển để đảm bảo trải nghiệm người dùng được tối ưu hóa và tích hợp chặt chẽ.

Hướng dẫn cấu hình amp wordpress 2023
AMP hoạt động ra sao

AMP được xây dựng với 3 thành phần cơ bản:

AMP HTML

AMP HTML về cơ bản là HTML chỉ có một số hạn chế nhất định để đảm bảo trang web được tải nhanh chóng. Nó loại bỏ hoặc sửa đổi một số thành phần và thuộc tính có thể làm chậm trang web.

AMP JS

JavaScript rất phức tạp vì quá nhiều JS có thể khiến trang web chạy chậm và không phản hồi.

Thư viện JavaScript của AMP giúp xây dựng trang web nhanh hơn mà không cần viết JavaScript phức tạp hoặc nhập thư viện bên ngoài, giúp tăng tốc tải trang.

AMP Capche

AMP Cache hay còn gọi là bộ nhớ đệm AMP là mạng phân phối nội dung dựa trên CND (mạng phân phối nội dung). AMP Cache lưu trữ bản sao của các trang AMP và cung cấp chúng cho người dùng từ gần như các máy chủ gần nhất, giúp giảm đáng kể thời gian tải của trang web trên thiết bị di động.

Ba thành phần cốt lõi của AMP hoạt động đồng bộ để giúp các trang tải nhanh chóng.

Hướng dẫn kiểm tra Google AMP

Có hai cách để kiểm tra Google AMP:

Kiểm tra AMP

Để kiểm tra trang AMP của bạn có hợp lệ hay không, có thể truy cập vào đường link: https://search.google.com/test/amp.

Sau đó, dán URL mà bạn cần kiểm tra vào và click “Test URL”. Nếu trang AMP của bạn hợp lệ thì hệ thống sẽ trả về thông báo “Valid AMP” màu xanh lá cây.

Hướng dẫn cấu hình amp wordpress 2023
Trang web AMP sau khi Test trang sẽ trả lại kết quả màu xanh lá.

\>>> Xem thêm: Tìm hiểu về url trang web là gì

Kiểm tra tốc độ tải trang

Vì AMP làm tăng tốc độ trang nên việc kiểm tra tốc độ tải trang cũng là cách để kiểm tra google AMP trên Website của bạn.

Hiện nay có nhiều trang web kiểm tra tốc độ tải trang. Tôi sẽ đề xuất cho bạn 3 ứng dụng tôi hay sử dụng:

Google PageSpeed Insights: Google PageSpeed Insights là một công cụ miễn phí của Google giúp bạn đánh giá tốc độ tải trang của website trên máy tính để bàn và thiết bị di động.

Hướng dẫn cấu hình amp wordpress 2023
đánh giá tốc độ tải trang của website

Để sử dụng Google PageSpeed Insights, bạn chỉ cần nhập URL của website vào công cụ và nhấn nút “Phân tích”. Công cụ sẽ cung cấp cho bạn điểm số tốc độ tải trang, cũng như các đề xuất để cải thiện tốc độ tải trang.

Hướng dẫn cấu hình amp wordpress 2023
Kiểm tra bằng GTmetrix

GTmetrix là một công cụ kiểm tra tốc độ tải trang trả phí.

Công cụ này cung cấp các tính năng nâng cao hơn Google PageSpeed Insights, chẳng hạn như khả năng kiểm tra tốc độ tải trang từ nhiều vị trí trên thế giới và cho phép chọn nhiều máy chủ khác nhau miễn phí.

WebPagetest

WebPagetest là một công cụ kiểm tra tốc độ tải trang miễn phí.

Công cụ này cung cấp các tính năng tương tự như GTmetrix, chẳng hạn như khả năng kiểm tra tốc độ tải trang từ nhiều vị trí trên thế giới.

Hướng dẫn cấu hình amp wordpress 2023
Kiểm tra bằng WebPagetest

\>>> Xem thêm: Top 10 phần mềm SEO website miễn phí tốt nhất hiện nay.

Hướng dẫn cài đặt Google AMP cho website

Các website được tạo bằng tác vụ thủ công khi muốn sử dụng AMP cần phải can thiệp vào mã nguồn mở bao gồm việc sửa đổi mã nguồn HTML để tuân thủ các quy tắc AMP. Quy trình như sau:

Cấu trúc html AMP đơn giản

Để bắt đầu, đây là phần đánh dấu của trang AMP cơ bản, các bạn có thể tham khảo:

Hướng dẫn cấu hình amp wordpress 2023
Cấu trúc html AMP đơn giản

Thêm hình ảnh

Nếu muốn thêm hình ảnh, bạn cần thay thế thẻ HTML thông thường bằng thẻ AMP tương đương.

Trong trường hợp này,

Hướng dẫn cấu hình amp wordpress 2023
sao chép và dán đoạn mã

Thêm phong cách cho website của bạn

Phong cách ở đây chỉ các yếu tố liên quan đến hình thức trang web như màu sắc, bố cục, kiểu chữ…

Mọi kiểu dáng đều phải được thực hiện bằng cách sử dụng thuộc tính CSS. Tuy nhiên, AMP tuyên bố rằng tất cả CSS phải được bao gồm trong một thẻ tùy chỉnh, được gọi là thẻ