Tối ưu website là gì?
Tối ưu website là quá trình tối ưu hóa các yếu tố của một trang web để tăng cường trải nghiệm của người dùng, tăng hiệu quả kinh doanh, cải thiện độ tìm thấy của trang web trên các công cụ tìm kiếm và tối ưu hóa tốc độ tải trang web.
Các hạng mục cần được tối ưu hóa để cải thiện hiệu suất trang web bao gồm:
- Tối ưu hóa tốc độ tải trang: Cải thiện tốc độ tải trang web để đảm bảo trang web được tải nhanh chóng và mượt mà. Điều này có thể được đạt được bằng cách sử dụng kỹ thuật như tối ưu hóa hình ảnh, tối ưu hóa mã nguồn, tối ưu hóa bộ nhớ cache, sử dụng CDN (mạng phân phối nội dung), vv.
- Tối ưu hóa thiết kế trang web: Thiết kế trang web cần phải đơn giản, sáng tạo, dễ hiểu và dễ sử dụng để thu hút khách hàng và cải thiện trải nghiệm người dùng.
- Tối ưu hóa SEO: Cải thiện độ tìm thấy của trang web trên các công cụ tìm kiếm bằng cách sử dụng các từ khóa phù hợp, thân thiện với SEO và xây dựng liên kết chất lượng từ các trang web có uy tín cao.
- Tối ưu hóa trải nghiệm người dùng: Cải thiện trải nghiệm người dùng bằng cách cung cấp nội dung chất lượng, tránh quảng cáo quá mức và tạo điều kiện cho khách hàng dễ dàng tương tác với trang web.
- Tối ưu hóa cho thiết bị di động: Vì hầu hết người dùng sử dụng điện thoại di động để truy cập Internet, nên tối ưu hóa trang web cho các thiết bị di động là cực kỳ quan trọng. Điều này có thể được đạt được bằng cách sử dụng thiết kế đáp ứng và tối ưu hóa tốc độ tải trên các thiết bị di động.
Tóm lại, Tối ưu website là một quá trình đa chiều và cần nhiều yếu tố khác nhau để đạt được một trang web tốt nhất cho người dùng.
PageSpeed Insights là gì?
PageSpeed Insights là một công cụ của Google giúp đánh giá tốc độ tải trang web và đưa ra các khuyến nghị cải thiện hiệu suất trang web. Công cụ này sử dụng một số tiêu chí để đo lường tốc độ tải của trang web, bao gồm thời gian tải trang đầu tiên, thời gian tải toàn bộ trang và tốc độ tải các tài nguyên trên trang.
Sau khi đánh giá xong, PageSpeed Insights sẽ cung cấp cho người dùng một bản đánh giá chi tiết về hiệu suất của trang web và các đề xuất để cải thiện tốc độ tải trang web. Công cụ này được sử dụng rộng rãi để giúp các nhà phát triển web và chủ sở hữu trang web cải thiện hiệu suất trang web của họ.
5 lợi ích của việc tối ưu website
Việc tối ưu website có rất nhiều lợi ích đối với trang web và người dùng của nó. Dưới đây là 5 lợi ích chính của việc tối ưu website:
- Tăng tốc độ tải trang: Tối ưu website giúp cải thiện tốc độ tải trang, giúp trang web được tải nhanh chóng và mượt mà. Điều này làm tăng khả năng tương tác của người dùng với trang web, giảm tỷ lệ thoát trang và tăng khả năng tương tác của khách hàng với trang web.
- Cải thiện trải nghiệm người dùng: Tối ưu website giúp cải thiện trải nghiệm người dùng, giúp khách hàng dễ dàng tìm kiếm thông tin, tiết kiệm thời gian và tăng khả năng tương tác của họ với trang web.
- Tăng độ tìm thấy trên các công cụ tìm kiếm: Tối ưu website giúp tăng độ tìm thấy trên các công cụ tìm kiếm bằng cách cải thiện SEO và tối ưu hóa từ khóa, từ đó giúp tăng lượng traffic trang web.
- Tăng hiệu quả kinh doanh: Tối ưu website giúp tăng hiệu quả kinh doanh bằng cách tăng khả năng tương tác của khách hàng với trang web, tăng tỷ lệ chuyển đổi và tăng doanh số bán hàng.
- Nâng cao uy tín của thương hiệu: Tối ưu website giúp nâng cao uy tín của thương hiệu trên mạng, giúp khách hàng tin tưởng và chọn lựa trang web của bạn thay vì các trang web khác.
Việc tối ưu website mang lại rất nhiều lợi ích cho trang web và người dùng của nó, giúp tăng tốc độ tải trang, cải thiện trải nghiệm người dùng, tăng độ tìm thấy trên các công cụ tìm kiếm, tăng hiệu quả kinh doanh và nâng cao uy tín của thương hiệu.
Cách tối ưu hiệu năng Website WordPress
CHỌN HOSTING NÀO CHO WORDPRESS ĐỂ CÓ HIỆU NĂNG TỐT?
Rất nhiều người lầm tưởng rằng phải mua Hosting/VPS tốc độ cao và đắt tiền thì mới có hiệu năng tốt.
Điều này là hoàn toàn sai lầm.
Vì vậy, bạn không cần một gói cước Hosting hay VPS đắt tiền để có thể đạt điểm hiệu năng cao cho website WordPress.
Ngược lại, lựa chọn một gói cước giá rẻ phù hợp để bắt đầu là lựa chọn tốt nhất.
THEME WORDPRESS CHO TỐC ĐỘ TỐT NHẤT
Hiện nay trên thị trường có khá nhiều theme mang lại hiệu năng tốt cho website WordPress như:
- Twenty Twenty Three (theme mặc định của WordPress)
- Astra
- OceanWP
- GeneratePress
- Hello Elementor
- Hestia
Bản thân mình dùng GeneratePress, tuy nhiên các theme còn lại cũng có thể đạt tốc độ cực đỉnh. Bạn thích trường phái nào thì theo thôi.
Lý do mình chọn GeneratePress để xây dựng website là:
- GeneratePress sử dụng block editor tương thích với Guternberg editor của WordPress
- Combo GeneratePress + Generate mang lại tính tuỳ biến và khả năng mở rộng cực cao
- GeneratePress là theme “sạch” nhất mà mình biết, không có nhiều tính năng thừa
- Nếu bạn chịu khó vọc vạch CSS một chút thì GeneratePress là lựa chọn số một
- Cộng đồng cực lớn, bất kỳ vấn đề gì bạn gặp phải cũng đã có người gặp rồi, và có giải pháp trên forum của GeneratePress
- Phù hợp với các website phong cách tối giản – minimalism
Những điểm yếu của GeneratePress:
- Cũng chính vì theme rất sạch nên không có nhiều tính năng tuỳ biến tích hợp sẵn
- Hơi khó tiếp cận cho người mới không biết tí gì về CSS
Nói là hơi khó nhưng thực sự bạn chỉ cần biết một chút tiếng Anh và chịu khó Google là có thể tuỳ biến GeneratePress rồi.
Một cái hay nữa là GeneratePress có bán bản quyền trọn đời.
Nếu bạn dùng Elementor để built website thì ưu tiên dùng Hello Elementor, theme này cũng cực nhẹ nhàng và tinh giản. Kết hợp với Elementor Pro, bạn đã có trong tay một combo có thể build website cho mọi nhu cầu, với giao diện kéo thả đơn giản.
Ngoài ra, những theme WordPress đã được anh em bạn bè mình kiểm chứng về tốc độ bao gồm Astra, OceanWP.
PLUGINS TỐI ƯU HIỆU NĂNG TỐT NHẤT CHO WORDPRESS
Khi sử dụng plugin tối ưu hiệu năng website thì cần quan tâm tới một số yếu tố chính sau:
- Cache: Cơ bản – buộc phải có
- Nén ảnh: Cơ bản – có thể dùng plugin hoặc nén ảnh thủ công trước khi tải lên web
- Tối ưu file code HTML, CSS, JS: Cơ bản – thường đi kèm plugin Cache
- Nén file code: Nâng cao – thường đi kèm plugin Cache
Cache là một trong những tác vụ quan trọng nhất khi tối ưu hiệu năng website, nó có thể giúp bạn rút ngắn thời gian tải trang tới 80%.
Và với WordPress thì công việc này cực tiện lợi vì đã có plugin hỗ trợ. Bạn không cần phải viết một dòng code nào cả.
Vậy Cache là gì và tại sao nó quan trọng với tốc độ tải trang?
Hiểu đơn giản thì mỗi lần một người dùng truy cập website, trình duyệt của họ (như Google Chrome, Safari, FireFox, v.v.) sẽ gửi một yêu cầu tải trang tới máy chủ của bạn. Sau đó máy chủ gửi về trình duyệt các file cần thiết để dựng thành trang web, bao gồm HTML, CSS, Javascript.
Cache ở phía trình duyệt (hầu hết mọi trình duyệt hiện nay đều có) giúp người dùng lưu các thông tin trên vào trình duyệt, và giúp tải website nhanh hơn từ lần thứ hai trở đi.
Vậy còn lần đầu tải trang thì sao?
Vì khi người dùng lần đầu vào web mà đã thấy tốc độ chậm thì nhiều khả năng họ sẽ thoát và không xem nữa. Bạn sẽ có một lượt bounce.
Câu trả lời là Cache ở máy chủ.
Với các plugin Cache trên WordPress, máy chủ web sẽ lưu một bản lưu tạm thời. Giúp trả về website nhanh hơn khi người dùng ghé thăm lần đầu.
OK dài dòng quá. Vậy Plugin Cache nào là tốt nhất?
Hiện tại có nhiều plugin khá tốt để cache WordPress như:
- Litespeed Cache
- WP Fastest Cache
- Wp Rocket
- Wp-Optimize
- Auto Optimize
- WP Super Cache
Việc lựa chọn Plugin nào phụ thuộc nhiều vào kiến trúc theme mà bạn sử dụng. Và cách bạn tuỳ biến cũng như xử lý xung đột
Bản thân mình sử dụng GeneratePress, thì WpRocket và Wp-Optimize mang lại hiệu năng tốt nhất.
Vì vậy mình sẽ so sánh 2 plugin này để các bạn có thêm góc nhìn:
WP-OPTIMIZE
Theo mình thì Wp-Optimize là plugin cache miễn phí tốt nhất cho WordPress.
Trang web nContent.net các bạn đang đọc hiện đang sử dụng Wp-Optimize để tối ưu hiệu năng, và mình thường đạt điểm từ 96 – 100 cho hạng mục Performance trên Google PageSpeed Insights.
Một số tính năng nổi bật của Wp-Optimize:
- Thiết lập Cache cho website
- Tối ưu (minify) file code HTML/CSS/JS
- Loại bỏ load JS khỏi luồng chính (defer loading Javascript)
- Nén file code theo định dạng Gzip
- Nén ảnh, tạo bản sao định dạng WebP sử dụng thư viện miễn phí reSmush.it
- Tối ưu database (table & transient)
Tất cả những giá trị trên bạn nhận được hoàn toàn miễn phí. Và Wp-Optimize cũng có đội ngũ support nhiệt tình trên WordPress support forum, ngay cả khi bạn chỉ sử dụng bản miễn phí.
WPROCKET
WpRocket là một trong những plugin Cache tốt nhất cho website WordPress.
Tương tự Wp-Optimize, WpRocket giúp thiết lập Cache, Minify HTML/CSS/JS, Defer JS, Nén GZIP, tối ưu Database.
Ngoài ra WpRocket còn có dịch vụ CDN, giúp phân bổ trang web của bạn trên các server tại nhiều địa điểm vật lý khác nhau trên thế giới, thích hợp với các site vận hành ở nhiều nước.
(Mặc dù bạn cũng có thể đăng ký CDN miễn phí với Cloudflare, nhưng nếu bạn muốn giải pháp tất cả trong một thì WpRocket là câu trả lời.)
Lợi thế của WpRocket là nó tối ưu tốt hơn, và cần rất ít hiệu chỉnh. Gần như chỉ cần cài plugin và bật tối ưu lên là website của bạn đã sẵn sàng đạt hiệu năng tốt nhất.
Tuy nhiên, nhược điểm của WpRocket là không có bản miễn phí. Bạn phải trả 50$ để được sử dụng WpRocket.
Tệ hơn là ngay cả khi là một plugin trả phí, WpRocket cũng không có sẵn module tối ưu ảnh.
Bạn cần mua thêm Imagify (plugin tối ưu ảnh của team WpRocket) hoặc sử dụng một plugin tối ưu ảnh khác.
NÉN ẢNH ĐỂ CÓ HIỆU NĂNG WORDPRESS TỐT HƠN
Sau khi đã chọn xong plugin Cache, bước tiếp theo là nén ảnh.
Nguyên lí nén ảnh là làm sao để ảnh của bạn có dung lượng càng nhẹ càng tốt. Để làm được điều này thì cần 2 thứ:
- Ảnh có kích thước vừa phải, không nên quá lớn so với màn hình trang web (thường không quá 1200px chiều ngang, với màn hình thông thường – không phải retina)
- Định dạng ảnh nhẹ: như WebP và AVIF.
Nếu bạn đã có một website đăng nhiều bài viết và chưa tối ưu ảnh, giải pháp tiết kiệm thời gian nhất là sử dụng một plugin để tối ưu toàn bộ ảnh đã upload lên website như:
- ShortPixel
- EWWWWW image optimizer
- Smush
- reSmush.it
Ngược lại, nếu bạn xây dựng trang web mới từ đầu, hãy chú ý khi làm ảnh up lên web đúng kích thước chiều ngang, sau đó chuyển đổi thành định dạng WebP trước khi đăng lên web.
Một số kích thước ảnh thông dụng là:
1200px/1024px/900px/768px (chiều ngang)
Nếu website bạn quan trọng tính thẩm mỹ như website nghệ thuật, thiết kế, vẽ tranh, v.v. thì sử dụng ảnh có kích thước lớn hơn.
Ngược lại nếu chỉ là ảnh thumbnails cho blog thì 768px là đủ.
TỐI ƯU (MINIFY) FILE HTML/CSS/JS
Thường thì công việc tối ưu code sẽ được thực hiện bởi plugin Cache. Bạn chỉ cần bật tính năng minify HTML, CSS/JS là được.
Minify HTML/CSS/JS là việc loại bỏ những đoạn mã không hoạt động, khoảng cách thừa trong file code của website.
TẢI CHẬM FILE JAVASCRIPT – LOAD JS DEFERRED
Tương tự, việc defer loading JS cũng được thực hiện bởi plugin cache.
Tuy nhiên bạn cũng nên lưu ý backup trước khi bật tính năng này, bởi nó có thể gây ra gián đoạn cho các tính năng trên web.
XOÁ BỎ NHỮNG ĐOẠN CSS KHÔNG DÙNG ĐẾN
Khi xây dựng website, có rất nhiều trường hợp chúng ta viết đè code CSS. Điều này xảy ra do việc thiết kế không có hệ thống.
Điển hình là việc thường xuyên sử dụng thẻ !important trong code CSS, hoặc áp dụng nhiều style đè lên nhau cho một element. Hậu quả là browser phải đọc những đoạn mã CSS mà không được sử dụng để tạo nên giao diện website.
Thật may mắn là một số plugin như WpRocket có tính năng xoá bỏ những đoạn CSS không dùng đến.
Tất cả những gì bạn cần làm là bật tính năng này lên trong phần Optimization.
SỬ DỤNG CDN ĐỂ TĂNG TỐC TỐI ƯU WEBSITE
CDN (Content Delivery Network) là phương pháp phân phối nội dung website của bạn trên một mạng lưới server rộng khắp.
Bằng cách này, website của bạn sẽ luôn đảm bảo tốc độ tải trang tốt nhất.
CDN là giải pháp không thể thiếu với các website có người dùng truy cập đa quốc gia.
Tuy nhiên nó cũng giúp cải thiện rất nhiều tốc độ tải trang.
Bạn có thể cài đặt CDN miễn phí cho website WordPress với CloudFlare.
Chi tiết mình sẽ chia sẻ trong một bài khác.
[BONUS] TOP CÁC MẸO ĐẠT 100 ĐIỂM GOOGLE PAGESPEED
Những mẹo này tới từ kinh nghiệm cá nhân, vì vậy có thể không đúng trong mọi trường hợp.
Tuy nhiên mình hứa nó sẽ giúp bạn đạt ít nhất 90 điểm!
Ngoài ra còn rất nhiều cách làm khác cũng có thể đạt kết quả tương tự, không nhất thiết phải theo những mẹo này.
- Sử dụng combo theme nhẹ + plugin cache tốt. Gợi ý: theme GeneratePress, theme Elementor, plugin Wp-Optimize, plugin WpRocket. Cách sử dụng các plugin này mình đã nói ở phần trên.
- Luôn tối ưu ảnh trước khi đăng lên web. Chiều rộng ảnh không nên quá 1200px, dung lượng ảnh không nên quá 100KB (lý tưởng nhất là 50KB trở xuống), ảnh định dạng WebP hoặc AVIF. Nếu lười tối ưu ảnh, bạn có thể sử dụng plugin trả phí như Imagify, Smush Pro, ShortPixel.
- Tối ưu SEO onpage cho các trang bạn đã tạo: Tiêu đề, các thẻ Headings, nội dung, thông số ảnh, v.v. Mình sử dụng Yoast SEO bản miễn phí để tối ưu theo một Checklist tuỳ chỉnh có sẵn (Bạn nào cần file checklist thì để lại email, mình sẽ gửi).
- Tối ưu giao diện: bao gồm độ tương phản của màu sắc, kích thước font chữ, khoảng cách giữa các nguyên tố trên trang, v.v.
- Giữ website tối giản: Nếu cần sử dụng plugin cho bất kỳ việc gì (ví dụ Form đăng ký, popup,…), hãy xem xét trong theme có chưa, nếu chưa có thì tìm những plugin đơn giản nhất, không có những tính năng thừa mà bạn không sử dụng tới. Ngoài ra, hãy thường xuyên kiểm tra và xoá các plugin không sử dụng tới.
- Sử dụng CDN: Cài đặt CDN miễn phí của CloudFlare để website có tốc độ tải tốt hơn.
Chỉ với những gợi ý đơn giản trên về tối ưu website, website wordpress của bạn sẽ luôn trong tình trạng hiệu năng tốt nhất.
