sweetsoft.vn-THỦ THUẬT PHỐI MÀU KHI THIẾT KẾ WEB

THỦ THUẬT PHỐI MÀU KHI THIẾT KẾ WEBsweetsoft.vn/thu-thuat-phoi-mau-khi-thiet-ke-web_288_63_2_a.html Với một số tài liệu in ấn, như những tập sách hay thiệp, những mẫu thiết kế web sử dụn

THỦ THUẬT PHỐI MÀU KHI THIẾT KẾ WEB

sweetsoft.vn/thu-thuat-phoi-mau-khi-thiet-ke-web_288_63_2_a.html

Với một số tài liệu in ấn, như những tập sách hay thiệp, những mẫu thiết kế web sử

dụng màu để tạo ra hệ thống phân cấp, vẽ mắt và thêm biểu mẫu vào Tuy nhiên,

nếu biết một ít về lý thuyết của màu sắc sẽ giúp bạn làm tốt hơn việc phối màu trong các

dự án trực tuyến Dưới đây là một cái nhìn tổng quan về nguyên lý màu sắc, cung cấp cho bạn những kiến thức mới để áp dụng trong việc chọn màu cho việc thiết kế web Ngoài

ra, tham gia một lớp nghệ thuật ở những trường nghệ thuật cũng giúp bạn hiểu nhiều

hơn về lý thuyết cơ bản về màu sắc

Mức cơ bản: Nguyên lý vòng màu (Color Wheel Theory)

Là một người thiết kế, việc làm quen với các thuộc tính cơ bản của ánh sáng hoặc màu

sắc có thể nhìn thấy là thật sự cần thiết Có rất nhiều thông tin về lĩnh vực nghệ thuật

này Cũng có nhiều khóa học dành riêng để nghiên cứu về màu sắc và thuộc tính của nó Tuy nhiên, bây giờ hãy chú ý đến màu sắc (hue) (hoặc những màu được tạo ra từ màu

khác)

Vòng màu thường chia thành 12 màu Có 3 màu cơ bản (primary color): Đỏ, Vàng, Xanh Lam; 3 màu cấp 2 (secondary color) là: Vàng, Tím, Xanh Lá; và 3 màu cấp 3 (tertiary color)

là 6 màu được pha từ màu cấp cơ bản và cấp 2 Tổ chức màu này giúp ta hiều về cách sắp xếp vật lý của ánh sáng màu, như vậy có thể giải mã được sự hài hòa của màu sắc

Sự hài hòa và xu hướng màu sắc

Sự hài hòa của màu sắc là những yếu tố cơ bản trong

việc tạo ra giao diện màu Những giao diện màu thông

dụng dễ bị mất vì phụ thuộc vào xu hướng Ví dụ, vào thập niên 50, xu hướng màu sắc

văn hóa của người Mỹ là màu sang, và màu chủ đạo là: Vàng, Xanh Lam và Đỏ Nhưng

vào thập niên 60, xu hướng màu sắc đi theo màu đất và màu tùng lam Sau đó, thập niên

70, 80 ánh sáng nê-ông rất thịnh hành Mặc dù vậy, ngày nay chúng ta có thể tạo ra rất nhiều màu thông qua định dạng kỹ thuật số, làm cho bạn khó xác định được giao diện

(theme) hơn Chúng ta cũng có thuận lợi bởi vì nó cho phép chúng ta tự do sang tạo ra những theme độc nhất vô nhị bằng việc sử dụng sự hài hòa màu sắc

Sự hài hòa màu sắc được tạo ra bằng nhiều cách khác nhau, nhưng có 3 “quy luật” chủ yếu trong việc chọn những cách này:

Màu bổ sung (Complementary colors):

Vòng tròn ví dụ Complementary Color

Màu bổ sung đối lập với nhau trong vòng tròn màu, ví dụ Đỏ và Xanh Lá Đó là cách

thông thường nhất để bắt đầu cho giao diện màu Tên “bổ sung” (Complementary) có

nguồn gốc từ một sự thật cho thấy là màu sắc đều không có liên hệ với nhau theo bất cứ cách thức vật lý nào Do đó chúng sẽ làm nổi bật cho nhau một cách tự nhiên Có lẽ

nhiều nhà thiết kế sử dụng màu cơ bản và sau đó áp dụng sự bổ sung để tạo ra những màu khác cơ bản

Màu tương tự (Analogous colors):

Vòng tròn ví dụ Analogous Color

Đây là những màu nằm sát bên nhau trong vòng tròn màu, nhu Vàng, Vàng-Xanh Lá và Xanh Lá Theo trực quan chúng có quan hệ với nhau bởi vì chúng là sự hài hòa! Sự hài

hòa chứa những màu tương tự nhau có xu hướng ít lấn át và tương phản nhau do sự

tương tự về màu sắc

Bộ 3 màu Triadic (Triadic colors):

Vòng tròn ví dụ Triadic Color

Thông thường, 3 màu chính được chọn để phối màu (việc này thường theo xu hướng màu Đen hoặc Xám, Trắng và màu hỗn tạp ) Tuy nhiên, khi 3 màu này được đặt cách đều

nhau trong vòng màu, chúng được gọi là “Triadic” Khác với màu tương tự (analogous

color), sự hài hòa này theo xu hướng phân biệt nét rõ ràng và thường ngoài những quy

luật khác Lý do đơn giản là do những sự hài hòa này chứa những màu có liên hệ với

nhau trong vòng màu Nhưng điều này không có nghĩa là chúng hợp nhau Nhiều giao

diện sử dụng sử dụng bộ 3 “Triadic” để lấy 1 hoắc 2 màu làm nền tảng, sau đó sử dụng

những màu khác để làm màu nhấn

RGB so với những chế độ màu khác.

Khi bạn đã biết về màu RGB so với màu CMYK và màu Pantone, việc so sánh giữa chúng thì rất cần thiết Hàng ở dưới: Màu RGB sáng hơn, nhiều màu sống động hơn để hiện thị lên màn hình CMYK và Pantone thì được xài tốt nhất cho việc in ấn.

Màu cộng (Additive Colors) và màu trừ (Subtractive Colors)

Lý do màu RGB được sử dụng tốt nhất trên màn hình vi tính là do chúng là màu cộng

(additive colors) Chúng dựa vào sự phát ra của ánh sáng, giống như cách hoạt đọng của

ti vi mà máy vi tính Với chế độ màu cộng, càng kết hợp nhiều màu, thì ánh sáng trắng sẽ

xuất hiện càng nhiều Vì thế, màu Đen trong RGB theo nghĩa đen là không có màu gì cả.

Mặt khác, màu trắng được tạo ra bởi những thông số cao nhất của nhiều màu kết hợp

thành

Màu CMYK được dựa trên mẫu màu trừ (Subtractive Colors) Máy in trộn nhiều

màu CMYK(Lục Lam, Hồng Sẫm, Vàng và Key* hoặc Đen )với nhau để tạo ra một hình

dáng một màu riêng biệt Càng nhiều màu được thêm vào, thì màu sẽ càng tốt hoặc đen hơn

Màu Pantone là một danh sách riêng những màu mà công ty Pantone dành riêng cho

thiết bị in ấn Bạn chỉ được thấy phiên bản thực của màu Pantone nếu bạn xem chúng

trong cuốn sách màu Pantone chính thức

*Màu Key: K=Key (trong tiếng Anh nên hiểu theo nghĩa là cái gì đó then chốt hay chủ yếu để

ám chỉ màu đen mặc dù màu này có tên tiếng Anh là black do chữ B đã được sử dụng để chỉ màu xanh lam (blue) trong mô hình màu RGB.

Chuyển đổi màu

Vấn đề đặt ra là một vài nhà thiết kế

vướng phải là khi họ phải sử dụng một

logo trên website và màu được sử dụng trong bản thiết kế là CMYKvà Pantone Dĩ nhiên bạn vẫn có thể sử dụng CMYK và Pantone để phối màu, nhưng nó sẽ sáng hơn rất nhiều khi bạn đăng tải lên web với chế độ màu RGB Đó là lí do tại sao hầu hết các công ty đều

chuyển đổi màu trước cho thương hiệu của họ Nếu nhân viên của bạn cho bạn một bản hướng dẫn đầy đủ với những con số màu thực tế mà bạn muốn sử dụng thì sẽ tốt hơn Nếu không, hãy thử sử dụng cung cụ chuyển đổi màu trực truyến, như một công cụ

từ web.forret.com hoặc biểu đồ chuyển đổi màu Pantone-CMYK-RGB từ Crigital Media.

Thủ thuật áp dụng

Sử dụng những quy luật được liệt kê ở trên, bạn sẽ cảm thấy tốt hơn khi chọn màu cho web Tuy nhiên, vẫn có nhiều màu để chọn khi tạo một website Đây chỉ là một vài thủ

thuật nhỏ giúp bạn đi xa hơn trong công việc sáng tạo theme:

Adobe’s Photoshop có chế độ chọn màu “Web Safe”

· Sử dụng nguồn online: Adobe Kuler và Color Explorer đưa ra những công cụ

giúp nhà thiết kế nghĩ ra cách phối màu mà vẫn nằm trong quy luật hài hòa màu sắc

· Chọn lựa từ những chế độ màu sáng: Công cụ Photoshop’s Color Picker có

những thuộc tính được cài đặt sẵn để hỗ trợ người dùng chọn được màu tốt nhất cho

bản thiết kế web Bạn không chỉ chọn được màu RGB mà còn chọn được từ những màu

mà đa số những màn hình có thể hiển thị Chỉ cần check vào ô “Only Web Colors” (“Chỉ cho màu trên web”) trong cửa sổ thoại Color Picker.

· Cứ trang

trí, đừng phân

tâm: Hãy nhớ

rằng văn bản

phải luôn được rõ ràng, dễ đọc Màu sắc không nên làm phân tâm người đọc nếu nó có ý nghĩa dẫn dắt sự chú ý cho người xem nhằm xác định mục tiêu

· Sử dụng khoảng trống trắng: Nếu “khoảng trống trắng” không phải màu trắng,

hãy để mắt thư giãn ở một chỗ Màu sáng và đa màu ở một chỗ có xu hướng làm người xem khó chịu

· Kiểm tra vòng tròn: Khi bạn thắc mắc tại sao 2 hoặc 3 màu nhìn hợp (hoặc không hợp) nhau, hãy kiểm tra với vòng màu RGB Hãy cố gắng làm quen với việc chuyển màu

sắc và thoải mái với việc đánh giá mối quan hệ giữa nhiêu màu sắc và sự kết hợp chúng Một khi bạn đã quen với vòng tròn màu, bạn nên kết hợp màu sắc vào bản thiết kế theo cách của bạn một cách hoàn hảo Đừng quên khi bạn tạo một bản phối màu mà bạn

thực sự thích, hãy lưu nó lại và bạn có thể sẽ sử dụng nó trong tương lai