Photoshop: cách giảm kích thước của PNG để sử dụng web


10

Tôi có một tệp PNG là 2042 x 1250 và là 6,1 MB. Khi tôi mở bằng Photoshop và thực hiện "Lưu dưới dạng> PNG 24" và chọn kích thước tệp nén của hai tùy chọn (tùy chọn còn lại không nén), tôi vẫn nhận được một hình ảnh theo thứ tự vài MB, vì nó sẽ là một tài sản web, tôi muốn ở trong KB chứ không phải của MB. Làm cách nào để tôi nén hình ảnh này một cách thông minh vào phạm vi sân bóng vài nghìn KB?


1
Sử dụng tệp -> lưu cho web thay vào đó và chọn png 24 từ danh sách các định dạng tệp (JPG thường là mặc định).
AndrewH

Điều gì khiến bạn nghĩ rằng một tập tin có thể được nén nhiều như bạn muốn? Bạn có thể muốn chuyển sang JPEG và tinker với cài đặt Chất lượng thấp hơn.
usr2564301

Câu trả lời:


13

Các chi tiết táo bạo (bạn không yêu cầu)

Một số định dạng hình ảnh, chẳng hạn như JPG, hỗ trợ Nén tổn thất . Khi một hình ảnh nén bị mất được lưu lại và sau đó được hiển thị trở lại, hình ảnh không chính xác 100% như bạn đã thiết kế mà chỉ "gần" với nó, giống như một bản phác thảo. Một số chi tiết ban đầu bị mất . Vì không có sự mong đợi về độ chính xác, các hình ảnh Nén mất mát có thể lưu trữ ít thông tin về thiết kế ban đầu, dẫn đến các tệp nhỏ. Họ thậm chí còn cho phép bạn chỉ định mức độ chính xác của kết quả: kết quả cần càng chính xác, tệp càng nhỏ.

Mặt khác, định dạng PNG, theo thiết kế, hỗ trợ Nén không mất dữ liệu . Điều này có nghĩa là sau khi hình ảnh được lưu trong một tệp, khi nó được hiển thị trở lại, tất cả các pixel được hiển thị chính xác như bạn đã thiết kế chúng mà không làm mất bất kỳ chi tiết nào. Điều này thật tuyệt, nhưng thật không may, điều đó có nghĩa là nó phải lưu trữ rất nhiều thông tin để hiển thị hình ảnh một cách hoàn hảo, dẫn đến các tệp lớn.

PNG thực hiện điều thông minh của mình để tối ưu hóa thông tin cần thiết trước khi lưu nó vào tệp nhưng bạn không thể chỉ định, giống như bạn làm với JPG, bạn muốn tệp được nén hoặc chính xác như thế nào. Kết quả là như vậy và bạn không có quyền kiểm soát tệp lớn như thế nào.

Một số gợi ý

Phải nói rằng, có một vài điều bạn có thể làm để cố gắng có được một tệp nhỏ hơn.

  • Các khu vực lớn của màu phẳng nén tốt hơn các khu vực có hoa văn phức tạp. Xem nếu bạn có thể đơn giản hóa hình ảnh của bạn.
  • Bạn có nhiều không gian âm xung quanh hình ảnh? Cố gắng cắt nó xuống mức tối thiểu.
  • Bạn đang sử dụng tính minh bạch? Nếu không, hãy xem xét việc lưu hình ảnh dưới dạng JPG thay vào đó.
  • Nếu bạn không thể lưu nó dưới dạng JPG vì bất kỳ lý do gì, nhưng không sử dụng độ trong suốt, hãy bỏ chọn "độ trong suốt" khỏi các tùy chọn lưu. Điều này sẽ cạo một chút vết cắn từ kết quả cuối cùng của bạn.
  • Xem xét việc cắt hình ảnh thành nhiều phần và soạn nó trong HTML cuối cùng, giống như một số câu đố. Bạn có thể lưu các phần yêu cầu độ trong suốt dưới dạng PNG và các phần khác dưới dạng JPG được nén cao. Tổng kết quả sẽ ít nặng hơn.
  • Sử dụng công cụ nén PNG (ví dụ: https://tinypng.com/ ). Tâm trí bạn, những công cụ này sử dụng một thuật toán mất mát. Họ cố gắng đơn giản hóa hình ảnh của bạn để có thể lưu nó dưới dạng một tệp nhỏ hơn. Chúng làm giảm đáng kể kích thước tệp của bạn nhưng kết quả cuối cùng có thể mất quá nhiều chi tiết. Bạn luôn có thể thử chúng và đánh giá kết quả tùy thuộc vào ứng dụng.

Nếu bạn chia sẻ hình ảnh của bạn, tôi có thể cung cấp cho bạn một số gợi ý.


TinyPNG chuyển đổi thành PNG 8 bit trông giống như một GIF.
Hannes Schneidermayer

@Heanz. Thật. Nó chuyển đổi thành 8 bit. Nhưng nó không phải là một GIF. Nó hỗ trợ minh bạch alpha. Theo kinh nghiệm của tôi, tôi chưa bao giờ nhận thấy sự khác biệt giữa PNG đầy đủ và cái họ sản xuất.
cockypup

@cokcypup Đối với những logo mà tôi là thật, nhưng đối với khuôn mặt của con người, không có cách nào.
Hannes Schneidermayer

@Heanz tôi chưa bao giờ sử dụng cho khuôn mặt người nhưng tôi sử dụng nó thường xuyên cho ảnh bao bì mỹ phẩm. Tôi không thể nói sự khác biệt trong những điều đó. Tuy nhiên, nhận xét của tôi về alpha là chính xác. Định dạng GIF không hỗ trợ độ trong suốt alpha.
cockypup

2

Hãy thử thêm một lớp điều chỉnh Posterize vào hình ảnh và giảm số lượng màu sắc. Tôi thấy bạn vẫn có thể giữ được chất lượng cao và giảm kích thước tệp thông qua phương pháp này.


Hoạt động như một lá bùa!
Christian Strang

0

PNG 6,1 MB nằm xa phạm vi KB, vì vậy các đề xuất của Cokypup sẽ là tốt nhất.

Đối với các PNG khác mà bạn có thể tạo, cách tốt nhất để lưu chúng ra để sử dụng web là lưu trong Photoshop bằng "Save for Web" thay vì "Save As". "Save for Web" của Photoshop thực hiện một số tối ưu hóa sẽ làm giảm đáng kể kích thước tệp.

Sau đó, tôi sẽ tiếp tục sử dụng công cụ nén cho các PNG như Tiny PNG
Tiny PNG sử dụng tính năng nén mất mát như bạn khi lưu JPG. Nó làm giảm đáng kể kích thước tệp và như bạn có thể thấy qua ví dụ trên trang web, việc nén mất dữ liệu mà nó thực hiện hầu như không đáng chú ý.


Hoàn toàn đáng chú ý phụ thuộc rất nhiều vào hình ảnh bạn đang cung cấp thông qua thuật toán tôi đã tìm thấy, sử dụng một cách thận trọng và không bao giờ ghi đè lên tệp gốc của bạn.
PieBie

Nó chuyển đổi thành 8 bit và trông giống như một GIF trên các bức ảnh đầy màu sắc.
Hannes Schneidermayer

-1

có thể không cần phải nói, nhưng nhiều người quên đặt độ phân giải ở mức 72 pixel / inch cho tài sản web.

Hình ảnh> Kích thước hình ảnh> đặt độ phân giải thành 72 ppi.


không có tác dụng đối với hình ảnh được sử dụng cho web, chỉ có kích thước tính theo px
Luciano
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.