راهنمای کامل طراحی برای کاربران کوررنگ | وب سایت | اپیلیکیشن | محصول

یک طراحی خوب به معنای اطمینان از این است که همه کاربران، صرف نظر از توانایی‌هایشان، می‌توانند به طور مؤثر از وب‌سایت‌ها و اپلیکیشن ها استفاده کنند و از آن لذت ببرند. این شامل جمعیت کاربران کوررنگ نیز می شود که درصد قابل توجهی از جامعه جهانی را تشکیل می دهد.

کاربران کوررنگ دنیا را به گونه‌ای متفاوت تجربه می‌کنند و این باعث میشود که بعضی از ترکیب رنگ‌ها، برای این کاربران غیرقابل تشخیص باشد! بنابراین، برای طراحان بسیار مهم است که روش‌های سازگار با شرایط کاربران کوررنگ‌ را اتخاذ کنند تا محیط‌های دیجیتال را برای همه در دسترس قرار دهند.

این وبلاگ شما را از طریق استراتژی های عملی برای بهبود طراحی وب سایت و اپلیکیشن خود برای کاربران کوررنگ راهنمایی می کند. با درک چالش‌های پیش روی این کاربران و انتخاب‌های متفکرانه از ترکیب طراحی و رنگ، می‌توانیم یک تجربه دیجیتالی ایجاد کنیم که واقعاً همه از آن استقبال کنند.

آیا یک فرد کوررنگ می تواند طراح شود؟ | نکات تخصصی
5 شغلی که کوررنگ ها باید از آنها اجتناب کنید

قبل از هر چیزی

اکثر افراد کوررنگ که دارای کوررنگی خفیف هستند بدون انجام تست کوررنگی شاید هرگز متوجه نشوند که کوررنگی دارند. قبل از شروع این مقاله و استفاده از آن برای طراحی های خود، شاید بهتر باشد شما هم یک تست کوررنگی بدهید و از کوررنگ نبودن خودتون مطمئن شوید.

درک کوررنگی

کوررنگی که به عنوان اختلال تشخیص رنگ نیز شناخته می شود، بخش قابل توجهی از جمعیت را تحت تاثیر قرار می دهد. کوررنگی به معنای سیاه و سفید دیدن نیست، بلکه به این معنی است که افراد کوررنگ نمی توانید بین رنگ های خاصی که اکثر مردم به راحتی آنها را تشخیص می دهند تفاوت قائل شوید. درک اصول کوررنگی اولین قدم برای ایجاد وب سایت ها و اپلیکیشن های کاربردی تر و در دسترس تر است.

انواع کوررنگی

انواع مختلفی از کوررنگی وجود دارد، و در هر نوع آن شخصی که کوررنگی دارد قادر به تشخیص بعضی از رنگ های “خاص” نیست. منظور از رنگ خاص این است که مثلا در یک نوع از کوررنگی قرمز-سبز فرد ممکن است قادر به تشخیص رنگ قرمزاصلا نباشد بنابراین رنگ قرمز تیره، به نظر فردی که این نوع کوررنگی را دارد قهوه ای می رسد و احتمالا این شخص رنگ بنفش را که از ترکیب رنگ قرمز و آبی هست را نتواند ببیند پس رنگ بنفش را آبی می بیند.

انواع کوررنگی. کوررنگ ها چطور می بینند. علت کوررنگی. شبیه ساز کوررنگی

در مجموع هفت تشخیص رسمی از انواع کوررنگی وجود دارد. چهار نوع کوررنگی مختلف در دسته قرمز-سبز و دو نوع مختلف کوررنگی در دسته آبی-زرد قرار می گیرند و یک نوع هم کوررنگی کامل است.

در زیر دسته بندی انواع کوررنگی بر اساس کوررنگی نوع قرمز-سبز و کوررنگی نوع  آبی-زرد را می بینید.

انواع کوررنگی قرمز-سبز:

  • پروتانوپیا – Protanopia قرمز کوری (چشم هیچ گیرنده رنگ قرمزی ندارد)
  • پروتانومالی – Protanomaly قرمز ضعیف (چشم گیرنده رنگ قرمز دارد)
  • دوترانوپیا – Deuteranopia سبز کوری (چشم هیچ گیرنده رنگ سبزی ندارد)
  • دوترانومالی – Deuteranomaly سبز ضعیف (چشم گیرنده رنگ سبز دارد)

انواع کوررنگی آبی-زرد:

  • تریتانوپیا – Tritanopia (آبی کور)
  • تریتانومالی -Tritanomaly (آبی ضعیف)

کوررنگی کامل

  • Monochromacy
کوررنگی چیست؟ انواع کوررنگی تست کورنگی، راهنمای جامع کوررنگی برای والدین و معلمین

برای مطالعه بیشتر در مورد انواع کورنگی به همراه تصاویر بیشتر به این مقاله مراجعه کنید

چه چیزی باعث کوررنگی می شود؟ علت کوررنگی
راهنمای کامل والدین برای کودکان کوررنگ
راهنمای معلمان – دانش آموزان کوررنگ

اهمیت طراحی برای کاربران کوررنگ و آمار کوررنگی در جهان

کوررنگی تقریباً یک نفر از هر 12 مرد (8٪) و 1 نفر از هر 200 زن در جهان را مبتلا می کند. این بدان معنی است که اگر وب سایت یا برنامه شما مخاطبان زیادی داشته باشد، بخش قابل توجهی از کاربران شما ممکن است کوررنگ باشند. طراحی با در نظر گرفتن کاربران کوررنگ تضمین می کند که شما بخش بزرگی از جمعیت را مستثنی نمی کنید و به طور بالقوه تجربه و رضایت همه کاربران را بهبود می بخشد.

طراحی با در نظر گرفتن قابلیت دسترسی برای کاربران کوررنگ ممکن است در ابتدا دلهره آور به نظر برسد، اما با انجام این کار، شما گام مهمی در جهت ایجاد محیط های دیجیتالی فراگیرتر برداشته اید. این فقط یک تمرین خوب نیست. این یک جنبه اساسی از طراحی اخلاقی است که می تواند وب سایت یا اپیلیکیشن شما را از رقبا متمایز کند و اطمینان حاصل کند که برای همه کاربران بدون توجه به قابلیت های بصری آنها قابل دسترسی است.

استراتژی‌های طراحی وب‌سایت‌ ها و اپیلیکیشن های دوستدار کوررنگ ها

برای طراحی وب‌سایت‌ها و اپیلیکیشن ها مناسب برای کاربران کوررنگ (دوسدار کوررنگ ها) نیاز نیست کار پیچیده ای انجام دهید. با به کارگیری چند استراتژی طراحی متفکرانه، می‌توانید اطمینان حاصل کنید که محصولات دیجیتال شما از همه استقبال می‌کنند، صرف نظر از اینکه کاربر شما رنگ ها را چگونه درک می‌کنند.

انتخاب رنگ

هنگام انتخاب رنگ ها برای طراحی خود، باید به خاطر داشته باشید که تشخیص برخی از رنگ ها برای کاربران کوررنگ دشوارتر است. از استفاده از ترکیب رنگ هایی که معمولا مشکل ساز هستند، مانند سبز و قرمز یا آبی و بنفش خودداری کنید. در عوض، رنگ هایی را انتخاب کنید که کنتراست خوبی دارند و به راحتی از یکدیگر قابل تشخیص هستند. استفاده از یک پالت رنگ متنوع که سایه ها و رنگ های مختلف را در نظر می گیرد، می تواند قابلیت استفاده سایت یا برنامه شما را برای افراد کوررنگ افزایش دهد.

7 ویژگی برتر کوررنگ ها! محاسن عجیب کوررنگی

10 سوال عجیبی که مردم از کوررنگ‌ها می پرسند
5 باور غلط در مورد کوررنگی

انتخاب ترکیب رنگ های مناسب

نحوه انتخاب رنگ ها می تواند به میزان قابل توجهی بر خوانایی و دسترسی به محتوای شما تأثیر بگذارد. از ترکیب‌های رنگی که برای کاربران کوررنگ با هم ترکیب می‌شوند دوری کنید و دیدن متن یا عناصر مهم را دشوار می‌کند. استفاده از ترکیب رنگی با کنتراست بالا، مانند مشکی روی سفید، یا آبی تیره روی زرد، می‌تواند به اطمینان حاصل شود که اطلاعات شما برای همه قابل درک است. علاوه بر این، ابزارهایی مانند بررسی کنتراست رنگ می توانند به انتخاب ترکیب هایی که استانداردهای دسترسی را دارند کمک کنند.

نکته مهم:

از ترکیب رنگ قرمز بخصوص با رنگ سبز اجتناب کنید

  • کوررنگی قرمز شایع ترین شکل کوررنگی (دوترانوپیا) است.
  • اگر مجبور به استفاده از قرمز/سبز هستید، سعی کنید روشنایی/رنگ را تغییر دهید
  • آبی/قرمز، آبی/نارنجی یا یکی از مجموعه هایی که در زیر ایجاد کرده ام را امتحان کنید:

برای طرح های واگرا سعی کنید از قرمز تا آبی یا بنفش به سبز استفاده کنید:

از ترکیب رنگ های بد اجتناب کنید

استفاده غلط از ترکیب رنگ
استفاده غلط از ترکیب رنگ

برای کاربران کوررنگ یا بازدیدکنندگان وب سایت خود، باید از ترکیب رنگ های زیر اجتناب کنید:

الف) سبز با قرمز

شایع ترین نوع کوررنگی نوع قرمز-سبز است. افراد مبتلا به پروتانوپیا قادر به درک نور قرمز نیستند و افراد مبتلا به دوترانوپیا مخروط سبز ندارند و نمی توانند نور سبز را درک کنند.اگر از رنگ‌های قرمز و سبز در طرح‌های خود یا دکمه خرید استفاده می‌کنید، برخی از کاربران در خواندن آن دچار مشکل می‌شوند و احتمالاً آن را از دست خواهند داد.

ب) سبز با آبی

برای کوررنگی نوع قرمز-سبز، سبز روشن شبیه زرد و سبز تیره به رنگ قهوه ای دیده می شود. آبی-سبز یا فیروزه ای به رنگ خاکستری دیده می شود.

ج) سبز با قهوه ای

برای افرادی که کوررنگی قرمز-سبز دارند، رنگ سبز تیره به صورت قهوه ای دیده می شود و قهوه ای روشن می تواند شبیه به رنگ سبز باشد. بنابراین کاربران کوررنگ نمی توانند بین این دو رنگ از هم تفاوت قائل شوند.

د) فیروزه ای با خاکستری

یک فرد کوررنگ قرمز-سبز ممکن است نتواند رنگ سبز فیروزه ای را درک کند و آن را خاکستری ببیند.

ه) آبی روشن با خاکستری

بسته به سایه رنگ خاکستری و آبی بهتر است از این ترکیب رنگ اجتناب کنید.

و) سبز مایل به زرد روشن

سبز روشن برای برخی از افراد کوررنگ قرمز-سبز، به رنگ زرد دیده می شود و این ترکیب رنگ کلا به صورت زرد دیده می شود.

ز) آبی-بنفش

برخی از افراد مبتلا به پروتانوپیا قادر به دیدن رنگ بنفش نیستند و آن را به رنگ آبی تیره می بینند.

خطرات پنهان نادیده گرفتن تست های کوررنگی در کودکان و بزرگسالان

جدیدترین روش های درمان قطعی کوررنگی

کنتراست و روشنایی

کنتراست و روشنایی نقش کلیدی در دسترسی به وب سایت یا اپیلیکیشن شما دارند. عناصر باید با کنتراست کافی طراحی شوند تا از پس زمینه متمایز شوند و خوانایی را برای کاربرانی که کمبود دید رنگی دارند افزایش دهند. اطمینان حاصل کنید که عناصر تعاملی، مانند دکمه ها و پیوندها، به راحتی از عناصر غیر تعاملی قابل تشخیص هستند. این نه تنها به نفع کاربران کوررنگی است، بلکه تجربه کاربری کلی را برای همه بهبود می بخشد.

پالت های مناسب طراحی دوستدار کوررنگی

استفاده از الگوها و بافت ها

گنجاندن الگوها و بافت ها در طراحی شما یک راه خلاقانه برای متمایز کردن عناصر بدون تکیه صرف به رنگ است. این می تواند به ویژه در نمودارهاا یا هر گونه تجسم داده موثر باشد، جایی که تمایز بین بخش های مختلف بسیار مهم است. الگوها و بافت ها می توانند روشی جایگزین برای درک محتوا برای کاربران فراهم کنند و اطمینان حاصل کنند که پیام شما به وضوح به همه مخاطبان منتقل می شود.

استفاده از نماد ها

استفاده از نمادها در کنار نشانه های رنگی، می تواند درک مطالب شما را تا حد زیادی بهبود بخشد. در صورت امکان، نشانگرهای رنگی را با برچسب های متنی، نمادها یا نمادها همراه کنید. این افزونگی تضمین می کند که اطلاعات از طریق چندین راه قابل دسترسی است و طراحی شما را فراگیرتر می کند. به عنوان مثال، یک سیستم چراغ راهنمایی می تواند از اشکال علاوه بر رنگ ها برای نشان دادن وضعیت استفاده کند.

ابزارها و منابع برای آزمایش قابلیت دسترسی کور رنگی

اطمینان از در دسترس بودن طرح شما برای تمام کاربران نیاز به آزمایش و اعتبار دارد. خوشبختانه، ابزارها و منابع متعددی برای کمک به طراحی شما وجود دارد.

برنامه شبیه ساز کوررنگی

با استفاده از این برنامه می توانید تصاویر خود را آپلود کرده و با انتخاب انواع کوررنگی در برنامه، می توانید ببنید کاربران کوررنگ شما چطور این تصاویر را می بینند.

برای استفاده از این برنامه به صفحه “شبیه ساز کوررنگی” بروید.

Contrast Checkers

بررسی کنتراست ابزاری ضروری برای ارزیابی دسترسی بصری ترکیب رنگ متن و پس‌زمینه است. این ابزارها نسبت کنتراست بین دو رنگ را محاسبه می کنند و به طراحان کمک می کنند تا مطمئن شوند که متن آنها برای کاربرانی که اختلال تشخیص رنگی دارند قابل خواندن است.

برای استفاده از کنترل کننده کنتراست از این وب سایت استفاده کنید

چک کردن وب سایت با هوش مصنوعی

با استفاده از وب سایت تاپتال میتوانید با قرار دادن لینک سایت خود، تصویر سایتان را با توجه به انواع کوررنگی مشاهده کنید.

تست کاربر

در نهایت، یکی از مؤثرترین راه‌ها برای اطمینان از دسترسی به وب‌سایت یا برنامه‌تان برای کاربران کوررنگ، آزمایش کاربر است. با درگیر کردن افراد کوررنگ در فرآیند آزمایش، می توانید بازخورد مستقیمی در مورد جامع بودن طرح خود دریافت کنید. این رویکرد عملی امکان آزمایش در دنیای واقعی را فراهم می‌کند و می‌تواند مشکلاتی را که ابزارها و شبیه‌سازی‌ها ممکن است از دست بدهند، کشف کند و منجر به محصولی در دسترس و کاربرپسند برای همه شود.

بهترین روش ها در طراحی دوستدار کوررنگی

طراحی سازگار با کاربران کوررنگ فقط یک طراحی زیبا نیست. در اینجا، ما به برخی از بهترین روش‌هایی که در هنگام هدف دسترسی باید در نظر بگیریم، می‌پردازیم.

برچسب گذاری و توضیحات

یکی از ساده‌ترین و در عین حال مؤثرترین راه‌ها برای سازگاری با کاربران کوررنگ از طریق برچسب‌گذاری و توضیحات شفاف است. به جای تکیه بر رنگ برای انتقال اطلاعات یا نشان دادن دسته‌ها، نشانه‌های رنگی را با توضیحات متنی یا نمادها تکمیل کنید. این بدان معناست که برچسب‌ها را به دکمه‌ها، پیوندها و نشانگرهای رنگی اضافه کنید تا عملکرد یا معنای آنها بدون درک رنگ واضح باشد. برای مثال، اگر از رنگ قرمز برای برجسته کردن خطاها در ارسال فرم استفاده می‌کنید، نماد خطا یا توضیح متنی مانند «خطا: لطفاً اطلاعات از دست رفته را بررسی کنید» نیز اضافه کنید.

آلترناتیو جایگزین

یکی دیگر از استراتژی های حیاتی ارائه بازنمایی های جایگزین از اطلاعات است که معمولا از طریق رنگ به تنهایی منتقل می شود. این می تواند شامل موارد زیر باشد:

  • استفاده از الگوها یا بافت ها در نمودارها و نمودارها به جای یا علاوه بر کدگذاری رنگ.
  • ترکیب اشکال یا نمادهای مختلف برای تشخیص نقاط داده یا دسته‌ها، اطمینان حاصل کنید که این تمایزات هم در رنگ و هم در مقیاس خاکستری واضح هستند.
  • ارائه یک حالت کنتراست بالا که دید و تمایز محتوا را بدون وابستگی به کنتراست رنگ به تنهایی افزایش می دهد.
    با اذعان به اینکه رنگ ممکن است روش قابل اعتمادی برای همه کاربران برای تشخیص اطلاعات نباشد، ارائه گزینه های جایگزین تضمین می کند که محتوای شما برای مخاطبان گسترده تری قابل دسترسی است.

گزینه های سفارشی سازی

دادن قدرت به کاربران برای تنظیم جنبه های بصری سایت یا برنامه شما می تواند دسترسی را به میزان قابل توجهی افزایش دهد. گزینه های سفارشی سازی ممکن است شامل موارد زیر باشد:

  • به کاربران امکان می دهد تم ها یا پالت های رنگی را انتخاب کنند که برای نوع خاصی از کمبود دید رنگی آنها قابل تشخیص است.
  • ارائه ابزارهایی برای تنظیم کنتراست یا فعال کردن نمای با کنتراست بالا.
  • فعال کردن حالتی برای تغییر همه رنگ ها به مقیاس خاکستری، که می تواند به کاربران کمک کند تا بین عناصری که در غیر این صورت ممکن است با هم ترکیب شوند، بهتر تشخیص دهند.
    این تنظیمات به کاربران این امکان را می دهد که تجربه خود را مطابق با نیازها و ترجیحات خود تنظیم کنند و محصول دیجیتال شما را در دسترس تر و کاربرپسندتر می کند.

نتیجه گیری

طراحی در مورد ایجاد یک تجربه است که برای همه قابل دسترس و لذت بخش است. با توجه به اینکه از هر 12 مرد 1 نفر و از هر 200 زن 1 نفر در سراسر جهان دچار کوررنگی هستند، برای طراحان بسیار مهم است که این جنبه از دسترسی را در پروژه های خود در نظر بگیرند.

با اجرای استراتژی‌هایی که مورد بحث قرار گرفتیم، مانند استفاده موثر از تضاد رنگ، اجتناب از کدگذاری رنگ به عنوان تنها وسیله انتقال اطلاعات، ترکیب الگوها و بافت‌ها، و آزمایش طرح خود با شبیه‌سازهای کوررنگی، می‌توانید اطمینان حاصل کنید که وب‌سایت یا برنامه‌تان برای تمام کاربران در دسترس است.

به یاد داشته باشید، هدف ایجاد طرح‌هایی است که نه تنها از نظر زیبایی‌شناختی دلپذیر باشند، بلکه برای کاربران متنوع نیز کاربردی باشند. این نباید خلاقیت را به خطر بیاندازد. در عوض، می‌تواند راه‌حل‌های نوآورانه‌ای را القا کند که تجربه کلی کاربر را برای همه بهبود می‌بخشد. با اولویت‌بندی دسترسی از همان ابتدا، طراحان می‌توانند به دنیای دیجیتال فراگیرتر کمک کنند.

کارشناس کوررنگی | معمار و طراح خالق اولین دوره های آموزشی برای افراد کور رنگی در جهان. در سال 2018 تصمیم گرفتم محصولی بسازم که تمام عمرم به عنوان یک کوررنگ به آن نیاز داشتم. در طول سالها فعالیت دوره های مخصوص کودکان و الدین، هنرمندان، معلمین، و دوره آموزش جامع به این آموزش ها اضافه شد. هم اکنون می توانید به صورت رایگان به تمام این دوره ها دسترسی داشته باشید (دوره ها به زبان انگلیسی می باشد). www.colorblindguide.com