Rang va ma’no


ULASHISH

Nega

Hamma ham rangni bir xil idrok etmaydi. Qizil va yashil ranglarni ajrata olmaslik (daltonizm) eng keng tarqalgan shakl bo‘lib, u erkaklarning 8 foizigachasida uchraydi. Ba’zilar esa telefonga qaramlikni kamaytirish uchun kulrang rejimdan foydalanadi.


Nima

Rangni ma’noning yagona vizual ko‘rsatkichi sifatida ishlatmang.

Buning eng keng tarqalgan misoli — havolalarni tag chiziqsiz yoki hoshiyasiz bezatish.

Brauzerlar sukut bo‘yicha gipermatn havolalarining tagiga chizadi. Cascading Style Sheets (CSS) yordamida tag chiziqni olib tashlash mumkin, lekin ko‘p hollarda bu yomon fikr. Foydalanuvchilar havolalarni tagi chizilgan holda ko‘rishga o‘rganib qolgan.

WebAIM: Links and Hypertext

Wikipedia havolalarni bezatishda faqat rangdan foydalaniladigan misollardan biri. Saytning kulrang versiyasida qaysi biri oddiy matn, qaysi biri havola ekanini ko‘rib bo‘lmaydi.

Screenshot of the article color blindness on Wikipedia, showing blue links without underline. Screenshot from the article color blindness on Wikipedia, in grayscale. This makes it impossible to identify links.

Qanday

Tagi chizilgan havolalar

Havolalarga tag chiziq qo‘shing. Yoki uni olib tashlamang. Tag chiziqlar matnni o‘qishni qiyinlashtirishi mumkinligini yodda tuting.

Modified screenshot from Wikipedia, showing links with underlines.
Wikipedia’ning ushbu o‘zgartirilgan versiyasida havolalarning tagi chizilgan. Ba’zilar buni o‘qishni qiyinlashtiradigan vizual shovqin deyishadi.

O‘qishni osonlashtirish uchun text-underline-offset va text-decoration-color kabi CSS xossalaridan foydalanishimiz mumkin.

Modified version of Wikipedia, with more discreet underline on links.
Ushbu o‘zgartirilgan versiyada o‘qishni osonlashtirish uchun text-underline-offset va text-decoration-color ishlatilgan.

Rang holat ko‘rsatkichi sifatida

Ma’noni yetkazish uchun rangga qo‘shimcha ravishda matn va/yoki ikonkalar qo‘shing.


Vositalar

Eslatma: Quyidagi vositalar rangni matn rangi sifatida ishlatayotganingizni nazarda tutib, kontrastga baho beradi.

Fon va matn rangi juftligi sifatida yaroqsiz bo‘lgan ko‘plab kombinatsiyalarni grafika, tugmalar va boshqa elementlar uchun rang sifatida bemalol ishlatish mumkin.

Contrast Ratio vositasi rang kontrasti yaxshi yoki yomon ekanini bildirish uchun rangdan foydalanadi. Qizil rang yomon kontrastni bildiradi. Bu misolda raqamning o‘zi ham boshqa ko‘rsatkich deyishingiz mumkin. Bu asosli dalil. Biroq bunda foydalanuvchi kontrast nisbati ko‘rsatkichini tushunadi va qo‘llanmalardan xabardor deb faraz qilayotgan bo‘lasiz.

Screenshot from Contrast Ratio showing the use of green to communicate that a color has good contrast.

Coolors Color Contrast Checker vositasi rang kombinatsiyasi yaxshi yoki yomon ekanini bildirish uchun uchta usuldan foydalanadi:

  • Qizil rang kontrast yomon ekanini bildiradi.
  • Very poor (juda yomon) matni kontrast yo… juda yomon ekanini bildiradi.
  • 5 yulduzdan 1 tasi bu juda yomon ekanini bildiradi.
Mobile screenshot from Coolors, showing the use of color, text and icons to communicate meaning.

Faqat rangga tayanmang. Coolors kabi ikki yoki uchta usuldan foydalaning.



W3Schools Pathfinder

Yutuqlaringizni kuzating – bu bepul!