طراحی وب و کوررنگی در کاربران

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

graybit-sample

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

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

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

deuteranopy color blind

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

diffrent color blindness

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

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

underline links bad

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

underline links

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

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

بسم الله الرحمن

بسم الله الرحمن الرحیم
سلام
بسیار عالی بود امیر خان
لذت بردم

سلام برادر

للّهُمَّ کُنْ لِوَلِیِّکَ الْحُجَّةِ بْنِ الْحَسَنِ صَلَواتُکَ عَلَیْهِ وَعَلى آبائِهِ فی هذِهِ
السّاعَةِ وَفی
کُلِّ ساعَةٍ وَلِیّاً وَحافِظاً
وَقائِداً وَناصِراً وَدَلیلاً وَعَیْناً حَتّى تُسْکِنَهُ أَرْضَکَ طَوْعاً وَتُمَتِّعَهُ فیها طَویلاً
ممنون
خیلی خوب بود

برادر بسیجی این دعا چه ربطی

برادر بسیجی
این دعا چه ربطی به مطلب دارد؟
مگه هر جا نظر خاصی نداری باید دعا بخونی؟

ممنون امیر جان خیلی عالی و با

ممنون امیر جان خیلی عالی و با دقت توضیح دادی.
موفق باشی

بسیار عالی بود ، خسته نباشید

بسیار عالی بود ، خسته نباشید

سلام دوست عزیز. خوشحال می شوم

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

سلام متاسفانه آدرسی از پست

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

سلام دوست عزيز وبسايت خوبي

سلام دوست عزيز
وبسايت خوبي داريد
تبادل لينک ميکنيد؟
اگر مايل به تبادل لينک هستيد ما رو با نام
فروشگاه آنلاين ايرانيان
و آدرس http://www.persiansshop.com
اضافه کنيد و از قسمت تماس با ما اطلاع دهيد تا در کمترين زمان ممکن شما رو لينک کنيم

(حتما آدرس سايت خود و عنواني که ميخواهيد با آن نام لينک شويد را براي ما ارسال نماييد)
باتشکر از شما
هميشه شاد و پيروز باشيد

سلام مطلبی جالبی بود! به نظر

سلام
مطلبی جالبی بود!
به نظر شما سایت من از نظر این که واسه اشخاصی که کور رنگ هستند چطوره؟
http://p30af.com
ممنون

very godo

very godo

مطلب جالبی بود پیشنهاد می‌کنم

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

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • Lines and paragraphs break automatically.

More information about formatting options

By submitting this form, you accept the Mollom privacy policy.