25 ví dụ về kiểu chữ trang web nổi bật tạo
Là một yếu tố thiết yếu của thiết kế trang web , kiểu chữ có thể vừa đẹp vừa chức năng. Khi được sử dụng đúng cách, nó có thể nâng cao tính thẩm mỹ và trải nghiệm người dùng của trang web. Các phông chữ và kiểu bạn làm nổi bật không chỉ ảnh hưởng đến thương hiệu và khả năng truy cập trang web của bạn mà còn xác định cách khách truy cập tương tác với nội dung của bạn.
Bài viết này khám phá 25 ví dụ về kiểu chữ trang web nổi bật và đưa ra các mẹo về cách kết hợp chúng vào quy trình tạo trang web của riêng bạn.
kiểu chữ web là gì?
Typography là nghệ thuật lựa chọn chiến lược, định cỡ, kerning, tạo kiểu và sắp xếp các kiểu chữ để làm cho văn bản dễ đọc và hấp dẫn. Các nhà thiết kế cũng sử dụng kiểu chữ để truyền đạt cảm xúc và củng cố thông điệp của các từ.
Trong thiết kế web , kiểu chữ đóng một vai trò quan trọng trong việc định hình cách chúng ta cảm nhận và hiểu ngôn ngữ viết. Và nó dễ mắc sai lầm hơn bạn nghĩ rất nhiều. Vào năm 2021, Twitter đã đưa ra một bản thiết kế lại ứng dụng của mình bao gồm việc sử dụng phông chữ gốc. Mặc dù thoạt nhìn trang điểm có vẻ rất nhỏ, nhưng nhiều người dùng—đặc biệt là những người có khiếm khuyết về thị giác hoặc xử lý—cho biết họ cảm thấy không thoải mái khi đọc.
Ngoài việc là một khía cạnh quan trọng trong bản sắc thương hiệu của bạn, kiểu chữ cũng có thể ảnh hưởng đến các yếu tố quan trọng ảnh hưởng đến tốc độ, chức năng và khả năng truy cập trang web của bạn. Do đó, điều quan trọng là luôn cân bằng tác động trực quan của kiểu chữ trên web của bạn với các phông chữ an toàn trên web và dễ đọc.
25 ví dụ về kiểu chữ web tuyệt vời
Để có ý tưởng về thiết kế phông chữ hiệu quả trông như thế nào, hãy xem 25 ví dụ về kiểu chữ này. Chúng ta sẽ thảo luận về những phẩm chất cụ thể làm cho từng ví dụ về kiểu chữ này hoạt động trên web và cách chúng nâng cao thương hiệu của trang web.
01. Josiah Fidler-Wieruszewska
Trang web danh mục đầu tư của Joasia Fidler-Wieruszewska có cảm giác mới mẻ và sạch sẽ, sử dụng hệ thống phân cấp trực quan mạnh mẽ để củng cố bố cục kiểu chữ của nó. Sử dụng kết hợp phông chữ serif trang trí công phu và phông chữ sans-serif đơn giản, nhà thiết kế đồ họa cho phép sự đa dạng về phong cách để thu hút sự chú ý của khách truy cập vào nội dung trang web của cô ấy. Fidler-Wieruszewsk khéo léo áp dụng khoảng trắng để đóng khung văn bản của mình, khuyến khích sự tập trung và dễ đọc.
02. Ryan Haskins
Các trang web theo chủ nghĩa thô bạo đều đang thịnh hành—chúng thậm chí còn đứng đầu danh sách xu hướng web năm 2023 của chúng tôi. Để trau dồi phương pháp thiết kế vượt trội, Haskins sử dụng kết hợp các kiểu phông chữ phù hợp để tạo ra tác động trực quan mạnh mẽ. Quan trọng nhất, anh ấy cẩn thận tích hợp vô số phong cách để mang lại cho trang web của mình một khía cạnh đương đại mà không làm khách truy cập choáng ngợp. Mặc dù có ít nhất 10 phông chữ khác nhau được sử dụng trên toàn bộ trang web của anh ấy, nhưng Haskins chắc chắn sẽ sử dụng phông chữ sans-serif sạch ở những nơi dễ đọc.
03. Andrada Có
Nếu có thể tóm tắt việc sử dụng kiểu chữ của Andrada Has trong ba từ, chúng tôi sẽ chọn: thanh lịch, bắt mắt và năng động. Cô ấy sử dụng nhiều khoảng trắng và các mảng màu nổi bật để đảm bảo rằng sự kết hợp hỗn hợp các kiểu phông chữ thử nghiệm của cô ấy không gây nhầm lẫn cho khách truy cập. Cô ấy thậm chí còn quản lý để sử dụng các kiểu phông chữ khác nhau trong các từ riêng lẻ mà không gây ra các vấn đề về khả năng đọc.
04. Laura Zarate
Kiểu chữ của Laura Zarate khá tối giản—nhưng điều đó không làm mất đi những phẩm chất mê hoặc vốn có trong bố cục hiện đại của trang web của cô ấy. Thay vào đó, việc sử dụng phông chữ rõ ràng ở các kích cỡ và trọng lượng khác nhau trên trang web của cô ấy sẽ tạo ra một nền tảng vững chắc giúp tối đa hóa khả năng đọc. Zarate tiếp tục truyền tải sắc thái cá tính tinh vi của thương hiệu bằng cách kết hợp kiểu chữ mạnh mẽ của cô ấy với nền chuyển màu dạng lưới.
05. Wendy Ju
Kết hợp các phông chữ dễ đọc như Avenir Next với hình ảnh động, Wendy Ju tạo ra một thiết kế kiểu chữ tinh tế có tác động lớn. Một số từ nhất định trên trang web của cô ấy được đánh dấu bằng màu sắc tươi sáng và hiệu ứng di chuột. Lớp quan tâm trực quan bổ sung này tạo điều kiện cho trải nghiệm người dùng tương tác nổi bật hơn.
06. Tập thể Robin
Trang web Robin Collective có cách sử dụng kiểu chữ hay thay đổi phản ánh bản chất sáng tạo của thương hiệu. Với bản sao sans-serif rõ ràng cân bằng với tiêu đề trang web kịch bản kỳ quặc, họ truyền tải cách tiếp cận nhẹ nhàng nhưng chuyên nghiệp của mình. Bằng cách chú ý cẩn thận đến các lựa chọn phông chữ và triển khai độ tương phản màu sắc mạnh mẽ, The Robin Collective đã cân bằng thành công tính cách thương hiệu vui tươi của họ với trải nghiệm người dùng thú vị.
07. Chớp mắt
Mặc dù trang web của Blink My Brain hiện đang được xây dựng, nhưng cách sử dụng kiểu chữ quyến rũ của nghệ sĩ khiến khách truy cập muốn nhiều hơn nữa. Sử dụng một cặp phông chữ kim loại tương lai với kiểu chữ viết tay sẽ tạo ra một giai điệu quen thuộc. Mặc dù nó ở mức tối thiểu, nhưng trang đích của Blink My Brain đã gợi ý cho khách truy cập rằng nhà thiết kế này có sở trường về các kiểu phông chữ hợp thời trang. Xem trước tài năng của anh ấy là điều mà du khách chắc chắn sẽ nhớ.
08. Ớt hồng
Pink Chili là một công ty tiếp thị tập trung đặc biệt vào việc giúp các doanh nghiệp kết nối với Gen Z. Đúng với đặc điểm của thế hệ này, trang web có đầy đủ các yếu tố thời thượng. Bởi vì trang web nặng về nội dung với ít hình ảnh, nên việc sử dụng kiểu chữ thông minh của họ là chìa khóa. Trong màn hình đầu tiên, tên thương hiệu—được viết bằng một nét chữ có chân to, màu đỏ anh đào—chiếm vị trí trung tâm. Bằng cách chú ý cẩn thận đến các chi tiết như kích thước phông chữ, kiểu chữ và màu sắc, đại lý ưu tiên trải nghiệm người dùng mà không làm mất đi thương hiệu của họ.
09. Dale Joy Macarena
“Xây dựng thương hiệu cho con người” là phương thức hoạt động của Macarena. Thật vậy, sự lựa chọn kiểu chữ của anh ấy có một tác động hữu hình, nhân bản. Phong cách của phông chữ tiêu đề gợi nhớ đến kiểu chữ thiết kế áp phích và chắc chắn phù hợp để truyền tải một thông điệp mạnh mẽ với cá tính mạnh mẽ. Cân bằng văn bản trang trí này, Macarena sử dụng phông chữ sans-serif cô đọng để truyền đạt các chi tiết quan trọng. Độ đậm của các phông chữ tương phản này mang lại cho bố cục cảm giác vui vẻ và tràn đầy năng lượng.
10. 33 lá thư cho Ukraina
33 Lá thư cho Ukraine là một dự án do ba doanh nhân Ba Lan bắt đầu vào năm 2022, mời 30 nhà thiết kế quốc tế diễn giải bảng chữ cái Cyrillic trong vòng 33 ngày. Các nhà thiết kế của trang web có thêm thách thức trong việc thể hiện kiểu chữ như một tác phẩm nghệ thuật trong khi sử dụng các phông chữ mô tả phản ánh trung tâm của dự án độc đáo. Để làm điều này, họ đã sử dụng kết hợp Menorah Grotesk của Ivan Tsanko & Kyiv Type của Dmytro Rastvortsev . Cả hai phông chữ này đều có nét trang trí, kiểu chữ cái nhưng vẫn có thể đọc được. Các doanh nhân đã đạt được sự đồng nhất hoàn toàn phù hợp với đặc điểm của dự án.
11. Cộng đồng Word Tonic
Không có gì ngạc nhiên khi kiểu chữ của trang web này tràn ngập xu hướng—Word Tonic, xét cho cùng, là một thương hiệu tự tiếp thị mình là Gen Z độc quyền. Để thu hút khán giả cũng đang thịnh hành như nhau, Word Tonic sử dụng phông chữ của trang web phản ánh sự táo bạo, hợp thời trang của nhóm . Đồng thời, trang web cộng đồng cần thiết lập các mục tiêu nghề nghiệp của mình và đảm bảo văn bản của họ có thể đọc được. Đối với điều này, họ ghép các phông chữ trang trí vui nhộn của tiêu đề trang web với phông chữ sans-serif hiện đại, phác thảo các mục tiêu và dịch vụ của họ cho những khách truy cập quan tâm.
12. Derek McKechnie
Chúng tôi thích việc Derek McKechnie sử dụng ảnh hưởng “more is more” để suy nghĩ lại về bố cục kiểu chữ của riêng mình và tạo ra bầu không khí thú vị cho khách truy cập. Đặc biệt đáng chú ý là tác phẩm hoạt hình mà McKechnie sử dụng để phác thảo phần “Dự án” của mình. Bố cục sử dụng kiểu chữ theo một cách độc đáo, vừa phong cách vừa hiệu quả trong khi phông chữ sans serif rõ ràng cho phép khách truy cập dễ dàng xác định từng mục trên trang web của McKechnie.
13. John ma thuật
Magic John’s chứng minh bạn có thể phản ánh bao nhiêu cá tính trong kiểu chữ trên trang web của mình. Tiêu đề trang chủ sử dụng thiết kế kiểu chữ cổ điển và đầy màu sắc để thiết lập tông màu cho thương hiệu. Nhà thiết kế trang web đã xếp một phông chữ thảo hoạt hình lên trên một phông chữ có đường viền đậm. Điều này, kết hợp với cách phối màu tương phản của xanh hoàng gia, đỏ tươi và hồng, cho khách truy cập biết rằng đây không phải là cửa hàng pizza bình thường của bạn.
14. Đặc vụ Digi
Khi chúng ta nói về kiểu chữ tuyệt vời, thường có sự tập trung cao độ vào các lựa chọn và ghép nối phông chữ độc đáo. Điều làm cho kiểu chữ của Agence Digi trở nên hiệu quả—theo cách mà bạn không thường thấy trên các trang web khác—là màu sắc và hình ảnh động của nó. Chuyển động thu hút người đọc, tạo ra các chuyển động nhanh trên trang chủ hoàn toàn hấp dẫn. Trong khi chơi xung quanh với các hiệu ứng hoạt hình này, cùng với kết cấu, độ dốc và chữ 3D, Agence Digi đảm bảo nội dung của chúng có thể đọc được bằng cách sử dụng phông chữ viết hoa và không được trang trí.
15. BẮT ĐẦU Barcelona
Là một cộng đồng các nhà thiết kế trực tuyến và ngoại tuyến, trang web của OFFF Barcelona cần thu hút được kỳ vọng cao của các chuyên gia trong mạng lưới của họ. Để làm được điều này, bố cục kiểu chữ hợp thời trang của trang web đóng một vai trò quan trọng. Sử dụng phông chữ tối giản kéo dài từ góc này sang góc khác, trang chủ thành công là đậm và có tính cách điệu cao. Ngoài ra, các hiệu ứng cuộn ngang được áp dụng một cách tiết kiệm trên toàn bộ trang web, tạo thêm nét tinh tế cho nền văn bản để giữ chân khách truy cập trên trang.
16. Dana Barkay
Vì thiết kế phông chữ và chữ là hai chuyên môn của Dana Barkay nên không có gì ngạc nhiên khi nhà thiết kế hình ảnh sử dụng trang web của cô ấy để thể hiện tài năng của cô ấy (bao gồm cả việc sử dụng thiết kế phông chữ rất riêng của cô ấy, Gofont ). Barkay cân bằng kiểu chữ trang web khác thường của mình với hệ thống phân cấp trực quan bằng cách chia các phần nội dung bằng văn bản thành lưới. Các hiệu ứng cuộn hoạt hình làm cho kiểu chữ của trang web của Barkay trở nên sống động, tạo ra trải nghiệm năng động thu hút khách truy cập và khuyến khích họ khám phá.
17. Cá nhân sáng bóng
Việc sử dụng kiểu chữ của Shiny Individual là ví dụ hoàn hảo về cách các phông chữ phù hợp có thể thiết lập tông màu cho thương hiệu của bạn. Trong trường hợp của Shiny Individual, trang web của họ kết hợp kiểu chữ phức tạp để phản ánh chất lượng tuyệt vời và tinh tế của thương hiệu trang sức. Các phông chữ khác nhau về kích thước, trọng lượng và kiểu dáng để giúp hướng dẫn khách truy cập điều hướng trang và việc sử dụng văn bản màu đen xuyên suốt sẽ thu hút sự chú ý đến các yếu tố quan trọng.
18. Câu lạc bộ sên Kombucha
Slug Club Kombucha chào đón khách truy cập trang web bằng một phông chữ cách điệu với màu neon thu hút sự chú ý. Lớn, đầy màu sắc và hấp dẫn, dòng tiêu đề của trang web tạo ra tác động đáng nhớ trong khi vẫn dễ đọc nhờ vào sự tương phản của nền trang web màu trắng. Nói chung, trang web là một ví dụ tuyệt vời về vai trò của màu sắc trong kiểu chữ web. Các tông màu sáng tạo ra một thiết kế sống động, tạo ra sự tương phản với các phông chữ màu đen để tăng cường khả năng đọc.
19. Cà phê lửa trại
Có một vài lý do tại sao kiểu chữ của Campfire Coffee được thực hiện rất tốt. Đối với người mới bắt đầu, mỗi phông chữ có thiết kế tối giản, cách đều nhau và dễ đọc. Thứ hai, kiểu chữ logo là một ví dụ điển hình về cách chọn phông chữ phù hợp với sản phẩm của thương hiệu. Vẻ ngoài gồ ghề, cháy bỏng của văn bản truyền đạt một cách hoàn hảo sứ mệnh của thương hiệu.
20. Ông Itamar
Kiểu chữ trên trang web của ông Itamar đã được lựa chọn cẩn thận để tạo ra một trải nghiệm thú vị, mang tính thẩm mỹ và thu hút sự quan tâm của khách truy cập. Thay vì để tất cả văn bản xuất hiện cùng một lúc khi một phần mới tải lên trang, trang web này sử dụng hoạt ảnh mượt mà để sắp xếp thời gian của các chữ cái hoặc từ riêng lẻ để chuyển đổi tự nhiên.
21. Thuốc OK
Kiểu chữ của Ok Drugs là một ví dụ tuyệt vời về cách làm cho hai phông chữ cực kỳ khác nhau trông hài hòa khi đặt cạnh nhau. Phông chữ tiêu đề lấy cảm hứng từ những năm 70 được cân bằng bởi phông chữ sans-serif có độ chói vừa đủ để cung cấp cho trang web một số ký tự mà không làm người đọc choáng ngợp. OK Drugs tính đến kích thước phông chữ, sử dụng văn bản lớn trong tiêu đề hoặc CTA để thu hút sự chú ý và giúp khách truy cập tìm thấy những gì họ đang tìm kiếm, đồng thời sử dụng văn bản nhỏ hơn để nội dung dễ đọc và gọn gàng.
22. Vanessa McKeown
Danh mục đầu tư trực tuyến của Vanessa McKeown chứa đầy ảnh chụp sản phẩm sử dụng phông nền sáng với bối cảnh độc đáo, thậm chí siêu thực. Thật phù hợp khi thiết kế trang web của cô ấy phản ánh phong cách lập dị này. Vì công việc của McKeown chủ yếu dựa vào giao tiếp bằng hình ảnh nên trang web của cô sử dụng kiểu chữ ở mức tối thiểu, truyền cảm giác nhạc pop thời thượng bằng các chữ cái bong bóng sáng và menu điều hướng lấy cảm hứng từ đèn neon.
23. Bột làm từ thực vật
Kiểu chữ của PBDC là một ví dụ hoàn hảo khác về cách ghép một phông chữ tiêu chuẩn, dễ đọc với một phông chữ hiển thị viết tay. Chữ viết vui nhộn, chắc chắn giúp khách hàng dễ dàng cuộn qua từng trang và có được cái nhìn tổng quan ở cấp độ cao về nội dung của trang. Sau đó, phông chữ sans-serif đơn giản sẽ hợp lý hóa trải nghiệm đọc cho họ.
24. Lisa Kuroiwa
Sang trọng, hấp dẫn và thanh lịch, danh mục thiết kế đồ họa của Lisa Kroiwa thể hiện sự chú ý sâu sắc của cô ấy đến từng chi tiết. Bản thân kiểu chữ là tối thiểu, nhưng thiết kế của trang web được khuếch đại bằng cách sử dụng bố cục thú vị và gắn kết của văn bản. Kuroiwa cẩn thận dành khoảng trống cho mỗi trang—các phần được sắp xếp cách đều nhau để người đọc có thể dễ dàng theo dõi và tìm thấy thứ họ cần một cách nhanh chóng.
25. Tiffany Cruz
Trang web danh mục đầu tư của Cruz rất chuyên nghiệp—và kiểu chữ của cô ấy cũng khiến việc duyệt qua rất thú vị. Mặc dù phông chữ serif rõ ràng và dễ đọc, nhưng nó chứa các đường cong và góc thú vị làm cho văn bản nổi bật. Cruz làm rất tốt việc kết hợp kiểu chữ của cô ấy với nền đầy màu sắc, đồ họa vector và hoạt hình. Ngoài ra, văn bản được sử dụng trong CTA và các nút của cô ấy xuất hiện với màu sắc tươi sáng, thu hút sự chú ý đến các yếu tố có thể nhấp được.
5 lời khuyên của chuyên gia để sử dụng kiểu chữ trong thiết kế web
Bây giờ chúng ta đã có được nguồn cảm hứng từ các ví dụ về kiểu chữ web ở trên, hãy ghi nhớ các mẹo sau đây khi bạn thiết kế một trang web của riêng mình.
01. Căn chỉnh kiểu chữ với bộ nhận diện thương hiệu của bạn
Rất nhiều thời gian dành cho việc phát triển bản sắc thương hiệu của bạn—tạo ra một thiết kế logo, cách phối màu, phông chữ và hình ảnh nhằm củng cố thông điệp mà thương hiệu của bạn muốn truyền tải. Đó là lý do tại sao, khi chọn phông chữ tốt nhất cho trang web của bạn , bạn nên chú ý đến các phông chữ liên kết sẽ tạo ra với thương hiệu của bạn.
Tìm phông chữ (và nhà thiết kế phông chữ) có rung cảm phù hợp với thương hiệu của bạn. Điều này sẽ cho phép bạn chọn phông chữ phù hợp nhất với thương hiệu tổng thể của bạn.
2. Sử dụng tối thiểu ba phông chữ trên toàn trang web
Cân bằng hình ảnh là một thành phần quan trọng của thiết kế web thành công. Khi nói đến kiểu chữ, điều này cũng có thể áp dụng khi chọn số lượng phông chữ sẽ sử dụng.
Trong hầu hết các ví dụ về kiểu chữ web tốt nhất mà chúng tôi đã xem xét ở trên, chúng đã sử dụng không quá ba phông chữ. Để đạt được sự cân bằng giữa các kiểu phông chữ khác nhau theo cách không làm khách truy cập choáng ngợp hoặc mất tập trung, các chuyên gia thiết kế thường khuyên bạn nên sử dụng ba phông chữ hài hòa:
-
Một phông chữ để hiển thị—chẳng hạn như tên thương hiệu, logo hoặc văn bản hình ảnh anh hùng của bạn.
-
Một phông chữ chính cho tiêu đề.
-
Một phông chữ phụ cho đoạn văn và văn bản mô tả khác.
Nếu bạn giảm thiểu số lượng phông chữ trên trang web của mình, mắt của khách truy cập sẽ không liên tục điều chỉnh các phông chữ mới mà họ gặp phải. Đồng thời, sự đa dạng có thể tạo ra trải nghiệm năng động giúp thu hút khách truy cập.
3. Sử dụng phông chữ tiêu chuẩn, an toàn cho web khi có thể
Có một số lý do khiến bạn có thể muốn chọn phông chữ có trong trình tạo trang web của mình, thay vì phông chữ mà bạn phải mua và tải xuống từ xưởng đúc phông chữ của bên thứ ba.
Đối với người mới bắt đầu, có một vấn đề về khả năng tương thích cần suy nghĩ. Nếu bạn sử dụng phông chữ không được một trình duyệt hoặc thiết bị cụ thể hỗ trợ, thì trang web của bạn sẽ hiển thị một phân đoạn phông chữ mặc định đối tượng của bạn như Roboto thay vì phông chữ bạn đã chọn cẩn thận cho họ.
Thứ hai, phông chữ hệ thống có xu hướng tốt hơn cho hiệu suất trang web . Đó là vì trình duyệt không phải mất thời gian truy xuất tệp phông chữ tùy chỉnh từ máy chủ của bạn. Thay vào đó, nó có thể nhanh chóng tải các phông chữ hệ thống lên trang và hiển thị nội dung của bạn cho khách truy cập xem nhanh hơn.
Nói như vậy, khi bạn tìm thấy một phông chữ độc đáo sẽ khuếch đại thông điệp thương hiệu của mình, bạn luôn có thể tải lên phông chữ của mình bằng Wix . Khi thực hiện việc này, hãy sử dụng các phông chữ an toàn trên web sẽ không ảnh hưởng đến hiệu suất trang web của bạn và đảm bảo sử dụng các định dạng và kích thước được tối ưu hóa.
4. Tạo các cặp phông chữ hài hòa
Giống như bạn muốn có sự cân bằng và hài hòa trong toàn bộ trang web của mình, bạn cũng muốn có sự hài hòa trong các cặp phông chữ của mình . Tuy nhiên, điều đó không có nghĩa là bạn phải sử dụng các phông chữ phù hợp mang lại cho thiết kế của bạn một diện mạo đồng nhất.
Như chúng ta đã học được từ các ví dụ trên, các phông chữ hài hòa có thể đến từ các họ phông chữ, phong cách và hình thức hoàn toàn khác nhau. Một số ví dụ về kiểu chữ trang web tốt nhất sử dụng phông chữ viết tay vui nhộn kết hợp với các kiểu chữ có chân truyền thống và thậm chí cả chữ động trong suốt với phông chữ mờ tiêu chuẩn.
Có nhiều cách để chọn và tạo kiểu cho các phông chữ khác nhau mà vẫn khiến chúng đi cùng nhau một cách độc đáo. Bạn có thể sử dụng các trang web như Fontpair và Fontjoy để lấy cảm hứng. Một mẹo khác là tìm một siêu họ phông chữ như Alegreya/Alegreya Sans/Alegreya Sans Small Caps. Giữa ba hệ thống loại, có 42 kiểu phông chữ để lựa chọn.
Những họ phông chữ lớn này có xu hướng có hàng chục loại và kiểu phông chữ khác nhau bên trong chúng. Bạn có thể dễ dàng sử dụng một phông chữ duy nhất để thiết kế toàn bộ trang web và vẫn tạo ra sự tương phản lành mạnh giữa các kiểu khi làm như vậy.
5. Chú ý đến độ tương phản màu sắc và cỡ chữ
Mục tiêu trong việc chọn màu phông chữ có hai phần: Thứ nhất, sử dụng các chủ đề màu phù hợp với bản sắc thẩm mỹ của thương hiệu của bạn; và thứ hai, để tìm những thứ không ảnh hưởng đến khả năng đọc, khả năng sử dụng hoặc khả năng truy cập trang web .
Để giúp đảm bảo tất cả người dùng có thể đọc và truy cập nội dung trang web của bạn, có một số điều cần xem xét khi quyết định bảng màu cho văn bản của bạn. Đầu tiên là màu sắc của chính nó. Có một số màu nhất định mà những người khiếm thị như mù màu sẽ khó nhìn thấy. Đặc biệt là khi chúng được ghép nối với nhau mà không có nhiều sự tương phản.
Ví dụ:
-
Xanh/xám
-
xanh/tím
-
Màu xanh đen
-
Màu xanh xanh
-
Màu xanh, màu nâu
-
Xanh xám
-
Xanh đỏ
-
Xanh/vàng
Nếu bạn không chắc kiểu chữ hoặc màu thiết kế mà bạn đã chọn sẽ trông như thế nào đối với người khiếm thị, bạn có thể sử dụng công cụ như Coblis hoặc Bộ lọc trang web mù màu để kiểm tra bảng màu của mình.
Một điều khác cần xem xét khi nói đến màu sắc là độ tương phản giữa phông chữ và những gì đằng sau nó. Nguyên tắc Trợ năng Nội dung Web (WCAG) mới nhất đề xuất sử dụng độ tương phản màu 4,5:1 cho văn bản nhỏ hơn và 3:1 cho văn bản lớn hơn. Trình kiểm tra độ tương phản của WebAIM sẽ cho bạn biết liệu độ tương phản kiểu chữ của bạn có được chấp nhận hay không và các công cụ như Trình hướng dẫn trợ năng của Wix có thể quét toàn bộ trang web của bạn để kiểm tra những vấn đề này.
Bởi Jenna Romano
Trình chỉnh sửa thiết kế web