Thiết kế trang web đẹp không thể thiếu sự phụ trợ từ việc sử dụng màu sắc một cách thông minh. Đạt được sự hài hòa trong việc “tô màu” giao diện sẽ giúp bạn rất nhiều trong việc thiết kế trang web đẹp. Ở bài viết trước (link sẽ cập nhật ở cuối bài) chúng tôi đã cung cấp cho bạn các thông tin về ý nghĩa và các cảm xúc màu từng màu riêng biệt có thể mang lại trong khía cạnh tâm lý học. Hôm nay chúng tôi muốn đào sâu hơn về vấn đề sử dụng màu sắc bằng việc giới thiệu với bạn các quy tắc phối màu để đảm bảo tính thẩm mỹ của một sản phẩm.
Nắm rõ các khái niệm về màu sắc trong thiết kế trang web đẹp trước khi bắt đầu
Để thiết kế trang web đẹp, có một vài thứ bạn phải làm quen trước khi bắt tay vào thực hành. Một trong những khái niệm cơ bản nhất chính là bánh xe màu sắc (color wheel). Được sáng tạo đầu tiên bởi Sir Isaac Newton năm 1666, đến tận ngày nay bánh xe màu sắc vẫn được sử dụng rộng rãi trong giới thiết kế để sáng tạo sự hài hòa trong pha trộn màu sắc. Bánh xe màu sắc là một vòng tròn chứa 12 màu cơ bản, gồm:
- 3 màu cấp I (primary color – đỏ, xanh lục, vàng)
- 3 màu cấp II (secondary color – những này được tạo ra bằng cách pha các màu cấp I lại với nhau, gồm xanh lục, cam và tím)
- 6 màu cấp III (tertiary color – những màu được tạo ra khi phi một màu cấp I và một màu cấp II với nhau, ví dụ: xanh lục + tím = màu chàm)
Kẻ một đường dọc đi qua tâm bánh xe, bạn sẽ có 2 nửa vòng tròn với 2 nhóm màu hoàn toàn đối lập nhau: nhóm màu nóng (đỏ, cam, vàng) và nhóm màu lạnh (lục, lam, tím).
Khái niệm về hue, shade, tint và tone – chuyên nghiệp trong thiết kế trang web đẹp
Trước khi tìm hiểu về các quy tắc để thiết kế trang web đẹp, ta cần hiểu một chút về khái niệm phối màu. Nói một cách đơn giản, shade, tint và tone đều là các sắc độ của hue (tạm gọi là màu nguyên chất – tức 12 màu sắc cơ bản trên bánh xe màu). Ở đây chúng ta có:
- Tint = hue + màu trắng.
Ví dụ: đỏ + trắng = hồng. Màu hồng, xanh nhạt, cam sữa,… chính là các dạng màu tint
- Shade = hue + màu đen
Ví dụ: đỏ + đen = burgundy. Màu burgundy, xanh đậm, tím đậm,… chính là các dạng màu shade
- Tone = hue + màu xám. Cách tạo ra các màu tone này làm tối đi màu sắc nguyên thủy mà khiến chúng xuất hiện một cách tinh tế và ít dữ dội hơn.
Và cứ như thế, tùy vào lượng màu trắng/đen/xám được pha vào nhiều hay ít mà chúng ta có hàng trăm sắc độ khác nhau của cùng một màu ban đầu. Nói đến đây có lẽ bạn đang thắc mắc tại sao mình lại cần phải biết chi tiết đến từng khái niệm chuyên sâu này đúng không? Bạn thân mến, đôi khi để thiết kế trang web đẹp người ta chỉ cần chọn 1 màu duy nhất (ngoài màu nền) làm màu chủ đề và dùng nhiều sắc độ khác nhau của cùng 1 màu đó để trang trí, tạo hiệu ứng, đồ họa để làm giao diện web trở nên phong phú hơn. Các thiết kế web này hiện nay đang cực kì được ưu chuộng bởi sự chuyên nghiệp, tinh tế, đơn giản mà lại không đơn điệu.
>>Xem lại: Thiết kế giao diện web moblie – friendly
3 quy tắc cơ bản trong phối màu để có thiết kế trang web đẹp
Khi kết hợp các màu sắc khác nhau, nếu bạn sử dùng càng nhiều màu bạn càng khó khăn trong việc kiểm soát tất cả chúng. Vậy nên nếu bạn là người mới bắt đầu học cách thiết kế trang web đẹp, bạn chỉ nên sử dụng một tổ hợp gồm 2 hay 3 màu, phối hợp theo các nguyên tắc dưới đây là vừa phải.
Kết hợp các màu bổ sung có nên áp dụng để thiết kế trang web đẹp?
Màu bổ sung (complementary colors) là cặp màu đối diện nhau trong bánh xe màu, ví dụ như đỏ và xanh lục là một cặp màu bổ sung (là chính nó! Mọi người thường hay hiểu lầm đỏ và vàng đối nghịch nhau). Bởi vì có sự tương phản mạnh giữa hai màu trong một cặp, sử dụng chúng cùng nhau có thể khiến hình ảnh trở nên nổi bật. Tuy nhiên lạm dụng quá nhiều các cặp màu bổ sung sẽ gây cảm giác mệt mỏi. Chính vì thế, website ứng dụng cặp màu này nên bổ sung thêm 1 màu trung tính thứ 3, thông thường nhất là trắng/đen để trung hoà lại.
Kết hợp các màu tương đồng với nhau có nhàm chán không?
Màu tương đồng (analogous colors) là nhóm các màu (thường là 3 màu) nằm kề nhau trong bánh xe màu sắc, ví dụ nhóm màu đỏ, cam và vàng. Khi phối các màu tương đồng vào cùng một thiết kế, sẽ có 1 màu là màu chủ đạo, 1 màu đóng vai trò hỗ trợ và 1 màu làm màu nhấn. Một trong những xu hướng thiết kế web đẹp trong vài năm trở lại đây là việc sử dụng hiệu ứng loang màu (gradients), và quy tắc dùng các màu tương đồng đã được áp dụng ở trường hợp này. Mặc dù nó không gây ấn tượng mạnh mẽ, nổi bần bật như phương pháp kết hợp màu bổ sung, song nó lại dễ dàng áp dụng rộng rãi trong nhiều chủ đề website khác nhau.
Áp dụng tam giác màu
Tam giác màu, gồm 3 màu được dàn trải đều thành một tam giác cân trên một bánh xe màu sắc và có xu hướng rực rỡ và sống động về mặt cảm quan. Đây là quy tắc đơn giản và tạo sự cân bằng nhất. Sử dụng tam giác màu với mục đích thiết kế web đẹp sẽ tạo ra sự tương phản và hòa hợp đồng thời cùng lúc, kiến cho từng chi tiết nổi bật trong khi vẫn giữ được hình ảnh tổng thể không quá rối ren. Logo của Burger King là một ví dụ cho việc sử dụng tam giác màu một cách thành công.
Thỉnh thoảng thiết kế trang web đẹp nên thay đổi màu sắc chủ đạo
Ai trong số chúng ta cũng cần đổi mới vào một thời điểm này đó trong cuộc sống. Vậy nên không có lý do gì để bạn không áp dụng điều đó vào thiết kế trang web đẹp của chính mình. Nếu trang web của bạn có lượng người truy cập lớn và ổn định, mức tương tác một ngày cao thì thay đổi giao diện web là điều nên làm. Thay vì thay đổi thay đổi cấu trúc website – việc có thể gây khó khăn với người dùng lâu năm, thay đổi màu nền trang web là một trong những cách hiệu quả để để khắc phục tình trạng người dùng cảm thấy nhàm chán với một giao diện web duy nhất.
Bạn không nhất thiết phải thay đổi màu sắc trang web mỗi tháng/mỗi tuần một lần mà có thể lựa chọn các dịp lễ lớn trong năm làm cơ hội để đổi mới. Hãy nhìn các công ty phát triển game, họ đã áp dụng điều này rất tốt khi mỗi mùa lễ hội họ lại tung ra một phiên bản game mới giữ lại tất cả những chức năng, cách thức hoạt động vốn có mà chỉ điều chỉnh ở phần nhìn. Điều này tạo sự hứng khởi rất lớn ở các game thủ – khách hàng lớn của họ.
Để tạo nên những mẫu thiết kế web đẹp, hãy học tập họ. Bạn có thể tham khảo màu sắc chủ đạo của các sàn diễn thời trang vì chúng thời là những gam màu thịnh hành nhất ở thời điểm hiện tại, hoặc xem các dự đoán về màu sắc sẽ lên ngôi trong năm tới để lấy cảm hứng tạo ra một diện mạo mới cho chính trang web của mình.
Liên hệ
Bạn không có năng khiếu và kiến thức để lựa chọn tone màu phù hợp nhất cho website của bạn? Hãy để Markdao Agency Vietnam – công ty thiết kế web chuyên nghiệp giúp đỡ bạn trong việc tạo nên trang web thu hút nhất. Liên hệ ngay để được tư vấn miễn phí:
Địa chỉ: 14 Phan Tôn, P. Đa Kao, Quận 1, TpHCM
Hotline 24/7: +84 28 71 09 90 90
Email: bonjour@markdao.com.vn
>>Xem thêm: Ý nghĩa của màu sắc đến thiết kế giao diện web