01/08
Đồ họa Web Sẵn sàng
Là một nhà thiết kế đồ họa, bạn thường có thể được yêu cầu cung cấp hình ảnh sẵn sàng trên web, chẳng hạn như ảnh cho một trang web hoặc quảng cáo biểu ngữ. Công cụ "Save for Web" của Photoshop là một cách đơn giản và dễ dàng để chuẩn bị các tệp JPEG của bạn cho web, giúp cân bằng giữa kích thước tệp và chất lượng hình ảnh.
LƯU Ý: Đối với hướng dẫn này, chúng tôi đang xem xét lưu ảnh JPEG . Công cụ Save for Web cũng được xây dựng để lưu các tệp GIF, PNG và BMP.
Điều gì tạo nên một đồ họa “Web-Ready?”
- Độ phân giải 72 dpi
- Chế độ màu là RGB
- Nói chung giảm kích thước tệp để tải các trang web nhanh hơn
02/08
Mở hình ảnh
Để thực hành với công cụ "Save for Web", mở một hình ảnh trong Photoshop; nhấp vào "File> Open", duyệt tìm hình ảnh trên máy tính của bạn và nhấp vào "Open". Với mục đích của hướng dẫn này, một bức ảnh sẽ hoạt động tốt, mặc dù bất kỳ loại hình ảnh nào cũng sẽ làm. Thay đổi kích thước ảnh của bạn thành kích thước nhỏ mà bạn có thể sử dụng trên trang web. Để thực hiện việc này, hãy nhấp vào “Hình ảnh> Kích thước hình ảnh”, nhập chiều rộng mới vào hộp “Tham số pixel” (thử 400) và nhấp “OK”.
03/08
Mở công cụ Lưu cho web
Bây giờ giả sử ai đó yêu cầu bạn cung cấp ảnh này, rộng 400 pixel, sẵn sàng để được đăng trên một trang web. Nhấp vào "File> Save for Web" để mở hộp thoại Save for Web. Dành chút thời gian để duyệt qua các cài đặt và công cụ khác nhau trong cửa sổ.
04/08
Thiết lập So sánh
Ở góc trên cùng bên trái của cửa sổ Save for Web là một loạt các tab có nhãn Original, Optimized, 2-Up và 4-Up. Bằng cách nhấp vào các tab này, bạn có thể chuyển đổi giữa chế độ xem ảnh gốc, ảnh được tối ưu hóa của bạn (với cài đặt Lưu cho web được áp dụng cho ảnh) hoặc so sánh 2 hoặc 4 phiên bản ảnh của bạn. Chọn "2-Up" để so sánh ảnh gốc với ảnh gốc được tối ưu hóa. Bây giờ bạn sẽ nhìn thấy các bản sao bên cạnh ảnh của mình.
05/08
Đặt bản xem trước gốc
Nhấp vào ảnh ở bên trái để chọn nó. Chọn “Original” từ menu Preset ở phía bên phải của cửa sổ Save for Web (nếu chưa được chọn). Thao tác này sẽ đặt bản xem trước ảnh gốc, chưa chỉnh sửa của bạn ở bên trái.
06/08
Đặt chế độ xem trước được tối ưu hóa
Nhấp vào ảnh ở bên phải để chọn nó. Chọn “JPEG High” từ menu Preset. Giờ đây, bạn có thể so sánh ảnh được tối ưu hóa của mình ở bên phải (cuối cùng sẽ là tệp cuối cùng của bạn) bằng ảnh gốc ở bên trái.
07/08
Chỉnh sửa chất lượng JPEG
Cài đặt quan trọng nhất trong cột bên phải là giá trị “Chất lượng”. Khi bạn hạ thấp chất lượng, hình ảnh của bạn sẽ trông “lầy lội hơn” nhưng kích thước tệp của bạn sẽ giảm và các tệp nhỏ hơn có nghĩa là tải các trang web nhanh hơn. Hãy thử thay đổi chất lượng thành “0” và nhận thấy sự khác biệt trong ảnh ở bên trái và bên phải, cũng như kích thước tệp nhỏ hơn, nằm bên dưới ảnh của bạn. Photoshop cũng cung cấp cho bạn thời gian tải ước tính bên dưới kích thước tệp. Bạn có thể thay đổi tốc độ kết nối cho thời gian tải này bằng cách nhấp vào mũi tên phía trên chế độ xem trước ảnh được tối ưu hóa. Mục tiêu ở đây là tìm phương tiện hài lòng giữa kích thước và chất lượng tệp. Chất lượng từ 40 đến 60 thường là một phạm vi tốt, tùy thuộc vào nhu cầu của bạn. Hãy thử sử dụng các mức chất lượng cài sẵn (ví dụ: JPEG Medium) để tiết kiệm thời gian.
08/08
Lưu hình ảnh của bạn
Khi bạn đã hài lòng với ảnh của mình ở bên phải, hãy nhấp vào nút "Lưu". Cửa sổ "Save Optimized As" sẽ mở ra. Nhập tên tệp , duyệt đến thư mục mong muốn trên máy tính của bạn và nhấp vào "Lưu". Bây giờ, bạn có một ảnh đã được tối ưu hóa trên web.