Bài giảng Photoshop - Bài 8: Tạo ảnh cho trang web

Mở tấm hình dưới dạng Smart Object.
Chuyển đổi layer sang Smart Object.
Chỉnh sửa đối tượng Smart Object.
Thay thế nội dung của một Smart Object layer.
Làm việc với các filter.
Sử dụng Filter Gallery.
Tính năng của SmartFilter.
Sử dụng Vanishing Point

28 trang thiennv 09/11/2022 5340

Download

Bạn đang xem 20 trang mẫu của tài liệu "Bài giảng Photoshop - Bài 8: Tạo ảnh cho trang web", để tải tài liệu gốc về máy hãy click vào nút Download ở trên.

File đính kèm:

bai_giang_photoshop_bai_8_tao_anh_cho_trang_web.pdf

Nội dung text: Bài giảng Photoshop - Bài 8: Tạo ảnh cho trang web

CẮT ẢNH TRANG WEB Slice: Được cắt từ một hình ảnh lớn hơn. Lợi ích: Tốc độ download nhanh hơn Có thể lưu các mảnh dưới các định dạng khác nhau. Slide 8 – Tạo ảnh cho trang web 11
CẮT ẢNH TRANG WEB Mẫu cắt: (Ví dụ) Slide 8 – Tạo ảnh cho trang web 12
CẮT ẢNH TRANG WEB Thực hiện: Hiển thị thước đo (Rulers): Chọn menu View > Rulers Tắt tính năng snap: Chọn menu View > Snap Nhấn chuột vào thước ngang. Giữ và kéo chuột xuống hình ảnh. Nhả chuột ở vị trí thích hợp. Slide 8 – Tạo ảnh cho trang web 13
CẮT ẢNH TRANG WEB Tiếp tục tạo các đường gióng theo chiều dọc và ngang. Slide 8 – Tạo ảnh cho trang web 14
CẮT ẢNH TRANG WEB Chọn công cụ Slice. Nhấn nút Slices From Guides trên thanh tùy chọn: Hình ảnh được tự động cắt thành các mảnh nhỏ. Slide 8 – Tạo ảnh cho trang web 15
KẾT HỢP CÁC MẢNH CẮT Thực hiện: Chọn menu View > Clear Guides để xóa các đường gióng. Lựa chọn công cụ Slice Select. Nhấn chuột vào mảnh cắt để lựa chọn. Slide 8 – Tạo ảnh cho trang web 16
KẾT HỢP CÁC MẢNH CẮT Chọn thêm các mảnh: Giữ phím Shift và nhấn chuột vào mảnh cần thêm. Slide 8 – Tạo ảnh cho trang web 17
KẾT HỢP CÁC MẢNH CẮT Kết hợp các mảnh: Nhấn chuột phải và chọn menu Combine slices. Slide 8 – Tạo ảnh cho trang web 18
THIẾT LẬP THUỘC TÍNH CHO CÁC MẢNH Các thuộc tính: URL: Liên kết đến trang web khác. Alt: Ghi chú cho ảnh. Thực hiện: Chọn công cụ Slice Select. Chọn mảnh cắt. Nhấn nút Set options trên thanh tùy chọn Slide 8 – Tạo ảnh cho trang web 19
THIẾT LẬP THUỘC TÍNH CHO CÁC MẢNH Hộp thoại xuất hiện: Thiết lập các thuộc tính. Slide 8 – Tạo ảnh cho trang web 20
SAVE FOR WEB & DEVICES Tối ưu hóa: Quá trình tạo tập tin hình ảnh đảm bảo chất lượng tốt với kích thước tập tin nhỏ nhất. Thực hiện: Chọn menu File > Save For Web & Devices. Hộp thoại xuất hiện: Slide 8 – Tạo ảnh cho trang web 21
SAVE FOR WEB & DEVICES Slide 8 – Tạo ảnh cho trang web 22
SAVE FOR WEB & DEVICES A. Hộp công cụ: Công cụ Zoom, Panning, Slice Select, Sampling Color B. Cửa sổ preview C. Các thiết lập cho tập tin Slide 8 – Tạo ảnh cho trang web 23
CÁC ĐỊNH DẠNG TẬP TIN GIF: Tối đa 256 màu. Hỗ trợ nền trong suốt. Hỗ trợ hình ảnh động. Làm ảnh logo, mẫu ảnh nhỏ để làm nền. JPEG: Hỗ trợ khoảng màu rộng. Không hỗ trợ nền trong suốt. Phổ biến trên Web. Định dạng của các tấm hình chụp. Slide 8 – Tạo ảnh cho trang web 24
CÁC ĐỊNH DẠNG TẬP TIN PNG: Cải tiến và thay thế định dạng GIF. Hỗ trợ khoảng màu rộng. Hỗ trợ ảnh trong suốt. Slide 8 – Tạo ảnh cho trang web 25
TỐI ƯU CÁC MẢNH CẮT Thực hiện: Mở hộp thoại Save For Web & Devices. Chọn tab Optimizied. Lựa chọn các mảnh cắt. Chọn thiết lập sẵn từ danh sách Preset. Slide 8 – Tạo ảnh cho trang web 26
TỐI ƯU CÁC MẢNH CẮT Chọn trình duyệt để preview Nhấn Save. Lựa chọn “Save As Type” là HTML. Slide 8 – Tạo ảnh cho trang web 27
TỔNG KẾT Photoshop hỗ trợ nhiều công việc thiết kế giao diện trang web Việc cắt ảnh trang web thành các ảnh nhỏ hơn sẽ đem lại lợi ích: Tốc độ download nhanh hơn Có thể lưu các mảnh dưới các định dạng khác nhau. Slide 8 – Tạo ảnh cho trang web 28