Tăng tốc cho trang Web cá nhân của bạn

Một vấn đề khá phổ biến với những người thiết kế Web nghiệp dư là trang Web đưa lên mạng thường không được tối ưu để có tốc độ khả dĩ chấp nhận được. Dưới đây là một số kinh nghiệm nhỏ để rút ngắn thơì gian tải của các trang Web.

   Xu hướng của Web hiện nay là sử dụng font Unicode. Lợi điểm của nó thì quá rõ ràng: người dùng khỏi cần trên máy tính của mình hàng tá font để có thể xem được các trang Web của nhiều thứ tiếng hoặc được soạn bằng các bộ mã khác nhau (như TCVN, VNI…). Song nếu bạn soạn thảo font Unicode bằng Front Page, có thể bạn sẽ thấy trang Web của mình có dung lượng lớn hơn so với một trang Web cùng nội dung bình thường. Nguyên nhân là Front Page (từ phiên bản 2000 trở lên) gặp phải khó khăn khi mã hoá những ký tự  có dấu tiếng Việt: chữ “Ư” được mã hoá thành”ư”, chữ “Ơ” thành “ơ”… Để khắc phục, bạn hãy dùng một chương trình chuyển mã để thu nhỏ file .htm của mình, chẳng hạn như Vietkey Converter.

   Có thể bạn đã nghe nói đến sử dụng font động cho trang Web, font sẽ được tải đến máy tính của người truy cập nếu cần thiết. Đóng gói font động cũng đồng nghĩa với việc tốn thêm một chút thời gian tải font (trong trường hợp trên thì trong máy người dùng chưa có font sử dụng trong trang Web) và thường chỉ được áp dụng trong các trang Web chuyên nghiệp. Quyền quyết định là ở bạn, song theo ý kiến của tôi thì nên sử dụng font Unicode.

   Yếu tố làm chậm đáng kể tốc độ tải của một trang Web chính là những bức ảnh. Đành rằng mọi trang Web ngày nay đều có sử dụng ảnh minh hoạ để làm tăng thêm sự sống động, song người thiết kế Web cần phải biết kết hợp vừa phải giữa ảnh và nội dùng để đảm bảo tốc độ tải.  Đối với ảnh tĩnh, cách tốt nhất là dùng những định dạng nén tốt như JPEG hay PNG thay vì dạng bitmap chưa nén. Về phần hoạt ảnh GIF, hãy cố gắng tạo ra những sản phẩm có số khung hình (frame) không quá nhiều, và có thể giảm số màu của ảnh để dung lượng nhỏ hơn. Trên thực tế mắt người khó phân biệt được sự khác nhau giữa những bức ảnh 256 màu và 64 màu, song nếu bạn sử dụng một ảnh GIF 64 màu có nghĩa là bạn đã giảm được 1/3 kích thước file ảnh. Có rất nhiều phần mềm giúp bạn có thể tạo ra những file ảnh GIF dung lượng nhỏ được tối ưu cho Web như: BannerShop GIF Animator, Animated GIF Animator, GIF Movie Gear…

   Một số bạn còn lập một Web album cho riêng mình. Nếu vậy trong trang chính chỉ nên có các hình ảnh thu nhỏ (độ phân giải đủ thấp, tất nhiên rồi!), bên cạnh đó có liên kết tới file ảnh gốc để người truy cập có thể phóng to nếu muốn.

   Khả năng tạo frame của HTML bây giờ không còn được dùng nhiều trên thế giới. Những site nổi tiếng nhất đều đa sử dụng thiết kế  không có frame, ví dụ như www.cnn.com, www.time.com… và cũng đã bắt đầu xuất hiện những Web host miễn phí không hỗ trợ frame như www.stormpages.com. Thiết kế frame không khéo có thể gây khó khăn cho người truy cập, và hơn nữa nó còn chiếm một  phần diện tích quý  báu. Ngoài ra, để hiển thị đủ một trang Web nhiều frame, trình duyệt phải lần lượt hiển thị nội dung của từng frame, mất thời gian nhiều hơn so với khi sử dụng thiết kế không có frame.

4.  Các Java Script

   Mã JavaScropt hiện nay rất sẵn trên mạng và phần lớn còn được cho không. Do vậy, người làm Web nghiệp dư không còn nhất thiết  phải biết viết mã JavaScript mới có thể  trang bị cho mình những khả năng tương tác cao hay hiệu ứng mới lạ. Điều cần thiết là phải biết sử dụng các script này có chừng mực vì lý do an ninh (trình duyệt của người duyệt Web có thể cấm các script), những script được đưa trực tiếp vào trang Web sẽ làm tăng dung lượng của file .htm và yêu cầu trình duyệt mất nhiều thời gian giải mã hơn. Nếu bạn tìm được những script miễn phĩ trên mạng, hãy lưu nó thành một file riêng rồi đưa một tham chiếu đến file script đó vào trong trang Web của mình thay vì dán trực tiếp nội dung của toàn bộ script vào file nguồn .html. Điều này cũng đúng với cả khi bạn sử dụng CSS.

   Hover cho liên kết bằng chữ, một phần nhỏ của CSS, không phải là một kỹ thuật khó đòi hỏi dày công nghiên cứu, trái lại nó còn đơn giản hơn HTML. Với hover, những liên kết giờ đây không còn chỉ là những hàng chữ màu xanh da trời có gạch chân mà có thể biến đổi đẹp mắt với những sự kiện mouseOver. Sử dụng hover với liên kết text, trang Web sẽ vẫn có những hiệu ứng đẹp mắt đồng thời đảm bảo dung lượng nhỏ nhất có thể. Bạn cũng có thể sử dụng hover với hình ảnh, song hãy đảm bảo rằng trong trang đó chứa không quá 8 liên kết ảnh có độ phân giải thấp, nếu không trình duyệt phải mất  một khoảng thời gian dài mới tải nổi trang Web của bạn.

   Trên đây mới chỉ là một số cách đơn giản và dễ nhận thấy nhất giúp bạn tối ưu trang Web của mình, ngoài ra trong quá trình thiết kế chắc chắn bạn sẽ còn tìm ra nhiều điều mới khác.

   Chúc vui!