Muốn xây dựng được một trang web với tốc độ truy cập lớn. Ngoài việc làm chủ nội dung của bài viết, bạn còn cần phải quan tâm đến các yếu tố kỹ thuật khác. Chẳng mấy ai kiên nhẫn nán lại chờ một trang web tốc độ tải siêu tệ dù nội dung của bạn có hấp dẫn thế nào. Hãy nâng cấp tốc độ tải trang, nhất là trên nền tảng di động. Khi mà ngày càng nhiều người tìm kiếm thông tin qua phương tiện kết nối nhỏ gọn.
Để giải quyết cho vấn đề ấy, Google AMP ra đời và hứa hẹn như một giải pháp hoàn hảo dành cho website của bạn. Chúng ta cùng tìm hiểu đôi nét về Google AMP và những lợi ích tuyệt vời mà nó mang lại.
AMP là gì?
Google Accelerated Mobile Pages (AMP) là thư viện mã nguồn mở để giúp bạn tạo trang web nhanh, cuộn mượt mà, và tinh giản phiên bản của trang web xuống mức phù hợp cho thiết bị di động. AMP cũng rất thân thiện với người dùng. Được dựng trên platforms and frameworks cũ. Hơn nữa, nó hoàn toàn tương thích với WordPress.
Tóm lại, Google AMP cho phép bạn tảo một bản sao của site bằng cách dùng AMP HTML. Việc này loại bỏ một số thành phần khiến website load chậm. Google sau đó sẽ còn tinh giản site này hơn nữa để cho tốc độ tải còn nhanh hơn.
AMP tuyệt vời với nội dung không tương tác. Nếu trang web của bạn yêu cầu tương tác, các tiêu chuẩn mã của AMP có thể gây cản trở. Ngược lại, nếu trang web do người đã dùng quen với giao diện của trang web thì sẽ là một cách tuyệt vời để tăng tốc các trang của bạn mà không làm mất đi các chức năng ấy.
Ưu điểm khi sử dụng Google AMP cho website WordPress
Đẩy mạnh Search Engine Optimization (SEO)
Ưu điểm dễ thất nhất là AMP WordPress sẽ cải thiện tốc độ. Vì tốc độ là yếu tố quan trong trong việc xếp hạng site trong Search Engine Results Pages (SERPs), nó sẽ giúp đẩy mạnh thứ hạng của site hơn nữa. AMP cũng sẽ giúp cho việc trang web của site sẽ hiện lên phần Google News, được ưu tiên đặt ở trên phần mobile search (việc này sẽ cũng sẽ tăng SEO).
Tăng trải nghiệm người dùng
Thống kê cho thấy là có gần đến 33% những đợt bán thất bại vì website không tối ưu cho di động. Một thông số đang quan ngại khác là có tới 57% người dùng internet nói họ sẽ không giới thiệu doanh nghiệp nào mà có giao diện mobile kém. AMP WordPRess sẽ tạo ra những trang web mobile rất thân thiện với người dùng, đẹp để có tránh những tiếng xấu làm ảnh hưởng trực tiếp đến doanh thu.
Tăng tốc độ server (giảm tải cho server)
Google AMP còn tận dụng một số tính năng tối ưu hóa chính của chính Google. Nó giảm băng thông sử dụng ảnh đến 50% (mà không ảnh hưởng chất lượng hiển thị) và tăng khả năng render phía server. Bằng cách tối ưu như vậy, AMP sẽ giúp bạn giải quyết vấn đề hiệu năng của server và tăng tốc site lên tổng thể.
Nhược điểm khi sử dụng Google AMP cho website WordPress
Hạn chế Cascading Style Sheets (CSS) và JavaScript
Mặc dù AMP giúp bạn tăng tốc độ cực nhanh, đánh đổi lại AMP sẽ hạn chế các thành phần dùng để nhận diện thương hiệu. AMP sẽ loại bỏ độ phân giải cao của ảnh, hạn chế animations, và những thành phần tạo hiệu ứng như CSS và JavaScript.
Chỉ hiển thị cached pages
Tốc độ của AMP một phần đến từ việc nó cho phép Google hiển thị phiên bản cached của web pages. Vì vậy, người dùng có thể không đang thấy phiên bản mới nhất của website của bạn.
Doanh thu quảng cáo bị giới hạn
Mặc dù Google AMP có hỗ trợ ads, việc triển khai ads trên Google AMP có thể khá phức tạp. Đồng thời nó cũng giới hạn quảng cáo từ các nền tảng ads khác bên thứ ba.
Cài đặt AMP WordPress bằng 2 AMP plugin WordPress
Để cài đặt AMP cho WordPress site, bạn cần cài đặt plugin AMP WordPress. Nhưng trước khi thực hiện bất kỳ thay đổi nào trong các phương pháp dưới đây, hãy back up WordPress site của bạn trước.
Lựa chọn 1: Sử dụng plugin AMP for WordPress
AMP for WordPress plugin là công cụ tuyệt vời để bạn thiết lập AMP cho WordPress site một cách nhanh chóng và đơn giản. Mặc dù phiên bản mặc định có lựa chọn khá đơn giản để tùy chỉnh AMP, nhưng bạn có thể dùng thêm các plugin khác để làm việc này. Chúng tôi sẽ hướng dẫn sau để làm vậy. Giờ, hãy cài đặt plugin này thôi.
Đầu tiên, truy cập Plugins -› Add New trong WordPress dashboard của bạn. Điền ‘AMP for WordPress‘ trong thanh tìm kiếm và tìm đúng plugin AMP plugin for WordPress. Giờ, hãy install và activate nó
Tiếp theo, chuyển tới tab Appearance -> AMP trong trang admin của bạn. Việc này sẽ giúp bạn tùy chỉnh trang AMP. Rồi nhấn vào tab Design:
Bạn cũng có thể chọn lựa AMP WordPress sẽ được áp dụng trên trang nào, post nào hoặc toàn trang. Để làm vậy, chỉ cần quay về WordPress dashboard và chuyển tới mục AMP > General:
Khi đã vào đó, chọn ô bên dưới Post Type Support cho tùy chọn bạn muốn chỉnh rồi nhấn nút Save Changes.
Chuyển tới mục Plugins -› Add New, rồi tìm, cài đặt và kích hoạt Yoast SEO plugin:
Sau đó, làm tương tự với Glue for Yoast SEO & AMP plugin. Rồi chuyển vào trong SEO › AMP để chọn option cho post hoặc loại nội dung đa phương tiện nào nào cần hỗ trợ AMP:
Rồi nhấn vào nút Save changes. Bạn cũng có thể cấu hình thêm giao diện bằng tab Design. Tại đây, bạn có thể chỉnh icon cho site AMP WordPress, tùy chỉnh bảng màu, và thêm custom CSS:
Đừng quên lưu mọi thay đổi của bạn lại để khỏi phí công sức nãy giờ nhé!
Lựa chọn 2: Cài đặt plugin AMP for WP – Accelerated Mobile Pages
Ngoài việc tạo ra một giao diện nhẹ nhàng, thân thiện với người dùng, plugin WordPress AMP này còn tích hợp nhiều công cụ nâng cao khác. Các công cụ này là WooCommerce (plugin hàng đầu cho thương mại điện tử trên WordPress), Alexa metrics, OneSignal push button notifications, và hơn thế nữa.
Để sử dụng plugin AMP này cho WordPress, bạn sẽ cần cài đặt trong Plugins -> Add New. Tìm ‘AMP for WP‘, để cài đặt và tải plugin:
Tiếp theo, chuyển tới tab AMP mới trong trang admin WordPress dashboard. Bạn sẽ nhìn thấy menu drop-down có tên Settings, Design, Extensions, .. Giờ hãy vào trong phần Settings để thiết lập ban đầu:
Đừng quên nhấn nút Save Changes cho từng thay đổi mà bạn cấu hình ở trên. Tiếp theo, hãy vào tab Design:
Khi bạn đã hài lòng với cách AMP hiển thị, hãy lưu thay đổi. Xem trước chúng bằng cahc1 chuyển Vào mục Appearance > AMP:
Cũng có nhiều extension để tạo ra đánh giá bằng sao (phù hợp cho các site về sản phẩm hay bất động sản), tích hợp với AMP WooCommerce Pro, sử dụng custom post types, và hơn nữa:
Premium AMP themes cũng có thể mua được. Bạn có thể xem trước chúng bằng cách vào Design > Themes
So sánh tốc độ của trang web có sử dụng Google AMP và không sử dụng Google AMP
Giải thích các thông số:
Performance Scores:
PageSpeed Grade: Điểm số từ công cụ Google PageSpeed
YSlow Grade: Điểm số từ công cụ Yahoo! YSlow
Page Details:
Page load time: Thời gian tải trang.
Total page size: Dung lượng của cả trang.
Total # of requests: Số lượng request của cả trang.
Kiểm tra một trang Web có AMP hay không?
Cách 1: Sử dụng bảng điều khiển dành cho nhà phát triển trình duyệt (BROWSER DEVELOPER CONSOLE)
Ưu điểm: Hỗ trợ tốt việc phát triển mã nguồn dựa trên CCS và AMP
Nhược điểm: Thao tác phức tạp, gồm nhiều bước
Các bước thực hiện:
Mở website của bạn trong trình duyệt
Bấm tổ hợp phím Ctrl-Shift-I hoặc vào “More Tools” và chọn “Developer Tools”
Chọn tab “Console”
Kiểm tra xem bạn có bị báo lỗi gì không. Nếu chuẩn các bạn sẽ không nhận được lỗi thông báo lỗi.
Cách 2: Sử dụng tiện ích mở rộng của trình duyệt (BROWSER EXTENSION)
Ưu điểm: Tiện lợi, nhanh chóng.
Nhược điểm: Chỉ có một vấn đề nhỏ là cần tải về cài đặt thêm do không có sẵn.
Các bước thực hiện:
- Tải về tiện ích mở rộng (Chrome; Opera)
- Sau khi cài đặt xong sẽ có biểu tượng như hình bên dưới.
- Màu xám ứng với việc không hỗ AMP
- Màu xanh lá cây ứng với việc hỗ trợ AMP.
- Màu xanh da trời để chỉ việc website hiện tại không hỗ trợ nhưng có thể kích chọn vào biểu tượng để chuyển sang phiên bản hỗ trợ AMP.
Kết luận
Bài viết phía trên là một số thông tin về Google AMP cùng những lợi ích của nó đối với tốc độ tải của một trang web trên thiết bị di động. Hy vọng bạn có thêm được những kiến thức cần thiết trong quá trình SEO web của mình.
Đọc thêm
- [SITEMAP WEBSITE] Để tối ưu SEO, hãy tạo sơ đồ trang web
- Thẻ Canonical là gì? Tối ưu hóa thẻ Canonical trong SEO
