Cách tối ưu hóa hình ảnh cho trang web của bạn
Với tư cách là một nhiếp ảnh gia, điều gì thân yêu nhất mà bạn lưu giữ trong trái tim mình - sau tình yêu của mẹ bạn? Đúng vậy, ảnh của bạn. Điều tương tự cũng có thể nói đối với các nhà thiết kế, nghệ sĩ và nói chung, mỗi người dành một phần đáng kể thời gian và năng lượng của họ để tạo ra những hình ảnh đẹp và có ý nghĩa. Vì bạn rất tự hào về những bức ảnh của mình nên việc bạn muốn giới thiệu chúng với thế giới là điều đương nhiên. Tiếp theo, bạn tải chúng lên trang web nhiếp ảnh của riêng mình, trang web này đã sẵn sàng được chia sẻ rộng rãi giữa các khách hàng, đồng nghiệp và bạn bè của bạn.
Vấn đề: khá thường xuyên, những bức ảnh khi chúng xuất hiện trên màn hình không giống hệt như những bức ảnh bạn đã chụp. Có vẻ như rất nhiều pixel vô tội, kém chất lượng đã bị hy sinh trên đường đi. Và rất có thể, nếu các pixel của bạn đủ may mắn sống sót, một vấn đề khác sẽ phát sinh: tệp của bạn sẽ quá nặng, sẽ mất nhiều thời gian để tải trang web của bạn, đẩy lùi rất nhiều khách truy cập (và khách hàng tiềm năng). Đó là toàn bộ bài toán nan giải của việc tối ưu hóa hình ảnh trong thời đại Internet: làm thế nào để bạn tìm được sự cân bằng phù hợp sẽ duy trì chất lượng tốt nhất có thể mà không làm hại đến tốc độ hoặc hiệu suất của trang web của bạn?
Hãy cùng khám phá những lỗi phổ biến của hầu hết các nhiếp ảnh gia và áp dụng một số phương pháp hay mà bạn có thể bắt đầu sử dụng ngay hôm nay.
Tại sao tối ưu hóa hình ảnh lại là một vấn đề lớn như vậy?
Bạn có bao giờ tự hỏi điều gì đang xảy ra bên trong máy tính của mình khi lướt Internet không? Về cơ bản, trình duyệt của máy tính để bàn hoặc thiết bị di động của bạn cần tải xuống từng tệp từ một trang web, để hiển thị nó trên màn hình. Có nghĩa là các tệp bạn tải lên càng lớn thì tốc độ tổng thể của trang web càng thấp. Một trang web hoạt động chậm có hậu quả nghiêm trọng, cho cả SEO của bạn (Google thích các trang tải nhanh) và cho trải nghiệm người dùng (UX) của khách truy cập. Bạn nên nhớ rằng người dùng Internet bình thường không có đủ kiên nhẫn đối với một trang mất quá nhiều thời gian để xuất hiện - ngay cả khi điều đó là hợp lý. Trên thực tế, 40% người từ bỏ một trang web mất hơn 3 giây để tải.
Một thách thức khác bắt nguồn từ thiết bị di động, chiếm hơn 50% lưu lượng truy cập web ngày nay. Băng thông của điện thoại di động thường thấp hơn so với mạng gia đình có dây, điều này sẽ khiến hình ảnh của bạn khó đến an toàn và âm thanh trên màn hình của khách truy cập. Có một vấn đề tập thể mà bạn cần phải xem xét: các vấn đề đi kèm với hình ảnh có độ phân giải cao trong khi duy trì hiệu suất của trang web của bạn.
Làm thế nào để tối ưu?
Hai kỹ thuật chính được sử dụng ngày nay để tối ưu hóa hình ảnh của trang web. Cái đầu tiên được gọi là nén. Nguyên tắc rất đơn giản (mặc dù về mặt toán học là cực kỳ phức tạp): các thuật toán của phần mềm sẽ phát hiện thông tin thừa trên hình ảnh của bạn và cắt chúng khỏi tệp. Đây là cách hoạt động của nhiều định dạng nén - nổi tiếng nhất trong số đó là JPEG. Kết quả của chế độ ăn kiêng pixel này, kích thước ảnh của bạn sẽ giảm đáng kể. Trang web của bạn sẽ tải nhanh hơn nhiều, đặc biệt nếu bạn áp dụng cách nén này cho mọi hình ảnh đơn lẻ và nếu bạn áp dụng hệ số nén mạnh (“Chất lượng JPEG”).
Nhưng vấn đề - và đó là điều quan trọng - đó là việc nén sẽ làm mất dữ liệu có giá trị. Sự mất mát này thường dễ nhận thấy ở các chi tiết nhỏ, sự xuất hiện của các đồ tạo tác hoặc kết xuất ít phức tạp hơn mà người dùng Internet bình thường có thể chấp nhận được. Người dùng Internet bình thường, nhưng không phải bạn. Là một nhiếp ảnh gia, bạn có khả năng chịu đựng cực kỳ thấp đối với bất kỳ điều gì có thể làm thay đổi, dù chỉ một chút, chất lượng các tác phẩm của bạn. Rốt cuộc, tại sao lại tốn quá nhiều thời gian và tế bào não để có được bức ảnh hoàn hảo, nếu thuật toán nén đầu tiên làm hỏng nó trong một micro giây? Đây là lý do tại sao phương pháp này có thể được sử dụng an toàn cho nhiều trang web khác (khách sạn, blog, cửa hàng trực tuyến, v.v.), nhưng sẽ không được khuyến nghị cho danh mục đầu tư trực tuyến của bạn.
Kích thước có thực sự quan trọng?
Đa số máy ảnh ngày nay cho phép bạn chụp ảnh với độ phân giải rất cao. Như đã thấy trong tab bên dưới, ngay cả một máy ảnh cấp thấp cũng có thể tạo ra những bức ảnh có kích thước 4290 * 2800px mà không cần nỗ lực. Đây là một tài sản to lớn cho nghệ thuật của bạn nhưng cũng đặt ra một vấn đề cho thiết kế web của bạn, vì hình ảnh có độ phân giải cao hơn đồng nghĩa với việc tải lên tệp lớn hơn. Đây là lúc thay đổi kích thước (phương pháp tối ưu hóa phổ biến thứ hai). Về cơ bản, nó có nghĩa là giảm kích thước ảnh của bạn mà hầu như không làm thay đổi chất lượng. Khách truy cập của bạn sẽ nhìn thấy chính xác thứ tương tự trên màn hình của họ - ngoại trừ việc họ có thể phải sử dụng kính hiển vi để xem nó.
Kỹ thuật này là thông minh, nhưng không hoàn toàn thuyết phục. Thật vậy, ai có thể cho biết đâu là độ phân giải tối ưu cho Internet? Mỗi trình duyệt trên mỗi máy tính để bàn hoặc điện thoại di động hiển thị các hình ảnh giống nhau ở một kích thước khác nhau. Hơn nữa, một số hình ảnh được hiển thị ở định dạng lớn hơn một cách tự nhiên, đơn giản chỉ vì chủ thể (nghĩ đến phong cảnh ngoạn mục), kỹ thuật (chụp macro) hoặc bố cục nghệ thuật. Cuối cùng nhưng không kém phần quan trọng, độ phân giải phù hợp với trang web nhiếp ảnh của bạn sẽ không nhất thiết phải đáp ứng các tiêu chí của Facebook hoặc Instagram - và ngược lại.
Tóm lại, thay đổi kích thước hình ảnh của bạn có thể là một lựa chọn tốt nếu bạn cần chúng cho một mục đích rất cụ thể và bạn chắc chắn rằng mình sẽ không phải hiển thị chúng trên màn hình lớn. Ngoài ra, kỹ thuật này sẽ không giải quyết được vấn đề tồn tại số 1 của bạn: làm thế nào để kết hợp chất lượng với hiệu suất.
Thực hành tốt nhất là gì?
Ý tưởng tương tự đằng sau bất kỳ mối quan hệ tốt đẹp nào hoặc chế độ ăn uống của bạn có thể được phản ánh trên trang web của bạn: đó là tất cả về việc tìm kiếm sự cân bằng phù hợp. Mặt khác, bạn là một nghệ sĩ muốn thể hiện những gì tốt nhất của bản thân trong từng bức ảnh. Mặt khác, bạn cần hình ảnh của mình được tối ưu hóa để hiển thị trên danh mục đầu tư trực tuyến của bạn mà không làm nó quá tải. Như chúng ta đã thấy, các tùy chọn phổ biến nhất (nén và giảm) không tôn trọng sự cân bằng này và sẽ gây hại đáng kể cho việc hiển thị hình ảnh vì lợi ích của hiệu suất.
Đây là quy trình hoàn chỉnh để tối ưu hóa hình ảnh cho trang web của bạn:
1. Hoàn thiện hình ảnh của bạn trên Photoshop, Lightroom hoặc bất kỳ trình biên tập đồ họa nào bạn chọn.
2. Xuất hình ảnh dưới dạng tệp JPEG với:
Chất lượng từ 11 trở lên trên thang điểm Photoshop (hoặc tương đương).
Độ phân giải ít nhất là 3.000px trên cạnh ngắn nhất của ảnh (chiều rộng đối với chân dung, chiều cao đối với phong cảnh).
Kích thước tối đa là 15MB