AMP là gì? Hướng dẫn chi tiết về Google AMP

Bạn đang tìm hiểu AMP là gì và cách nó giúp website tải nhanh trên di động? Trong bài viết này, chúng tôi sẽ giải thích chi tiết về Google AMP, cách nó hiển thị, plugin hoạt động, kỹ thuật áp dụng, ảnh hưởng đến SEO, ưu nhược điểm, và cách kiểm tra hiệu quả. Khám phá ngay để tối ưu website của bạn!

AMP là gì?

AMP (Accelerated Mobile Pages) là một dự án mã nguồn mở do Google khởi xướng vào năm 2015, nhằm tạo ra các trang web tải nhanh gần như tức thì trên thiết bị di động. AMP sử dụng một phiên bản rút gọn của HTML (AMP HTML), kết hợp với thư viện JavaScript tối ưu (AMP JS) và hệ thống bộ nhớ đệm (AMP Cache) để đảm bảo tốc độ tải trang vượt trội.

Mục tiêu chính của AMP là cải thiện trải nghiệm người dùng trên di động, đặc biệt trong các tình huống mạng yếu hoặc thiết bị cấu hình thấp. AMP thường được sử dụng cho các website tin tức, blog, hoặc nội dung tĩnh, nhưng cũng hỗ trợ quảng cáo, email, và Web Stories. Theo Google, các trang AMP có thể tải nhanh gấp 2.5-9 lần so với trang non-AMP, tùy thuộc vào việc có sử dụng prerendering hay không.

Ví dụ thực tế: Các trang báo như The New York Times hay BBC News sử dụng AMP để đảm bảo bài viết tải nhanh trên di động, giúp giữ chân người đọc.

AMP hiển thị như thế nào?

Trang AMP hiển thị dưới dạng phiên bản rút gọn của website, ưu tiên nội dung chính như văn bản, hình ảnh tối ưu, và video nhẹ. Các yếu tố phức tạp như JavaScript tùy chỉnh, quảng cáo nặng, hoặc widget động thường bị loại bỏ hoặc thay thế bằng các thành phần AMP tương thích.

• Trong Google Search: Trước đây, các trang AMP được đánh dấu bằng biểu tượng tia sét và chữ “AMP” trong kết quả tìm kiếm. Tuy nhiên, từ năm 2020, Google đã loại bỏ biểu tượng này, nhưng AMP vẫn có thể xuất hiện trong các carousel tin tức hoặc kết quả tìm kiếm phong phú (rich results).
• Trên thiết bị di động: Trang AMP tải qua Google AMP Viewer (hiển thị URL của Google nhưng có tên miền của nhà xuất bản ở đầu trang) hoặc Signed Exchange (hiển thị trực tiếp dưới tên miền của nhà xuất bản, hỗ trợ cookie và phân tích dữ liệu tốt hơn).
• Trên desktop: AMP trên desktop không sử dụng Google AMP Cache, hoạt động như trang HTML thông thường, nhưng vẫn nhanh hơn nhờ mã tối ưu.

Ví dụ: Khi tìm kiếm “tin tức bóng đá” trên di động, một bài báo AMP từ VNExpress sẽ tải gần như ngay lập tức, với giao diện đơn giản, tập trung vào nội dung.

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

Các plugin AMP, như AMP for WordPress, giúp tự động chuyển đổi trang web thành định dạng AMP mà không cần chỉnh sửa mã nguồn phức tạp. Dưới đây là cách plugin hoạt động:

• Tạo phiên bản AMP: Plugin tự động tạo bản sao AMP cho các trang hoặc bài viết, thay thế các thẻ HTML không tương thích bằng thẻ AMP (ví dụ: <img> thành <amp-img>).
• Tích hợp CMS: Plugin thêm thẻ <link rel=”amphtml”> vào trang gốc để Google nhận diện phiên bản AMP. Ví dụ: Trang example.com/bai-viet sẽ có phiên bản AMP tại example.com/amp/bai-viet.
• Tùy chỉnh giao diện: Một số plugin cho phép điều chỉnh thiết kế AMP (màu sắc, logo, font chữ) và tích hợp quảng cáo AMP hoặc phân tích dữ liệu.
• Chế độ hoạt động:

Standard: Toàn bộ website sử dụng AMP làm framework chính.

Transitional: Mỗi trang có cả phiên bản AMP và non-AMP.

Reader: Chỉ áp dụng AMP cho bài viết hoặc trang được chọn.

Plugin phổ biến:

• AMP for WordPress: Miễn phí, hỗ trợ tùy chỉnh dễ dàng, tương thích với hầu hết theme WordPress.
• AMP by Automattic: Tích hợp sâu với WordPress, phù hợp cho blog.
• Glue for Yoast SEO & AMP: Tăng cường SEO cho trang AMP.

Ví dụ: Trang Elegant Themes báo cáo rằng sau khi dùng AMP for WordPress, thời gian tải trang di động giảm 75%, cải thiện trải nghiệm người dùng.

Kỹ thuật cơ bản áp dụng trong AMP

Để triển khai AMP hiệu quả, bạn cần áp dụng các kỹ thuật sau:

• AMP HTML: Sử dụng phiên bản HTML rút gọn với các thẻ tùy chỉnh như <amp-img>, <amp-video>, hoặc <amp-carousel>. Các thẻ này đảm bảo nội dung tải nhanh và tương thích di động.
• CSS tối ưu: CSS phải được nhúng inline, giới hạn dưới 75KB. Tránh sử dụng CSS phức tạp hoặc hiệu ứng động nặng. Plugin AMP thường tự động loại bỏ CSS không cần thiết (CSS tree shaking).
• JavaScript hạn chế: Chỉ sử dụng thư viện AMP JS, hỗ trợ các tính năng cơ bản như tải hình ảnh lazy-load hoặc carousel. JavaScript tùy chỉnh bị cấm để tránh làm chậm trang.
• Hình ảnh và video: Sử dụng <amp-img> với kích thước cố định để tránh nhảy bố cục (layout shift). Video sử dụng <amp-video> để tối ưu băng thông.
• Google AMP Cache: Hệ thống bộ nhớ đệm của Google lưu trữ và phân phối trang AMP, hỗ trợ prerendering để nội dung hiển thị tức thì. Cloudflare cũng cung cấp AMP Cache từ năm 2017.
• Structured Data: Thêm dữ liệu có cấu trúc (schema.org) để tăng cơ hội xuất hiện trong rich results, như carousel tin tức hoặc bài viết nổi bật.

Ví dụ: Một bài viết AMP trên Wired sử dụng <amp-img> và <amp-carousel> để hiển thị hình ảnh động, tải nhanh gấp 3 lần so với phiên bản non-AMP.

Google AMP ảnh hưởng SEO như thế nào?

Mặc dù AMP không phải là yếu tố xếp hạng trực tiếp, nó tác động mạnh mẽ đến SEO thông qua các yếu tố gián tiếp:

• Tốc độ tải trang: Google ưu tiên các trang tải nhanh, và AMP giảm thời gian tải xuống dưới 1 giây (so với 4.5 giây trung bình cho trang di động). Tốc độ là một yếu tố trong Core Web Vitals, ảnh hưởng đến xếp hạng.
• Trải nghiệm người dùng: Trang AMP giảm tỷ lệ thoát (bounce rate) xuống 32% khi thời gian tải từ 3 giây xuống 1 giây, tăng thời gian trên trang và khả năng chuyển đổi.
• Hiển thị trong rich results: AMP kết hợp structured data có thể xuất hiện trong carousel tin tức hoặc Top Stories, tăng tỷ lệ nhấp (CTR) lên đến 27% so với trang non-AMP.
• Lưu lượng di động: Với hơn 50% lưu lượng web từ di động, AMP giúp cải thiện trải nghiệm trên mạng 3G/4G, đặc biệt ở các khu vực có kết nối yếu.

Tuy nhiên, kể từ năm 2021, Google không còn yêu cầu AMP cho Top Stories hoặc Google News, và ưu tiên Core Web Vitals hơn. Điều này khiến AMP trở nên ít quan trọng với một số website, nhưng vẫn hữu ích cho các trang tin tức.

Rủi ro SEO: Nếu triển khai sai, AMP có thể gây lỗi như nội dung không đồng bộ giữa phiên bản AMP và non-AMP, hoặc URL AMP không được lập chỉ mục, làm giảm thứ hạng.

Ví dụ: CNBC báo cáo giảm 4 lần thời gian tải trang di động sau khi dùng AMP, dẫn đến 22% người dùng di động quay lại trong 7 ngày.

Ưu và nhược điểm của Google AMP là gì? 

Ưu điểm của AMP là gì?

• Tốc độ vượt trội: Trang AMP tải trong 0.7-1 giây, so với 22 giây cho trang non-AMP, cải thiện trải nghiệm người dùng.
• Tăng CTR: Xuất hiện trong rich results và carousel tăng CTR lên 25-63% cho quảng cáo và nội dung.
• Hỗ trợ đa nền tảng: AMP tương thích với Chrome, Firefox, Safari, và các ứng dụng như Twitter, Pinterest.
• Dễ triển khai: Plugin và tài liệu từ amp.dev giúp tích hợp AMP nhanh chóng, ngay cả với người mới.
• Tiết kiệm dữ liệu: AMP sử dụng ít dữ liệu hơn 10 lần so với trang thông thường, phù hợp cho mạng yếu.

Nhược điểm của AMP là gì?

• Hạn chế thiết kế: AMP giới hạn JavaScript và CSS, khiến giao diện kém linh hoạt, không phù hợp cho website thương mại điện tử hoặc ứng dụng động.
• Bảo trì phức tạp: Cần duy trì cả phiên bản AMP và non-AMP, tăng chi phí quản lý.
• Phụ thuộc vào Google: Google AMP Cache khiến nhà xuất bản phụ thuộc vào cơ sở hạ tầng Google, giảm quyền kiểm soát dữ liệu.
• Không còn bắt buộc: Sau cập nhật Page Experience 2021, AMP không còn cần thiết cho Top Stories, khiến một số nhà xuất bản từ bỏ AMP.
• Hạn chế quảng cáo: AMP giới hạn định dạng quảng cáo, có thể giảm doanh thu cho các trang phụ thuộc quảng cáo phức tạp.

Ví dụ: Times of India tăng doanh thu 1.5 lần nhờ AMP, nhưng Ghost đã loại bỏ AMP vào năm 2023 do hạn chế về thiết kế.

Cách để kiểm tra Google AMP là gì?

Để đảm bảo trang AMP hoạt động đúng và được Google lập chỉ mục, bạn có thể sử dụng các công cụ sau:

• AMP Validator: Truy cập amp.dev/validator để kiểm tra mã nguồn AMP. Công cụ sẽ báo lỗi nếu có thẻ không hợp lệ hoặc cấu trúc sai.
• Google AMP Test: Vào search.google.com/test/amp, nhập URL AMP để kiểm tra tính hợp lệ và khả năng xuất hiện trong Google Search.
• Google Search Console: Trong mục “AMP”, bạn sẽ thấy báo cáo về lỗi AMP (như thẻ thiếu, structured data không hợp lệ). Sử dụng công cụ URL Inspection để kiểm tra trạng thái lập chỉ mục.
• Chrome DevTools: Thêm #development=1 vào URL AMP (ví dụ: example.com/amp#development=1), mở DevTools và kiểm tra tab Console để xem lỗi chi tiết.
• Structured Data Testing Tool: Kiểm tra dữ liệu có cấu trúc trên trang AMP để đảm bảo nó đủ điều kiện cho rich results search.google.com/structured-data/testing-tool.

Lưu ý: Đảm bảo trang AMP có nội dung và chức năng tương đương với trang canonical, và không chặn AMP trong file robots.txt để Google có thể thu thập dữ liệu.

Ví dụ: Nếu một trang AMP có lỗi <img> không thay bằng <amp-img>, Google AMP Test sẽ báo lỗi và hướng dẫn sửa.

AMP là gì? Đó là một công cụ mạnh mẽ để tăng tốc độ tải trang di động, cải thiện trải nghiệm người dùng và hỗ trợ SEO thông qua tốc độ và rich results. Mặc dù không còn là yêu cầu bắt buộc cho Top Stories, AMP vẫn mang lại lợi ích lớn cho các trang tin tức, blog, hoặc website cần tối ưu hóa di động. Tuy nhiên, với sự phát triển của Core Web Vitals và thiết kế responsive, bạn nên cân nhắc xem AMP có phù hợp với mục tiêu website của mình hay không.

Để triển khai AMP hiệu quả, hãy sử dụng plugin như AMP for WordPress, áp dụng kỹ thuật tối ưu, và thường xuyên kiểm tra bằng các công cụ của Google. Nếu bạn cần một website linh hoạt hơn hoặc không phụ thuộc vào Google, có thể tập trung vào tối ưu Core Web Vitals thay vì AMP.