Giảm kích thước tệp mà không giảm chất lượng

Tôi muốn lưu các tệp trong Photoshop nhưng giữ chúng càng nhỏ càng tốt.

Tôi sử dụng Save for Web (và Thiết bị) và lưu dưới dạng JPEG. Dưới đây là các cài đặt tôi đã sử dụng:

Tôi thực sự không muốn hạ thấp cài đặt chất lượng vì tôi sử dụng văn bản và đôi khi tôi thấy các tạo tác nếu cài đặt quá thấp.

Điều này tạo ra kích thước tệp của vài trăm kilobyte tùy thuộc vào kích thước của hình ảnh. Mặc dù đây không phải là vấn đề lớn nhưng những hình ảnh này được sử dụng cho web và nhỏ hơn thì tốt hơn. Các kỹ thuật mà không làm giảm chất lượng để giảm kích thước tập tin là gì?

Cập nhật:

Để thêm một số thông tin ở đây:

Nhiều hình ảnh tôi sử dụng và tạo được gửi qua email. Điều này hạn chế nghiêm trọng những gì tôi có thể làm với việc đặt văn bản bằng HTML và CSS trên hình ảnh.

Ngoài ra tôi sử dụng nhiều phông chữ. Một số tôi có thể sử dụng cho web bằng CSS @font-facenhưng bạn có thể chạy với kích thước tệp lớn và trong một số trường hợp bạn không thể tải phông chữ lên web một cách hợp pháp. Tôi có thể sử dụng một dịch vụ như Typekit nhưng một lần nữa nhiều phông chữ tôi sử dụng không có sẵn với Typekit.

Đây là một hình ảnh ví dụ:

Lựa chọn phương pháp nén tốt nhất phụ thuộc vào nội dung hình ảnh của bạn. Nếu bạn đang cố lưu hình ảnh với nhiều màu sắc và chuyển tiếp mượt mà giữa chúng, lựa chọn của bạn sẽ là JPEG. Mặt khác, nếu bạn đã có một số lineart, văn bản, hình ảnh với một vài màu sắc, bạn nên thử PNG thay thế.

Sơ đồ nén cụ thể, tham số, giảm màu vv tùy thuộc vào trường hợp cụ thể. Có một số hình ảnh bạn có thể lưu một cách an toàn với "thanh trượt" nén JPEG được đặt thành 30 hoặc 40 mà không làm cho các tạo tác rõ ràng. Một số khác yêu cầu cài đặt 80 trở lên. Mắt của bạn nên là thẩm phán.

Khi chúng ta nói về nén JPEG, đừng ngần ngại thử sử dụng tùy chọn "Tiến bộ" hoặc đặt "Blur" thành giá trị khác không (mờ tinh tế có thể che giấu các tạo tác nén nghiêm trọng).

Trong trường hợp của PNG, bạn nên cố gắng giảm số lượng màu đã sử dụng càng nhiều càng tốt (sử dụng PNG-8 cho điều đó). Khi cần một số "làm mịn", hãy thử các thuật toán phối màu khác nhau.

Dưới đây là một vài ví dụ:

Trái sang phải, từ trên xuống dưới, các tham số của chúng là:

1. JPEG, lũy tiến, chất lượng: 40, Blur: 0.18, Kích thước: 9 672 byte
2. JPEG, Tối ưu hóa, Chất lượng: 60, Blur: 0, Kích thước: 16 898 byte
3. JPEG, lũy tiến, chất lượng: 60, Blur: 0, Kích thước: 11 104 byte
4. PNG-8, Phối màu: khuếch tán, Màu sắc: 256, Kích thước: 4 528 byte

So sánh chúng một cách trực quan và sau đó xem xét kỹ kích thước dữ liệu tương ứng của chúng. Cặp đầu tiên là khoảng 9,7 kB so với 16,9 kB. Thứ hai là 11,1 kB so với 4,5 kB. Tất cả điều đó bởi (IMHO) sự khác biệt thị giác không đáng kể.

Dưới đây là một số tùy chọn:

• Sử dụng định dạng khác ngoài JPEG (PNG hoặc GIF); kết quả về cả kích thước tệp và chất lượng hình ảnh sẽ phụ thuộc vào nội dung hình ảnh của bạn; mỗi loại tốt hơn ở một số loại nội dung
• Làm cho hình ảnh nhỏ hơn về mặt pixel - điều này sẽ có hiệu ứng rất đáng kể và chắc chắn nên được xem xét nếu bạn có quyền kiểm soát bố cục tổng thể
• Sử dụng các yếu tố không phải hình ảnh nếu có thể, ví dụ: cố gắng thay thế văn bản trong hình ảnh bằng văn bản HTML; cố gắng thay thế các khối màu bằng các phần tử HTML.

Mở rộng ở hai điểm cuối cùng, bạn nên tìm cách giảm thiểu phạm vi hình ảnh trong bố cục của mình trước khi bạn dành thời gian cho việc giảm kích thước tệp của hình ảnh hiện có.

Tôi sẽ cố gắng trả lời một số câu hỏi chưa được trả lời:

Nhiều hình ảnh tôi sử dụng và tạo được gửi qua email. Điều này hạn chế nghiêm trọng những gì tôi có thể làm với việc đặt văn bản bằng HTML và CSS trên hình ảnh.

Bạn có thể gửi email html (cách tạo bản tin). Với html và CSS nội tuyến (để tương thích). Các hình ảnh phải ở trên một máy chủ và bạn phải đặt URL đầy đủ trong các kiểu dáng / thẻ img. Dưới đây liệt kê danh sách những gì hoạt động trong các ứng dụng email khách khác nhau.

Ngoài ra tôi sử dụng nhiều phông chữ. Một số tôi có thể sử dụng cho web bằng cách sử dụng @ font-face của CSS nhưng bạn có thể chạy với kích thước tệp lớn và trong một số trường hợp bạn không thể tải phông lên web một cách hợp pháp.

Hãy thử google webfonts , cho đến nay là nguồn webfont tốt nhất. Tất cả đều miễn phí sử dụng. Một số khác sẽ là Font Squirrel . (Nó cũng sử dụng @ font-face).

Không có cách nào bạn có thể làm điều này. JPEG là định dạng mất. Luôn có sự đánh đổi giữa chất lượng và kích thước tệp.