AMP là cụm từ được đề cập nhiều nhất khi nhắc đến các vấn đề cần cải thiện để tăng độ load trang trên thiết bị di động và thúc đẩy SEO tốt hơn.
Nhưng chỉ nói như vậy thì chắc chắn bạn sẽ không hiểu rõ AMP là gì, cách hoạt động cũng như cài đặt AMP như thế nào? Tất cả thắc mắc của bạn sẽ được Prodima giải đáp cụ thể trong bài viết này.
Bắt đầu ngay nhé!
AMP là gì?
AMP được viết tắt từ cụm Accelerated Mobile Pages – tạm dịch là Trang tăng tốc website dành cho thiết bị di động.
AMP là một công nghệ mã nguồn mở giúp tối ưu tốc độ tải trang trên các thiết bị di động trở nên “mượt” => nâng cao trải nghiệm người dùng => tăng lượng truy cập và tương tác từ người dùng tốt hơn.
AMP áp dụng kỹ thuật gì?
Dưới đây là 3 kỹ thuật chính được AMP áp dụng:
1. Kỹ thuật Lazy Loading Image:
Kỹ thuật này sẽ trì hoãn việc tải ảnh lên đầy đủ cho đến khi người dùng muốn xem nó. Điều này giúp loại bỏ các lượng tài nguyên thừa khi tải lên website => giúp tăng độ load trang.
2. Kỹ thuật tải Javascript bất đồng bộ Async:
Dù phần dữ liệu phía trên chưa được xử lý hoàn chỉnh thì website vẫn chạy được code hoặc upload dữ liệu phí dưới. Nhờ vậy mà thời gian tải trang được rút ngắn, tăng trải nghiệm người dùng tốt hơn.
3. Kỹ thuật CDN giúp Javascript nhanh hơn:
CDN (viết tắt từ Content Delivery Network) – hệ thống server được đặt tại nhiều vị trí địa lý trên toàn cầu. Thông qua cơ chế cache, CDN giúp truyền tải nội dung truyền tải đến người dùng nhanh hơn.
Trạng thái AMP hiển thị trên Google Search
Search bất kỳ thông tin nào trên Google bằng thiết bị di động, bạn sẽ thấy có những trang web xuất hiện biểu tượng tia sét cùng dòng chữ AMP giống như hình bên dưới:
Khi nhấp vào đường link đó, nội dung AMP sẽ hiển thị theo 2 cách sau:
- Trình xem AMP của Google: Đây là dạng mặc định của Google giúp lưu trữ và phân phối tất cả nội dung AMP đến người dùng tốt hơn.
- Signed Exchange: Công nghệ này giúp trình duyệt trả về chính xác URL gốc xuất bản nội dung.
Trạng thái AMP hiển thị trên Google Console
Google Search Console trước đây chính là Google Webmasters Tools – nơi bạn có thể theo dõi trạng thái AMP website.
Công cụ này cung cấp cho bạn một danh sách chi tiết các trang AMP được Googlebot index thành công, cùng các lỗi AMP phát sinh trên trang web của mình.
Để kiểm tra trạng thái AMP trên Google Console, bạn hãy làm như sau:
- Đầu tiên, bạn cần truy cập vào Google Console => nhấp mục Trang tối ưu cho thiết bị di động.
- Bạn sẽ thấy một danh sách các trang AMP hợp lệ (đã lập chỉ mục và được đánh dấu) cùng số lượng AMP lỗi => nên khắc phục nhanh nhất có thể.
AMP Plugin hoạt động như thế nào?
AMP thường hiển thị những trang web nào đã được tối ưu HTML – với tốc độ tải nhanh hơn. Nếu những trang di động nào có JavaScript thì chúng không xuất hiện trong AMP.
Một vài lưu ý khi cài đặt AMP:
- Để hiển thị AMP, bạn phải dùng CSS phiên bản Streamlined.
- Vì chỉ được sử dụng thư viện JavaScript của AMP nên có thể dẫn đến tình trạng Lazy Loading.
- Để site AMP hoạt động, bắt buộc bạn phải Validate đúng cách.
- Nên tải một số Fonts Custom phù hợp để tăng trải nghiệm user mobile tốt hơn.
- Bạn không thể sử dụng các Forms trên các trang AMP.
- Bạn cần điều chỉnh chiều cao và chiều rộng của trang để tránh các hình bị biến dạng khi hiển thị trên giao diện mobile.
- Để trình chiếu video trên trang, bạn có thể sử dụng Extension AMP Approved. Nhưng với kinh nghiệm của Prodima, để tăng hiệu suất hoạt động của các trang Mobile thì bạn hãy tập trung cải thiện Readability và Speed.
Ưu – nhược điểm của AMP đối với SEO
Ưu điểm của AMP
Hiểu được AMP là gì, nhưng bạn có biết được vì sao nên cài đặt AMP? Đó là vì những ưu điểm nổi bật sau:
1. Tăng tốc độ tải trang:
Nhiều nghiên cứu cho thấy, một trang web cài đặt AMP sẽ có tốc độ tải trang nhanh hơn so với trang web không cài AMP từ 15-80%. Điều này giúp “giữ chân” người dùng và tăng chuyển đổi cao hơn.
2. Cải thiện ranking mobile:
Do thời gian tải nhanh đáp ứng trải nghiệm người dùng, AMP tác động lớn đến thứ hạng trang trên thiết bị di động.
3. Cải thiện hiệu suất máy chủ:
AMP giảm thời gian truy xuất dữ liệu khi có một lượng lớn user mobile truy cập, từ đó giúp tăng hiệu suất trên máy chủ.
Nhược điểm của AMP
Bên cạnh những ưu điểm mang lại, AMP cũng có nhiều mặt hạn chế sau:
1. Phụ thuộc vào bộ nhớ Cache:
Google không cung cấp bất kỳ tính năng, công cụ hay công nghệ nào cụ thể để hỗ trợ thời gian tải trên trang web. Tất cả chỉ đáp ứng truy cập nhanh từ bộ nhớ cache.
2. Không hỗ trợ tốt Analytics:
AMP vẫn được hỗ trợ khi sử dụng Google Analytics để bạn có thể thu thập và phân tích dữ liệu. Nhưng bạn phải triển khai trên từng trang AMP riêng biệt, điều này gây mất thời gian và công sức rất nhiều.
3. Giảm doanh thu Ads:
Mặc dù AMP cũng hỗ trợ Ads nhưng sẽ hạn chế khả năng hiển thị – nhằm mục đích tối ưu tốc độ load trang. Chính vì thế, việc triển khai quảng cáo trên AMP site là không hề dễ dàng, khiến lượng doanh thu từ Ads của bạn có thể giảm đi.
Làm thế nào để AMP-hóa trang web?
Sẽ có sẵn 2 phiên bản chính của trang gồm: Phiên bản mà bất kỳ user nào cũng thấy và Phiên bản AMP.
Như Prodima đã nói ở trên, AMP không cho phép hiển thị các Form Elements hay JavaScript, nên bạn không thể các elements, comments hay có lead forms trên trang web của mình.
Thêm vào đó, bạn phải viết lại Template để đáp ứng các quy tắc AMP. Chẳng hạn, tất cả CSS trong AMP phải nằm cùng dòng và có dụng lượng < 50Kb. Đồng thời, các Font custom phải có dạng amp-font để loading tốt hơn.
Ngoài ra, Multimedia cũng cần được xử lý – các hình ảnh trên trang phải phải theo size cố định và sử dụng cũng yếu tố amp-img tùy chỉnh. Nếu bạn sử dụng GIFs thì phải dùng amp-anim extended.
Để Google có thể detect được các trang AMP, bạn cần xác định các trang gốc phải có tag sau:
<link rel=”amphtml” href=”http://www.example.com/blog-post/amp/”>
Hướng dẫn kiểm tra Google AMP
Để check các site AMP của bạn đã hợp lệ chưa, hãy truy cập: search.google.com/test/amp => dán URL site cần kiểm tra => click “Test URL”. Hệ thống sẽ trả về thông báo màu xanh lá cây “Valid AMP” nếu trang AMP của bạn hợp lệ.
Lưu ý trước khi cài đặt AMP cho website
Trước khi cài đặt AMP cho trang web, bạn nên sử dụng giao thức HTTPS đáp ứng các điều kiện sau:
- <!doctype html>: tiêu chuẩn HTML.
- Chứa các thẻ <head> và <body>.
- Bên trong <head> phải chứa thẻ <link rel=”canonical” href=”$SOME_URL” />.
- Chứa thẻ con đầu tiên của thẻ <head> là <meta charset=”utf-8″>.
- Chứa thẻ con thứ 2 của thẻ <head> là <script async src=”https://cdn.ampproject.org/v0.js”></script>.
- Chứa thẻ <html ⚡> hoặc <html amp>: nhằm mục đích xác định tất cả nội dung có định dạng AMP.
- Chứa thẻ uy định chế độ xem tương ứng trên thiết bị di động: <meta name=”viewport” content=”width=device-width,minimum-scale=1″>.
- Chứa đoạn mã boilerplate AMP trong thẻ <head>.
Lưu trữ AMP trên URL
Bạn nên lưu trữ các trang sử dụng AMP trên một URL được tối ưu phù hợp với người dùng.
Ví dụ: Một trang tiêu chuẩn hiển thị dưới dạng https://example.com/subfolder/this-is-an-example.html. Bạn nên lưu trữ trang này với URL như sau:
- example.com/subfolder/this-is-an-example-amp.html
- amp.example.com/subfolder/this-is-an-example.html
=> Điều này đảm bảo khi người dùng click vào, URL chỉ hiển thị trang web chính của bạn.
Tạo AMP dễ khám phá
Nếu website của bạn có cả các trang AMP và không AMP, hãy thêm các thẻ HTML như sau:
1. Với những trang không AMP => hãy tham chiếu đến các trang AMP để Google và các nền tảng khác biết về nó:
<link rel=”amphtml” href=”https://example.com/this-is-an-example-amp.html” />
2. Với những trang AMP, bạn hãy thêm văn bản dưới đây để tham chiếu đến các trang không AMP của nó:
<link rel=”canonical” href=”https://example.com/this-is-an-example.html” />
3. Với những trang AMP độc lập (đây là dạng site không có phiên bản không phải AMP) => sẽ được chỉ định làm phiên bản chuẩn:
<link rel=”canonical” href=”https://example.com/this-is-an-example-amp.html” />
=> Các trang AMP độc lập cũng được Google index khi tìm thấy chúng. Do đó, bạn cần đảm bảo tất cả trang độc lập đều được được liệt kê trong sitemap.xml hoặc liên kết với với các trang được lập chỉ mục khác.
Hướng dẫn cài đặt AMP cho website WordPress
Bạn có thể cài đặt AMP miễn phí đối với các website WordPress. Hãy thực hiện theo 4 bước đơn giản sau:
- Bước 1: Truy cập WordPress Dashboard => chọn Plugins => nhấp Add New.
- Bước 2: Search “AMP for WordPress” trên thanh tìm kiếm.
- Bước 3: Click “Install” để cài đặt.
- Bước 4: Sau khi hoàn tất => mở tab Appearance => mở AMP.
Tại đây sẽ có nhiều tab khác nhau để bạn điều chỉnh trang AMP theo nhu cầu như:
- Tab General: giúp bạn chọn AMP cho trang web nào, bài viết nào…
- Tab Design: điều chỉnh link cho đến background, text của site…
Cách mở site AMP trên Chrome
Đối với những trang web sử dụng trình duyệt mặc định Chrome, bạn hãy thực hiện theo các bước chỉ dẫn dưới đây:
- Bước 1: Mở trình duyệt Chrome lên và cài đặt AMP Browser Extension.
- Bước 2: Tìm kiếm thông tin như bình thường, bạn sẽ thấy những trang web nào có biểu tượng hình tia chớp xanh với chữ AMP bên cạnh.
- Bước 3: Khi truy cập vào trang web, sẽ hiển thị giao diện theo AMP. Nội dung sẽ được tải trước, tiếp đến là hình ảnh và quảng cáo (nếu có).
- Bước 4: Để trở lại giao diện mặc định, bạn nhấp vào biểu tượng AMP Browser Extension phía cuối thanh địa chỉ trình duyệt và tắt giao diện AMP (chuyển sang màu xám) là được.
- Bước 5: Bạn có thể mở giao diện thiết lập bằng cách nhấp chuột phải vào biểu tượng AMP Browser Extension => click Tùy chọn. Nếu bạn bỏ phần Load AMP or MIP Pages Automatically => trang web sẽ trở lại giao diện mặc định. Ngoài ra, bạn có thể tùy chọn những trang web không muốn sử dụng giao diện AMP.
3 Cách vô hiệu hoá AMP trong tìm kiếm Google
Hiểu được những lợi ích của AMP là gì, đặc biệt với những người dùng thường gặp phải tình trạng kết nối internet chậm và không ổn định sẽ rất yêu thích các trang web AMP.
Nhưng, không vì thế mà những người dùng có kết nối Internet cao sẽ cũng thích điều này. Và càng tệ hơn khi Google không cung cấp bất kỳ phương thức nào để vô hiệu hóa nó.
Tuy nhiên, vẫn có một vài cách giúp bạn vô hiệu hóa AMP trong tìm kiếm Google như sau:
Sử dụng tìm kiếm Google được mã hóa
Việc sử dụng tìm kiếm Google được mã hóa sẽ giúp bạn hiển thị các phiên bản trang web thông thường trên kết quả tìm kiếm.
Thay vì search thông tin trực tiếp trên thanh tìm kiếm của trình duyệt, bạn nên mở encrypted.google.com và thực hiện tìm kiếm như bình thường.
Nhưng bạn nên cài đặt nó làm trang chủ mặc định, vì không phải lúc nào encrypted.google.com cũng hỗ trợ điều hướng đến những trang web được mã hóa của Google. Cách này cũng có hiệu quả khi sử dụng trên các thiết bị di động.
Sử dụng DeAMpify cho Android
DeAMpify là một ứng dụng Android cho phép người dùng bỏ qua tất cả liên kế AMP trên kết quả tìm kiếm để tải liên kết ban đầu. Tuy nhiên, ứng dụng này chỉ hoạt động khi bạn thực hiện tìm kiếm cho Android mà thôi.
Đầu tiên, bạn thực hiện tìm kiếm trên Google và nhấp vào bất kỳ link nào có nhãn AMP. Trình truyệt sẽ gửi một thông báo, bạn hãy chọn DeAMpify và bấm Always.
Lúc này ứng dụng sẽ mở các liên kết ban đầu trong tìm kiếm Chrome. Ở phiên bản Pro của DeAMpify sẽ loại bỏ tất cả quảng cáo và chỉ mở khóa các tính năng khi bạn bật Wi-fi.
Dùng tính năng Bang của DuckDuckGo
DuckDuckGo là một công cụ tìm kiếm bảo mật cao và hoàn toàn không theo dõi bạn – tính năng tuyệt vời này khác với Google. Thông qua DuckDuckGo, bạn có thể thực hiện các tìm kiếm trên Google với kết quả là những liên kết ban đầu thay vì phiên bản AMP.
DuckDuckGo cũng hoạt động trên thiết bị di động một cách hiệu quả. Dưới đây là cách cài đặt nhanh chóng cho Chrome trên điện thoại:
- Mở DuckDuckGo.com trong Chrome => kéo chuột xuống phía dưới cùng và nhấn Add DuckDuckGo to Chrome.
- Mở Chrome Settings => nhấn Search engine => chọn DuckDuckGo.
Nếu bạn sử dụng Safari trên điện thoại thì hãy thực hiện như sau:
- Mở Settings => Safari => Search Engine => chọn DuckDuckGo.
Vậy là xong, bạn đã cài đặt thành công DuckDuckGo làm công cụ tìm kiếm mặc định. Và bạn có thể tìm kiếm bất kỳ thông tin nào trên Chrome với các liên kết ban đầu.
- Tips: Nếu muốn sử dụng DuckDuckGo để tìm kiếm các kết quả từ Google, bạn hãy thêm !g trước cụm từ tìm kiếm của bạn.
Lời kết
Hy vọng với những chia sẻ về AMP là gì, ưu – nhược điểm của AMP cũng như cách cài đặt AMP cho website WordPress chi tiết – bạn có thể tạo ra nhiều trang AMP của riêng mình để hỗ trợ tốt cho người dùng mobile.
Nếu bạn thích bài viết này, chắc hẳn bạn sẽ thích thú với dịch vụ thiết kế website của chúng tôi. Prodima là đội ngũ chuyên gia về Digital Marketing tại TP. Hồ Chí Minh. Chúng tôi có thể mang đến cho bạn những chiến lược xuất sắc để giúp bạn bứt phá lượng truy cập và tăng doanh thu một cách bền vững.
Liên hệ ngay với các chuyên gia của chúng tôi để được tư vấn ngay bây giờ với sự hỗ trợ tận tình 24/7.
