Thiết Kế Website dùng Photoshop để tối ưu hóa

Thiết Kế Website dùng Photoshop để tối ưu hóa

  • Currently 4.72/5

Kết quả: 4.7/5 - (634 phiếu)

Nhờ các tính năng ưu việt cho lĩnh vực thiết kế, phần mềm Photoshop ngày càng trở nên phổ biến, và đặc biệt nó giúp cho việc thiết kế trang web trở nên nhanh gọn hơn so với các chương trình thiết kế đồ họa trên vector (như SVG, hoặc HTML5 canvas). Một vài yếu tố để trang web được load nhanh nhất mà Photoshop giúp bạn là giảm thiểu khối lượng HTTP requests bằng đồ họa, giảm dung lượng hình ảnh, chọn đúng định dạng ảnh.

Nhưng liệu bạn đã biết cách tối ưu hóa chương trình Adobe Photoshop để thiết kế được một trang web tốt chưa? Sau đây tiết lộ với bạn đọc 12 mẹo để sử dụng Photoshop hiệu quả khi làm WEB

Lên ý tưởng và phát thảo ra giấy trước

Sử dụng Photoshop để thiết kế trang web hiệu quả

Tại sao chúng ta thường phải lập dàn ý trước khi viết văn? Làm thiết kế cũng có chung câu hỏi đó. Việc phác thảo giúp chúng ta có cái nhìn tổng quan cho một trang web, ta dễ dàng vẽ và chỉnh sửa một trang web chỉ bằng bút chì và tẩy, chứ không cần qua nhiều thao tác phức tạp như khi bạn bắt tay ngay vào Photoshop. cty thiết kế website y tế sức khỏe Sử dụng Photoshop để thiết kế trang web

Thiết Kế WEBSITE dùng Photoshop để tối ưu hóa

Thông thạo nhanh các phím tắt

Sử dụng Photoshop hiệu quả cho thiết kế web
Một số phím tắt nhanh trong Photoshop
Bạn đã bao giờ chiêm ngưỡng những người thiết kế chuyên nghiệp sử dụng Photoshop chưa? Bạn thấy chóng mặt vì tốc độ sử dụng tay, chuột và bàn phím của họ rất nhanh phải không? Làm thiết kế đồ họa nói chung, và thiết kế web nói riêng, bạn sẽ phải quen với nhiều thao tác làm việc nhanh nếu không thì sẽ chậm tiến độ. Thông thạo sử dụng các phím tắt giúp bạn tiết kiệm được một lượng lớn thời gian đáng kể đó. cong ty thiet ke web chuan seo Một số phím tắt nhanh trong Photoshop

Một số phím tắt đặc biệt sử dụng trên Macbook:

Cmd + Opt + Shift + S = “Save for Webs” – chức năng lưu ra các file tối ưu về chất lượng hình ảnh, độ phân giải, và các yếu tố tương thích với trang web.
Cmd+Opt+C = Canvas size
Cmd+Opt+I = Image size
Vậy là hôm nay chúng ta đã đi qua 5 mẹo về kỹ thuật sử dụng Photoshop hiệu quả cho thiết kế web. Hẹn bạn đọc ở phần tới với nhiều mẹo hấp dẫn hơn nữa.

Sử dụng Grid system (hệ thống lưới)

Sử dụng hệ thống lưới trong Photoshop để thiết kế web đẹp mắt

Cách sắp xếp và kích cỡ giữa các hình là hai yếu tố quan trọng, chúng quyết định trang web của bạn có dễ nhìn hay không. Khi bạn sử dụng hệ thống lưới, bạn sẽ biết cách phân chia bố cục sao cho đều, cho thật gọn, và thuận mắt. Đa số các hệ thống lưới có mẫu định dạng PSD, cùng với chỉ dẫn về Column và Gutter. Sau đây là một vài ví dụ cho bạn tiện tham khảo: 960px, 978px, 1140px. cong ty thiet ke website marketing dep chuan seo gia re kỹ thuật sử dụng Photoshop hiệu quả

Thiết Kế WEBSITE dùng Photoshop để tối ưu hóa

Bật chức năng “Snap”

Công cụ “snap” của Photoshop giúp bạn thiết kế trang web trên từng chi tiết, từng pixel để có chất lượng hình ảnh đẹp mỹ mãn. Bạn bật “snap” bằng cách chọn View -> Snap, hoặc View ->Snap to -> Guide nếu bạn sử dụng cả hệ thống lưới. cty thiết kế web trang trí

Sắp xếp các file hình ảnh

Là một nhà thiết kế website, chắc chắn bạn sẽ phải sử dụng rất nhiều file hình ảnh cho “đứa con yêu dấu” của mình. Nhưng bạn có biết chính các file FSD này sẽ làm rối, và làm chậm tiến độ công việc nếu bạn không biết cách đặt tên, sắp xếp chúng vào từng folder thích hợp. Đặt tên và sắp xếp từng file như vậy còn giúp bạn dễ tìm lỗi để sửa giữa vô vàn các file ảnh khác.

Sử dụng Photoshop để thiết kế trang web,Một số phím tắt nhanh trong Photoshop,kỹ thuật sử dụng Photoshop hiệu quả

backtop