Lưu trữ tài nguyên kích thước lớn sang máy chủ khác
Nhiều người cùng kết nối một lúc có thể làm nghẽn đường truyền của bạn với hàng đống yêu cầu xem cùng một tấm hình trên website. Gánh nặng dữ liệu có thể chuyển sang những website chuyên để lưu trữ và chia sẻ ảnh như ImagaShack, Photobucket hay Flickr. Bằng cách này, máy chủ web của bạn chỉ cần đảm bảo phần văn bản text và file ảnh cỡ nhỏ, giảm đáng kể băng thông đồng nghĩa với việc phục vụ được nhiều người một lúc hơn.
Tối ưu hóa mã CSS
Hiện nay, nhiều website bắt đầu sử dụng CSS (Cascade Style Sheet) để định dạng. Việc ứng dụng CSS giúp nhà lập trình Web tách riêng biệt nội dung và trình bày, tạo thuận tiện cho quá trình lập trình và sửa đổi, nâng cấp. Mặc dù bảng CSS nhìn bắt mắt và hiệu quả hơn định dạng bảng HTML, nhưng nó đòi hỏi bạn phải tối ưu hóa mã nguồn của chúng mới mong đạt được tốc độ tối ưu. Đoạn mã CSS “sạch sẽ” sẽ giúp trình duyệt giải mã trang web nhanh hơn.
Ví dụ: Thay vì viết:
margin-top: 20px;
margin-right: 10px;
margin-bottom: 20px;
margin-left: 10px;
Bạn nên viết:
margin: 20px 10px 20px 10px;
Theo các chuyên gia tối ưu hóa của Yahoo thì các mã CSS nên được đặt ở phần đầu của web. Điều này đặc biệt ý nghĩa nếu trang của bạn lớn và có nhiều đối tượng. Nếu bạn đặt CSS ở cuối hoặc giữa trang web, trình duyệt sẽ dùng định dạng mặc định để hiện thị, sau đó mới tải định dạng bằng CSS. Điều đó đòi hỏi thêm thời gian tính toán và tất nhiên người dùng sẽ khó chịu khi nhìn một website vỡ tung khi chưa định hình. Thậm chí, một số trình duyệt cũng cấm đặt CSS tại cuối website.
Theo chuẩn của W3C thì tệp tin định dạng CSS phải được tải trong phần head của tài liệu HTML.
Tối ưu hóa hình ảnh
Có 4 loại định dạng hình ảnh sử dụng phổ biến trên web: PNG, JPG, /JPEG và GIF. Hầu hết các phần mềm xử lý ảnh như Adobe Photoshop đều có tính năng “Save for Web” để tối ưu tỉ lệ giữa chất lượng hình và kích thước file. Ngoài ra bạn cũng nên sử dụng thuộc tính alt để khai báo, miêu tả ảnh IMG, giúp người dùng khiếm thị có thể nhận biết được nội dung của hình ảnh đăng tải.
Khai báo kích thước hình ảnh
Nhiều lập trình viên nghiệp dư “quên” khai báo tag chiều cao và rộng của ảnh khi viết mã HTML. Hai thông số này báo với trình duyệt kích thước của ảnh trước khi dữ liệu được tải về. Nếu không được khai báo trước, trình duyệt phải tự tính toán kích thước bằng cách download toàn bộ hình ảnh về, sau đó mới đến lượt các dữ liệu khác.
Khi khai báo hình ảnh có đầy đủ các tag, trình duyệt sẽ dành 1 khoảng trống vừa đúng kích thước ảnh và tiếp tục tải dữ liệu. Như vậy, người xem có thể đọc ngay phần văn bản trong khi hình ảnh vẫn tiếp tục được hiện ra từng phần. Việc khai báo kích cỡ hình ảnh sẽ giúp trình duyệt biên dịch trang nhanh hơn, từ đó giảm thời gian chờ đợi của người dùng.
Giảm thiểu sử dụng Javascript
Các hiệu ứng hoạt hình của Java script rất bắt mắt và nhiều người có xu hướng đưa chúng vào website của mình. Tuy nhiên, sử dụng quá nhiều Javascript có thể làm trình duyệt bị treo cứng khiến người dùng bực mình. Phải cân nhắc thật kỹ lưỡng trước khi sử dụng chúng.
Vị trí đặt các đoạn mã script cũng khá quan trọng đối với tốc độ hiển thị. Lời khuyên của dân lập trình chuyên nghiệp: chỉ để những script thực sự quan trọng có ảnh hưởng toàn trang lên đầu, còn những hiệu ứng khác (hoạt hình, thống kê,…) thì cho xuống cuối trang.
Việc đưa Javascript và CSS ra liên kết bên ngoài tốt hơn là chèn thẳng vào trang web. Những file này sẽ được lưu tại bộ nhớ đệm (cache) của trình duyệt và người dùng sẽ không phải download lại chúng mỗi khi cần đến. Nó giảm đáng kể thời gian và băng thông của máy chủ cũng như người dùng ngoài ra cũng giúp mã nguồn HTML của trang trông sạch sẽ và dễ hiểu hơn.
Tối ưu hóa liên kết
Chú ý mỗi liên kết được đặt trên website hay blog của bạn được viết một cách ngắn gọn và chính xác. Bạn nên loại bỏ bớt các tham số không cần thiết trong địa chỉ URL của Web động và sử dụng các liên kết URL ngắn gọn và dễ hiểu. Việc sử dụng chính xác liên kết sẽ giảm bớt những yêu cầu không đáng có đối với máy chủ trong một số trường hợp.
Giảm bớt các yêu cầu HTTP tới máy chủ
Khi mở website, mỗi đối tượng trên trang (hình ảnh, script, hình vẽ, đường kẻ, …) đều tạo ra 1 yêu cầu tới máy chủ để tải về. Tất nhiên, càng nhiều đối tượng thì việc tải về càng lâu hơn. Vì thế, hãy giảm thiểu số đối tượng trên cùng 1 trang và cố gắng gộp file CSS với các script lại với nhau.
Kết luận của quảng bá Web
Trên đây là 7 bước cơ bản tối ưu hoá mã nguồn HTML để tăng tốc cho website, bạn có thể kết hợp thêm việc tối ưu máy chủ Web hay phần mềm quản trị nội dung CMS như cài đặt thêm bộ nhớ Cache, giảm bớt các truy vấn cơ sở dữ liệu, hiệu chỉnh thời gian time out đối với các kết nối, hoặc cấm các bọ tìm kiếm đánh chỉ số trong những phần làm hao tổn tài nguyên máy chủ… Tất cả các yếu tố này nếu được tổng hợp tốt sẽ giúp bạn cải thiện đáng kể tốc độ tải trang.
