5 خيارات ألوان يجب تجنبها تمامًا عند التصميم للويب
نشرت: 2016-07-06أصبح الويب أكثر وضوحًا طوال الوقت. يظل المحتوى الجيد ملكًا ، ولكن من الأفضل تغليف هذا المحتوى في حزمة مرئية جذابة من أجل التميز.
بالنسبة لمحترفي التصميم ، هذه ليست مشكلة كبيرة. إنهم منغمسون تمامًا في نظرية الألوان وعلم نفس الألوان.
ولكن ماذا عن العدد المتزايد لسكان الويب الذين يحاولون إبقاء محتوى الويب الخاص بهم مواكبًا للسرعة مع الطبيعة المرئية المتزايدة للويب؟ حتى مقالات الويب التي تلخص نظرية الألوان وعلم نفس الألوان ، رغم أنها ممتازة في مشاركة أساسيات اللون في التصميم ، يمكن أن يساء تفسيرها من قبل أولئك الذين ليس لديهم الخلفية التي يمتلكها متخصصو الرسومات ، مما يؤدي إلى قرارات كارثية محتملة.
إذن ما هي خيارات الألوان التي يجب أن تتجنبها تمامًا في صفحات الويب الخاصة بك؟
اسود صافي
لنبدأ باللون الأسود - الأسود الخالص - ما تم ترميزه كـ # 000000 في HTML.
متفاجئ؟ الأسود موجود في كل مكان ، أليس كذلك ، كما هو الحال في النص الموجود في معظم صفحات الويب ، واللباس الأسود الصغير في كل مكان والسماء الليلية؟
حسنًا ، الأسود النقي أقل شيوعًا في رأيك. هذا اللون الحقيقي # 000000 أسود نقي هو في الواقع لون غير طبيعي. لا وجود لها في الطبيعة. يتطلب اللون الأسود النقي امتصاص جميع أطياف الضوء ، وهذا ببساطة لا يحدث في الطبيعة. الألوان الطبيعية أكثر اندماجًا وهدوءًا.
لذلك ، فإن اللون الأسود النقي ليس شيئًا اعتادت أعيننا على رؤيته. إنه قاسي. إنه يبرز (وهو جزء مما يجعل هذا الفستان الأسود الصغير شائعًا جدًا). فلماذا لا تستخدمه في تصميم المواقع؟ بعد كل شيء ، تؤكد مقالات الويب التي تتناول علم نفس الألوان على ارتباطها بالسحر والتطور والقوة والسلطة. هل هذه المقالات خاطئة عندما تشجع على استخدام اللون الأسود؟
إنهم ليسوا مخطئين على الإطلاق. يمكن استخدام اللون الأسود لإثارة بعض الارتباطات الإيجابية القوية في أذهان الناس. المفتاح هو استخدام أسود ليس أسود خالص .
نظرًا لأن اللون الأسود النقي ليس لونًا طبيعيًا ، يصعب على الدماغ معالجته. ارتقِ باللون الأسود من # 000000 إلى # 111111 أو ما شابه ذلك من اللون الرمادي الداكن جدًا وستظل تحصل على الفوائد اللافتة للنظر للون الأسود دون أن تضع الكثير من الضغط على أدمغة زوارك.
ألوان النيون في عناصر الواجهة
ألوان النيون أيضًا ، على الرغم من كونها جذابة ، لها نفس الميل لإرباك الدماغ. نظرًا لأن الألوان التي لا تظهر في الطبيعة ، فهي غير مألوفة للدماغ ويصعب معالجتها من الألوان الممزوجة الأكثر كتمًا.
احفظ ألوان النيون اللافتة للنظر لإبرازات الرسوم لإبراز المحتوى المرئي الخاص بك بدلاً من عناصر الواجهة. وتأكد من استخدامها ليس فقط للفت الانتباه إلى الرسم ، ولكن لجذب انتباه الزائر إلى أجزاء من صفحتك حيث توجد المعلومات الأساسية.
بمعنى آخر ، احتفظ بألوان النيون بعيدًا عن الخلفيات حيث سيتم تثبيت النص عليها ، مثل الخلفيات للنص الرئيسي أو الأشرطة الجانبية أو أشرطة التنقل أو الأزرار.
استخدم ألوانًا طبيعية وممزوجة بشكل خفيف بحيث تكون أكثر راحة للعين كخلفيات لمحتواك النصي. تميل ألوان النيون كنص أو في خلفيات نصية إلى إجهاد العينين. يمكن أن يترك هذا انطباعًا سلبيًا للعقل الباطن عن الموقع الإلكتروني وما يقدمه ، وهو آخر شيء تريده. تريد أن تترك لزائرك شعورًا إيجابيًا بعملك.
القاعدة العامة لتغطية أول خيارين للألوان يجب تجنبها ، هي تجنب الألوان التي تتميز في ترميز HTML بالتطرف في أطياف الألوان - الأصفار و F ، خاصة في الخلفيات النصية والنصية. أبعدهم قليلاً عن الألوان غير الطبيعية النقية تمامًا وسيكون من الأسهل على العقل معالجتها ، وترك انطباع أكثر ملاءمة للزائرين.
تركيبات عالية التباين بشكل مفرط
بالإضافة إلى تجنب الألوان شديدة النقاء ، كن حذرًا مع مجموعات معينة من الألوان.
على الرغم من أن اللونين الأحمر والأخضر عنصران أساسيان في موسم الكريسماس ، إلا أن اللونين الأحمر والأخضر يطرحان عددًا من المشكلات في تصميم الموقع - لدرجة أن هناك قصيدة صغيرة بين المصممين تقول "لا ينبغي أبدًا رؤية الأحمر والأخضر ، بدون وجود لون بينهما"
هذا بسبب الطريقة التي يعالج بها الدماغ هذين اللونين. يسجل اللون الأحمر على أنه اللون الأكثر دفئًا ويحفز النشاط في الدماغ. إنه اللون الذي يجذب انتباهنا بسرعة. الأحمر يهيج الدماغ.
من ناحية أخرى ، يسجل اللون الأخضر كلون بارد. يهدئ الدماغ. وضع الاثنين معًا يضع الدماغ في وضع غير مريح لمعالجة الصورة المرئية التي تحاول في نفس الوقت تحريكها وتهدئتها. يترك الدماغ في صراع. هذا ليس جيدًا لخلق انطباع إيجابي.
كما هو الحال مع الاستخدام المذكور أعلاه لألوان النيون في النص أو في خلفية النص ، فإن استخدام اللونين الأحمر والأخضر معًا يمكن أن يترك للزائر انطباعًا غير واعٍ سلبيًا عما تقدمه لا علاقة له بالعرض نفسه. بدلاً من ذلك ، يأتي هذا الانطباع السلبي من الانزعاج الداخلي لمعالجة الألوان المتضاربة.
الأحمر والأخضر أيضا لديهما مشكلة ثانية. ثقافيًا في العالم الغربي ، اعتاد الناس على ربط اللون الأحمر بـ stop or no ، والأخضر بـ go or yes. مرة أخرى ، يجبر الدماغ على التعامل مع مجموعة متناقضة من المدخلات التي تجعل الدماغ غير مرتاح. وعندما يكون الدماغ غير مرتاح ، فإنه سينقل هذا الشعور بعدم الارتياح إلى عرضك - وليس ما تريده على الإطلاق.
على الرغم من أنه ليس أقصى تباين ، فإن نفس المبدأ ينطبق على مزيج من الأحمر والأزرق ، وبدرجة أقل ، على أي مزيج مما يسمى الألوان الثانوية ، أي اللون الأرجواني أو الأخضر أو البرتقالي.
يخلق اللون الأحمر والأزرق تصادمًا بين لون دافئ جدًا ولون رائع جدًا. الألوان الثانوية ، وهي مزيج من الألوان الأساسية (اللون الأرجواني هو مزيج من الأحمر والأزرق ، والأخضر مزيج من الأزرق والأصفر ، والبرتقالي مزيج من الأصفر والأحمر) ببساطة لا تمتزج جيدًا. أي من هذه التوليفات هي ببساطة قوية جدًا على التباين بحيث يتعذر على الدماغ معالجتها بشكل مريح.
مرة أخرى ، جاهد للحصول على ألوان أكثر طبيعية وممزوجة تتجنب مجموعات إجهاد الدماغ التي تأتي من استخدام الألوان التي تتعارض مباشرة مع بعضها البعض على عجلة الألوان ، أو المتناقضة من حيث الدفء والبرودة.
تركيبات منخفضة التباين بشكل مفرط
هذا لا يعني ، مع ذلك ، أنه يجب عليك استخدام الألوان المتماثلة تقريبًا في تدرج اللون (اللون) والقيمة (الظلام النسبي). يمكنك الذهاب بعيدًا في هذا الاتجاه أيضًا ، مما يخلق نوعًا مختلفًا من المشاكل للزوار.
قد يؤدي وضع نص فاتح على خلفية بيضاء ، مثل اللون الوردي أو الأصفر أو الأزرق الفاتح أو الخزامى على الأبيض ، إلى صعوبة فهم الزائرين لما يقوله النص. الأمر نفسه ينطبق على النص الداكن على خلفية داكنة ، مثل الأحمر أو الأزرق الملكي أو الأرجواني على الأسود.
التركيبات السيئة الأخرى المحددة هي الأصفر على الأخضر أو الأخضر على الخلفيات الصفراء والحمراء مع الأسود أو الأزرق أو الأرجواني. لا تخاطر فقط بأن الزائر المصاب بعمى الألوان قد لا يرى أي نص على الإطلاق ، ولكنك ستزعج الزوار غير المصابين بعمى الألوان من خلال إجهادهم لقراءة ما كتبته. ونحن لا نتحدث هنا عن انطباعات اللاوعي. نحن نتحدث عن غضبهم بوعي منك لأنهم جعلوا موقع الويب الخاص بك صعبًا جدًا على قراءته.
ينتشر هذا الخطأ بشكل خاص عندما تقوم بتركيب النص فوق الصور ، كما هو الحال في صورة رأس كبيرة أعلى الصفحة. تأكد دائمًا من أن كل نصوصك يقرأ بوضوح على صور رأس الصفحة ، وليس معظمها فقط.
خلفيات متعددة الألوان
تكثر مواقع الويب التي تقدم خلفية مزخرفة مجانية لمصممي الويب ، وقد تشعر أنها ستجعل موقع الويب الخاص بك بارزًا. لكن كن حذرًا إذا اخترت استخدام واحدة. تتعرض الخلفيات المزخرفة لخطر الانشغال وبالتالي تشتت انتباه الزائرين عن المحتوى الخاص بك. وتواجه نفس خطر ضياع النص في الخلفيات المزخرفة كما تفعل مع تراكب النص على الصور.
كن حذرًا في اختيارك لخلفية مزخرفة. تجنب الخلفيات المتضاربة بالألوان والمثيرة للطعن والتي كانت شائعة في أيام الإنترنت الأولى. غالبًا ما كانت هذه الخلفيات مكونة من تصميمات متكررة صغيرة بألوان زاهية متضاربة يضيع فيها النص بسهولة.
الاتجاه اليوم هو الحصول على مظهر طبيعي خفي يمنح خلفيتك إحساسًا بالعمق دون تشتيت الانتباه. والقاعدة العامة للوحات الألوان لمواقع الويب هي عدم استخدام أكثر من ثلاثة ألوان ، وبالتأكيد ليس أكثر من أربعة.
ينطبق نفس التحذير الذي يجب توخي الحذر عند استخدامه للأنسجة على استخدامك للتدرجات (عنصر رسومي حيث يتغير لون أو تعتيم الخلفية تدريجياً من جزء من الخلفية إلى جزء آخر). تجنب استخدامها لمجموعات نصية متعددة على الصفحة. وتجنب استخدام التدرج اللوني الذي يتضمن لون النص الخاص بك ، حتى لا يضيع النص في التدرج اللوني. ضع النص دائمًا في مربعات أو في منطقة خالية من الخلفية ، مع وجود مساحة كافية من العناصر المرئية الأخرى بحيث يبرز النص بوضوح.
استنتاج
من الواضح أن اختيار الألوان لموقع ويب يتضمن أكثر من اختيار الألوان المفضلة لديك أو مجموعة من الألوان التي أعجبتك في موقع ويب آخر. إنه ينطوي على أكثر من مجرد أخذ توصية معزولة من مقال عبر الإنترنت حيث كل ما يمكن معرفته عن اختيار اللون دون معرفة المزيد.
اللون هو أداة قوية للغاية في الإقناع. عند استخدامه بعناية ، يمكن أن يساعد في توجيه الزوار نحو إجراء تريدهم أن يقوموا به. عند استخدامه بلا مبالاة ، يمكن أن يترك للزائرين إحساسًا غامضًا بعدم الارتياح بشأن عملك أو حتى يتركهم غاضبين بوعي من صعوبة استخدام موقعك.
ركز اختياراتك للألوان على تلك التي تكون سهلة على عقلك ، واستمر في تعلم كيفية اختيار الألوان التي تعمل بشكل جيد معًا وستكون في طريقك إلى تصميم موقع تعمل فيه ألوانك مع جميع العناصر الأخرى الخاصة بك. موقع لتحقيق أهدافك.