Hướng dẫn truyền thông - Ảnh GIF

GIF là một trong những định dạng hình ảnh chính được sử dụng trên Web.

Bài viết này giải thích chi tiết về các tính năng và kỹ thuật sử dụng hình ảnh GIF.

Hiểu định dạng hình ảnh

Cả HTML và XHTML đều không quy định định dạng hình ảnh chính thức. Tuy nhiên, các trình duyệt phổ biến lại quy định một số định dạng hình ảnh nhất định: thường thì là GIF và JPEG. Các định dạng đa phương tiện khác hầu hết cần phần mềm hỗ trợ đặc biệt, người dùng trình duyệt mỗi người đều phải tải, cài đặt và sử dụng đúng cách các ứng dụng này mới có thể xem hoặc nghe các tệp đặc biệt này. Do đó, GIF và JPEG trở thành tiêu chuẩn thực tế trên Web cũng không phải là điều ngạc nhiên.

Trước khi xuất hiện của Web, hai định dạng hình ảnh này đã được sử dụng rộng rãi, vì vậy có rất nhiều phần mềm hỗ trợ giúp chúng ta tạo hình ảnh theo hai định dạng này. Tuy nhiên, mỗi định dạng có ưu và nhược điểm riêng, một số trình duyệt sẽ sử dụng tính năng của chúng để thực hiện các hiệu ứng hiển thị đặc biệt.

GIF

Định dạng GIF là định dạng trao đổi hình ảnh (Graphics Interchange Format, GIF), định dạng này ban đầu được CompuServe phát triển để truyền tải hình ảnh cho người dùng dịch vụ trực tuyến của mình.

Tính năng của định dạng GIF

Định dạng GIF có rất nhiều tính năng, vì vậy nó rất phổ biến trong HTML/XHTML.

Tính năng thứ hai của định dạng GIF là nó sử dụng một kỹ thuật nén đặc biệt có thể giảm kích thước tệp hình ảnh một cách đáng kể, từ đó có thể truyền tải nhanh hơn trên mạng. Và nén GIF là nén

Ngoài ra, hình ảnh GIF còn rất dễ thực hiện hiệu ứng animation.

Phiên bản và màu sắc của định dạng GIF

Mặc dù tất cả các tệp hình ảnh GIF đều sử dụng phần mở rộng tệp .gif (hoặc .GIF), thực tế lại có hai phiên bản GIF: GIF87 ban đầu và GIF89a,后者 hỗ trợ nhiều tính năng mới hơn, bao gồm nền trong suốt, lưu trữ giao thoa và animation, những tính năng này rất phổ biến trong cộng đồng người sáng tạo Web.

Hiện nay, tất cả các trình duyệt phổ biến đều hỗ trợ hai định dạng GIF này, chúng đều sử dụng cùng một phương án để ánh xạ giá trị pixel 8 bit vào bảng màu, vì vậy mỗi hình ảnh có thể có tối đa 256 màu.

Số lượng màu thực tế của hầu hết các hình ảnh GIF ít hơn, một số công cụ đặc biệt (như Macromedia Fireworks) có thể đơn giản hóa những màu này trong hình ảnh chi tiết hơn. Bằng cách đơn giản hóa màu sắc, có thể tạo ra hình ảnh màu nhỏ hơn và tăng cường độ trùng lặp pixel để nén tệp nhiều hơn, từ đó tăng tốc độ tải xuống.

Tuy nhiên, do số lượng màu hạn chế, hình ảnh được mã hóa bằng GIF không phải lúc nào cũng phù hợp, đặc biệt là đối với những hình ảnh có hiệu ứng chân thực như ảnh chụp. GIF có thể được sử dụng để tạo những biểu tượng và hình ảnh có ít màu sắc rất đẹp.

Dù là những nhà sáng tạo rất kén chọn cũng sẽ chọn GIF

Vì hầu hết các trình duyệt đồ họa đều hỗ trợ rõ ràng định dạng GIF, vì vậy nó hiện là định dạng mã hóa hình ảnh phổ biến nhất trên Web. Cả hình ảnh liên kết trong dòng và hình ảnh liên kết ngoài đều có thể sử dụng định dạng này. Nếu bạn do dự trong việc chọn định dạng hình ảnh, sử dụng GIF chắc chắn là một lựa chọn đúng đắn. Nó gần như luôn luôn hoạt động trong mọi trường hợp.

Kỹ thuật hình ảnh GIF

Hình ảnh GIF có ba kỹ thuật đặc biệt: quét hàng chẵn (interlacing), tính trong suốt (transparency) và animation.

Quét hàng chẵn

Bằng cách quét hàng chẵn, hình ảnh GIF có thể xuất hiện ngay lập tức trên màn hình, thay vì hiển thị từ trên xuống dần. Thường thì, hình ảnh được mã hóa bằng GIF là một chuỗi dữ liệu pixel từ trên xuống dưới, theo thứ tự hàng. Do đó, khi hiển thị hình ảnh GIF thông thường trên màn hình, nó giống như kéo mở rèm, còn hình ảnh GIF có quét hàng chẵn thì giống như cuộn rèm cuốn. Điều này là vì chuỗi dữ liệu pixel交错 mỗi 4 hàng. Người dùng chỉ cần sử dụng một phần tư thời gian để tải và hiển thị toàn bộ hình ảnh, họ đã có thể nhìn thấy một hình ảnh rất hoàn chỉnh từ trên xuống dưới, mặc dù nó rất mờ. Hình ảnh chỉ hoàn thành một phần tư này thường đã rõ ràng đủ để những người dùng có tốc độ kết nối mạng chậm có thể quyết định có cần dành thời gian để tải phần còn lại của hình ảnh hay không.

Mặc dù tất cả các trình duyệt đồ họa đều có thể hiển thị hình ảnh quét lẻ, nhưng không phải tất cả các trình duyệt đều có thể hiển thị hiệu ứng dần rõ ràng của quét lẻ. Thậm chí những trình duyệt có thể thực hiện hiệu ứng này, người dùng vẫn có thể chọn hiển thị hình ảnh sau khi hoàn toàn tải xuống và giải mã để ức chế hiệu ứng này. Các trình duyệt cũ thường chỉ hiển thị hình ảnh sau khi hoàn toàn tải xuống và giải mã, vì vậy chúng không hỗ trợ hiệu ứng này.

Tính tronglutơ

Một hiệu ứng phổ biến khác của hình ảnh GIF (thực tế là hình ảnh định dạng GIF89a) là nó có thể làm cho một phần của hình ảnh trở nên tronglutơ, để nội dung bên dưới hình ảnh (thường là nền cửa sổ trình duyệt) có thể hiển thị qua phần tronglutơ. Hình ảnh GIF tronglutơ sử dụng một màu đặc biệt trong bản đồ màu để làm nền màu, từ đó làm cho nền cửa sổ hiển thị qua. Bằng cách cắt kích thước hình ảnh một cách cẩn thận và chọn một màu nền gần với màu nguyên色, hình ảnh tronglutơ có thể được tạo ra trông như thể hoàn toàn gắn vào trang web hoặc nổi trên đó.

Hình ảnh GIF tronglutơ thích hợp cho bất kỳ ai muốn tích hợp hình ảnh vào tài liệu mà không muốn nó trông như một khối vuông. Các biểu tượng GIF tronglutơ rất phổ biến, như biểu tượng hoặc ký hiệu in - bất kỳ hình ảnh nào có hình dạng tự nhiên ngẫu nhiên nào cũng có thể sử dụng hiệu ứng này. Bạn còn có thể chèn hình ảnh tronglutơ inline trong văn bản truyền thống để hiển thị các ký hiệu đặc biệt.

Một điểm yếu của hiệu ứng tronglutơ GIF là nếu bạn đặt nó trong thẻ liên kết锚 ( <a> ) mà không xóa bỏ viền của nó hoặc bao bọc nó bằng khung, nó sẽ trông rất xấu. Đồng thời, nội dung khác sẽ hiển thị xung quanh viền vuông của hình ảnh,而不是 gần viền không trong suốt của hình ảnh. Kết quả là, hình ảnh không cần thiết phải được cách ly hoặc làm cho trang web trông rất kỳ lạ.

animation

Điểm độc đáo thứ ba của định dạng hình ảnh GIF89a là nó có thể thực hiện animation đơn giản theo khung hình. Bằng cách sử dụng phần mềm animation GIF đặc biệt, bạn có thể đặt một loạt hình ảnh GIF trong một tệp GIF89a duy nhất. Trình duyệt sẽ hiển thị từng hình ảnh trong tệp theo thứ tự, giống như những cuốn sách nhỏ mà chúng ta đã chơi (thậm chí vẽ) khi còn nhỏ, tạo ra hiệu ứng animation bằng cách lật nhanh trang. Trong tệp GIF, mỗi hình ảnh đều có một phần điều khiển đặc biệt, có thể được sử dụng để thiết lập trình duyệt hiển thị toàn bộ chuỗi (lặp lại) từ đầu đến cuối bao nhiêu lần, thời gian dừng giữa hai hình ảnh, và có xóa không gian hình ảnh từ nền trước khi hiển thị hình ảnh tiếp theo, v.v. Bằng cách kết hợp các tính năng này với những tính năng thông thường của GIF (bao gồm bảng màu riêng, tính trong suốt, quét lẻ, v.v.), bạn có thể tạo ra những hình ảnh rất hấp dẫn và tinh tế.

Lý do animation GIF đơn giản lại có hiệu quả mạnh mẽ là vì không cần phải viết chương trình đặc biệt cho tài liệu HTML để đạt được hiệu ứng hoạt hình. Tuy nhiên, nó cũng có một nhược điểm rất lớn, đó là nó bị giới hạn trong các hình ảnh rất nhỏ như biểu tượng hoặc chỉ chiếm một phần rất hẹp của cửa sổ trình duyệt: ngay cả khi bạn rất cẩn thận không lặp lại phần tĩnh trong các đơn vị hoạt hình liên tục, animation GIF cũng rất dễ trở nên lớn. Do đó, nếu tài liệu chứa nhiều animation, thời gian tải các hình ảnh này có thể rất khó chịu cho người dùng. Nếu có một tính năng nào đó chúng ta cần phải rất cẩn thận và không nên lạm dụng thì đó là animation GIF.

Tóm tắt

Các kỹ thuật GIF đơn giản nhưng lại có hiệu quả mạnh mẽ còn có một lý do quan trọng khác: bạn không cần viết chương trình đặc biệt cho tài liệu HTML để đạt được hiệu ứng hoạt hình. Tuy nhiên, nó cũng có một nhược điểm rất lớn, đó là nó bị giới hạn trong các hình ảnh rất nhỏ như biểu tượng hoặc chỉ chiếm một phần rất hẹp của cửa sổ trình duyệt: ngay cả khi bạn rất cẩn thận không lặp lại phần tĩnh trong các đơn vị hoạt hình liên tục, animation GIF cũng rất dễ trở nên lớn. Do đó, nếu tài liệu chứa nhiều animation, thời gian tải các hình ảnh này có thể rất khó chịu cho người dùng. Nếu có một tính năng nào đó chúng ta cần phải rất cẩn thận và không nên lạm dụng thì đó là animation GIF.