Một webmaster chuyên nghiệp cần tìm mọi cách để tăng tốc website của mình, cải thiện tốc độ website là yếu tố quan trọng và cũng như là ưu thế khi truy nhập website. Sau đây là một số phương pháp để giúp bạn cải thiện tốc độ “load” website:

Hạn chế yêu cầu HTML

Khi người dùng mở một website bất kì, quãng thời gian mà người dùng phải chờ đợi thường dành cho việc truyền nhận dữ liệu giữa máy chủ dịch vụ với trình duyệt. Chính những yêu cầu HTTP đã làm chậm trễ thời gian đáp ứng của trang web và việc này đồng nghĩa với việc bạn phải tải hàng chục đối tượng khác nhau (VD: hình ảnh, Flash,…) và việc này có thể tiêu tốn vài giây.

Bước đầu tiên để giảm sự chậm trễ đó chính là giảm số lượng các đối tượng trên website của bạn. Hãy loại bỏ những hình ảnh không cần thiết, chỉnh sửa lại tiêu đề,…

Bước thứ hai là phải đảm bảo rằng các yêu cầu của bạn đối với các tệp tin bên CSS và Script được gom lại trong một tệp duy nhất. Ví dụ thay vì sử dụng ba dòng CSS để bố trí trang của bạn

Code:

<link rel="stylesheet" type="text/css" href="/body.css" />
<link rel="stylesheet" type="text/css" href="/side.css" />
<liên kết rel = "stylesheet" type = "text / css" href = "/ footer.css" />

Bạn nên sử dụng một dòng ngắn gọn như thế này

Code:

<link rel="stylesheet" type="text/css" href="/style.css"

Tối ưu hóa CSS

Hiện nay CSS là một ngôn ngữ rất phổ biến khi thiết kế website, Cascading Style Sheets làm cho website của bạn hoạt động hiệu quả hơn bởi vì nó cho phép các trình duyệt lưu trữ các thông tin liên quan đến tệp tin css một cách trực tiếp, loại bỏ việc đọc lại thông tin khi một trang web được tải. Mặ dù CSS hoạt động hiêu quả hơn HTML thì bạn vẫn phải tối ưu hóa mã CSS để làm cho website của bạn nhanh hơn

Điều đầu tiên bạn cần làm là xác định các mã phân tán và tổng hợp nó lại với nhau. Ví dụ thay vì:

Code:

margin-top: 10px;
margin-right: 20px;
margin-bottom: 10px;
margin-left: 20px;

Bạn nên sử dụng

Code:

margin: 10px 20px 10px 20px;

Thay vì

Code:

<p class="decorated">A paragraph of decorated text</p>
<p class="decorated">Second paragraph</p>
<p class="decorated">Third paragraph</p>
<p class="decorated">Forth paragraph</p>

Bạn nên sử dụng

Code:

<div class="decorated">
<p>A paragraph of decorated text</p>
<p>Second paragraph</p>
<p>Third paragraph</p>
<p>Forth paragraph</p>
</div>

Bên cạnh đó bạn có thể sử dụng thử công cụ tối ưu hóa CSS như CleanCSS. Các công cụ này có thể giúp bạn hợp nhất các Selector giống nhau, loại bỏ các thuộc tính thừa, loại bỏ khoảng trắng…

Tránh chồng nhiều bảng lên nhau

Khi đặt một bảng bên trong một bảng khác phải mất rất nhiều thời gian để trình duyệt có thể đọc được toàn bộ file html của bạn, và sau đó nó sẽ lại phải mất một cơ số thời gian nữa để sắp xếp lại. Nếu có thể, hãy sử dụng CSS để tạo các cột trên trang của bạn.

Chia nhỏ trang

Tách những trang dài thành những trang ngắn hơn, khi thực hiện việc này bạn sẽ làm cho nội dung trang hiển thị nhanh hơn nhiều so với khi chưa tách trang.

Xóa những khoảng trắng dư thừa

Khoảng trắng là những khoảng trống giữa các dòng code của bạn, loại bỏ các tab và khoảng trắng không cần thiết sẽ làm trang web load nhanh hơn rất nhiều. Ngoài ra việc này còn giúp website giảm thiểu kích cỡ tập tin.

Khai báo kích thước

Đây là một yếu tố quan trọng mà nhiều người thường có xu hướng bỏ qua khi thiết kế website. Trong lúc sử dụng hình ảnh hoặc các bảng trên website, bạn nên chú ý tới thẻ “width” và “height”. Nếu trình duyệt không tìm thấy những thẻ này nó sẽ hiển thị kích thước mặc định của hình ảnh, của bảng và phần còn lại của trang web. Dưới đây là một ví dụ của mã có chứa thẻ “height” và thẻ”width:

Code:

<img id="moon" height="200" width="450" **src="http://www.domain.com/moon.png" alt="moon image" />

Khi có thẻ “width” và”height” trình duyệt sẽ tự động biết kích thước của hình ảnh. Ngoài việc cải thiện thời gian tải của trang phương pháp này còn thân thiện với người dùng khi họ đọc bài viết của bạn và khi tải hình ảnh về.

Sử dụng dấu “/” trên các liên kết

Khi máy chủ mở ra một liên kết kiểu như: [You must be registered and logged in to see this link.] nó sẽ cần phải tìm những tập tin hoặc website có địa chỉ đó, điều này có thể gây lãng phí thời gian.

Thay vì sử dụng liên kết như trên, bạn hãy thêm một dấu gạc chéo (“/”) vào cuối như sau: “http://www.tendomaincuaban.com/about/” để máy chủ web không tốn thời gian tìm tệp tin và địa chỉ web