وبلاگی برای همۀ طراحان وب

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

چشم انسان به شدت به رنگ حساس است. انسان با چشم غیر مسلح می‌تواند تا 500 سایه مختلف از رنگ خاکستری را از هم تشخیص دهد. دراین میان، چشم، بیشترین حساسیت را نسبت به رنگ سبز دارد.

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

کوررنگی چیست ؟

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

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

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

کوررنگی انواع مختلفی دارد و شایع ترین شکل کوررنگی مربوط است به تشخیص رنگ‌های سبز و قرمز.
انواع کوررنگ عبارت است از:

مونوکروماسی

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

دی کروماسی

1. پروتانوپی: نوع اول است که در آن گیرنده های رنگ قرمز غیر فعال اند و شخص، این رنگ را تیره و مایل به رنگ سبز می‌بیند
2. دوترانوپی: شایع ترین نوع کوررنگی است و در آن گیرنده های رنگ سبز کار نمی کند. در این حالت تشخیص بین رنگ سبز و قرمز برای شخص مشکل است.
3. تری تانوپی: نوع نادری محسوب می‌شود و در آن گیرنده های رنگ آبی غیر فعال است.

سه رنگی غیر عادی

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

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

حال به بررسی شیوه صحیح طراحی برای حل مشکل افراد کوررنگ می‌پردازیم.

کنتراست، رمز موفقیت در طراحی است

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

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

طرح را در قدم اول، در حالت سیاه و سفید، تست کنید

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

اگر بخواهید از نرم‌افزار هایی مانند فوتوشاپ استفاده کنید، تنها کافیست که به مسیر Image> Mode> Grayscale بروید تا بتوانید طرح خود را در حالت سیاه و سفید ببینید. البته ابزارهای آنلاینی نیز وجود دارد که می‌تواند به شما در این کار کمک کند. سایت graybit.com یکی از سایت‌هایی است که می‌تواند طراح های آنلاین را به شکل سیاه و سفید به شما نشان دهد. با استفاده از این سایت می‌توانید وضعیت کنتراست رنگ‌ها را در طرح های آنلاین ببینید.

بعد از سیاه و سفید کردن تصویر در فوتوشاپ و یا دیدن سایت در سایت graybit باید از خود بپرسید :

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

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

سایت‌های مفید جهت انتخاب رنگ صحیح برای طراحی

سایت‌های بسیاری وجود دارند که می‌توانند به شما در انتخاب رنگ‌ها کمک کنند. اگر می‌خواهید رنگ مورد نظرتان را از دید یک فرد کوررنگ ببینید، می‌توانید از سایت color scheme designer استفاده کنید. در این سایت در بالای صفحه بخشی به عنوان vision simulation وجود دارد که می‌تواند رنگ مورد نظر شما را از دید فرد کوررنگ به شما نمایش دهد. در این بخش تمامی انواع کوررنگی که در قسمت قبل بررسی کردیم، وجود دارد و می‌توانید رنگ مورد نظر خود را در هر یک از حالات مختلف کوررنگی ببینید.

تصویر بالا، رنگ سبز را از دید افراد مبتلا به دوترانوپی، نمایش می دهد. ابزار coblis-color blindness simulator نیز می‌تواند بسیار مفید باشد. در این سایت می‌توانید تصویر مورد نظر خود را آپلود کنید و نتیجه را از دید انواع مختلف کوررنگی، مشاهده کنید.

اگر بخواهید یک طرح آنلاین را از دید فردی کوررنگ ببینید، می‌توانید از ابزار colorblind web page filter استفاده کنید. در این سایت تنها کافیست که آدرس سایت مورد نظر را وارد کنید و نوع کوررنگی را انتخاب کنید تا بتوانید نتیجه را ببینید.

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

همانطور که در تصویر مشخص است، وقی سایت را در حالت سیاه و سفید ببینیم، هیچ تمایزی بین لینک های صفحه و مطالب داخل سایت وجود ندارد. حال به تصویری که مربوط به بخشی از متن سایت smashing magazine است، دقت کنید.

در این حالت حتی زمانی که متن داخل صفحه در حالت سیاه و سفید هم نمایش داده شود. متن صفحه از لینک های داخل صفحه متمایز است. با رعایت این نکات می توانید سایتی طراحی کنید که برای همه کاربران (حتی کاربران کوررنگ ) نیز در دسترس باشد.

منابع:
http://www.alistapart.com/articles/contrast-is-king/
http://en.wikipedia.org/wiki/Color_blindness