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

وبه نستعين

الألوان /  برمجة ألوان الويب

Web Color Coding

 

برمجة ألوان الويب

Web Color Coding

تعني كلمة برمجة Coding تشفير أو ترقيم أو ترميز البيانات أو كتابة برامج الحاسوب. ويتم برمجة الحاسوب باستخدام لغة HTML، وهي لغة البرمجة الرئيسية للإنترنت. وكلمة HTML تعني (لغة ترميز النص التشعبي). حيث يتم تحديد ألوان تصميم الويب من خلال ثلاثة أنظمة تشفير مستخدمة على نطاق واسع: الترميز الثنائي binary coding، والترميز السداسي العشري hexadecimal coding، والترميز CMYK.

الترميز الثنائي binary coding

يعتمد الكمبيوتر في أداء وظائفه على الترميز أو الكود الثنائي. حيث يفصل الكود الثنائي كل جزء من المعلومات في سلسلة باستخدام مزيج من رقمين وهما 0 و 1. ويمكن لسلسلة من ثمانية أرقام ثنائية binary digits، أو بتات bits (أصغر وحدة قياس المعلومات في الكمبيوتر، وكل 8 بت يكونوا 1 بايت Byte)، أن تمثل أيًا من 256 قطعة ممكنة من المعلومات.

يتم تحديد الألوان في العديد من البرامج المستخدمة على نطاق واسع باستخدام الكود أو الرمز الثنائي، والذي يتعلق بعمل نوع من النسبة والتناسب بين الأطوال الموجية للألوان الأساسية وهي الأحمر والأخضر والأزرق. يحدد الترميز اللوني الثنائي 256 درجة، محددة من 0 إلى 255، من الأحمر والأخضر والأزرق (بهذا الترتيب المحدد)، حيث لكل بكسل pixel (وحدة بناء الصورة) من الصورة التي تظهر على الشاشة.

يتم ترميز (إنشاء كود) كل لون باستخدام عنصر الكثافة أو التركيز intensity داخل البكسل، حيث يمثل 0 عدم وجود اللون ويمثل 255 اللون في أقصى حالات التركيز. فعلى سبيل المثال، اللون الأسود ليس له لون وهو 0،0،0. يحتوي الأبيض على جميع الانتخابات التمهيدية الثلاثة أو الألوان الأساسية الثلاثة بشكل متساوٍ وبكثافة كاملة ويتم ترميزه على أنه 255،255،255.

كود اللون الأحمر هو 255،0،0 وكود الأخضر هو 0،255،0 وكود الأزرق هو 0،0،255. وبنفس الأسلوب المنطقي يتم إنشاء الرموز الثنائية للألوان الثانوية للضوء: فمثلا، اللون الأصفر yellow هو مزيج من الأحمر والأخضر، هو 255،255،0 وكذلك اللون السماوي cyan هو مزيج من الأخضر والأزرق هو 0،255،255 واللون الأرجواني (الفوشيا) magenta هو مزيج من الأحمر والأزرق هو 255،0،255.

وبناء على ذلك يمكن ترميز أي لون في النطاق المتاح بهذه الطريقة. فعلى سبيل المثال، اللون الموصوف بأنه (أحمر برتقالي – وبرتقالي) هو 255.102.0 أي أحمر كامل أو مكثف، مع ما يكفي من اللون الأخضر (لأن الأخضر والأحمر ممزوجان بالتساوي في الضوء ينتجان الأصفر) لجعله برتقاليًا.

الترميز السداسي العشري hexadecimal coding

يتم وصف ألوان تصميمات الويب الجرافيكية، أيضًا باستخدام النظام الست عشري hexadecimal coding. تعتمد مواصفات كل لون في النظام الست عشري على كود مكون من 16 رمزًا symbol يتكون من الأرقام من 0 إلى 9 ومن الأحرف من A إلى F. يتم تحديد كل لون بواسطة رمزين كنسبة مئوية من كل لون أساسي. ويصدر ذلك بترتيب محدد وهو أحمر وأخضر وأزرق. المواصفات الكاملة أو التفصيلية تسمى ثلاثية سداسية hex triplet. ولا يوجد انبعاث بطول موجة يشار إليه بالرمز 00 حيث أقصى انبعاث ممكن يكون مثل FF.

وبناء على ذلك، فإن الأسود هو 00000 أو بمعني أخر عندما لا يوجد انبعاث ضوئي، اللون الأبيض هو FFFFFF، أو كل الانتخابات التمهيدية (الألوان الأساسية الثلاثة) تنبعث بالتساوي. يشار إلى الأحمر كـ FF0000؛ الأخضر مثل 00FF00 والأزرق 0000FF. الأصفر هو FFFF00، يمكن عمل مزيج الألوان الثانوية من الأحمر والأخضر، مع عدم وجود اللون الأزرق. يمكن أيضًا ترميز أي لون في النطاق المتاح بهذه الطريقة.

اللون (أحمر برتقالي – وبرتقالي) الذي يساوي 255102.0 في الكود الثنائي، يساوي في الكود الست عشري FF6600. لا يوفر الترميز الثنائي ولا السداسي العشري تدرجات انتقالية مثالية بين الألوان. قد تصلح الرموز الوسطى لأنشاء ألوانًا متوسطة وقد لا تصلح في بعض الأحوال الأخرى، وبالتالي لا يمكن الثقة في درجات الألوان باستخدام هذه الأرقام.

الترميز CMYK

تتركز أهمية البرمجة بـ CMYK في أنه لا تزال عين المصمم ضرورية لاتخاذ قرارات بشأن الألوان والتسلسلات النهائية. يحاكي تشفير CMYK نسب أحبار الطباعة CMYK. يعطي كل رمز النسبة المئوية لكل لون حبر، بترتيب CMYK، والذي سينتج اللون المطلوب عند طباعته في صورة نقاط. يوفر تشفير CMYK المسار المباشر الأكثر وضوحاً في حالة التحضير لعملية الطباعة، بما في ذلك التعامل مع قيود الطباعة.

أهمية برمجة ألوان الويب

The Importance of Web Color Programming

يمكن تحويل الألوان التي تم تحديدها في التعليمات البرمجية الثنائية إلى رمز سداسي عشري، والعكس صحيح، باستخدام المخططات أو الصيغ المتاحة بسهولة. يتم تحديد كل من الألوان الثنائية والسداسية العشرية أيضًا بأسماء معترف بها عمومًا من قبل معظم متصفحات الويب.

تساعد الأسماء مصممي الويب في تحديد موقع بعض الألوان بسهولة أكبر من تعييناتهم السداسية الثلاثية أو الثنائية، لكن عدد الأسماء لا يتضمن سوى جزء صغير من الألوان المتاحة. فسابقاً كانت شاشات الألوان المبكرة ذات عمق بت bit- depth محدود. كانت الأداة التي ساعدت المصممين في العمل عبر الإنترنت عبارة عن مجموعة من ألوان RGB تسمى لوحة الويب الآمنة (أو Netscape). كانت هذه الألوان (ولا تزال) متوفرة عبر الإنترنت، في شكل كتاب وكخيار في برامج التصميم القديمة.

تحدد لوحة الألوان الآمنة للويب 216 لونًا في نطاق كامل من درجات الألوان المتسقة بشكل معقول للعرض على كل من الأنظمة الأساسية لأجهزة Mac وأجهزة الكمبيوتر والشاشات ذات نطاق العرض المحدود (256 لونًا). إن عدد الألوان في هذه اللوحة palette غير كبير، مما سمح للمصممين الوصول لنسبة من التأكد من أن الألوان التي تصل إلى الكمبيوتر المنزلي ستظهر مشابهه للأصل.

حيث تم اختيار الألوان الموجودة في لوحة الألوان الآمن للويب لأنها توفر طريقة إرسال معلومات الألوان بطريقة مناسبة، وليس لأنها أفضل تطبيق يتعامل مع الألوان أو مع تصميم مثالي. هناك العديد من الألوان قد يكون متشابهة تمامًا داخل كل مجموعة ألوان. حيث كلما زاد عدد الألوان المتشابهة في مختلف المجموعات كلما زادت فرصة الحصول على مجموعة متنوعة من الألوان بسبب اختلاف نوع الشاشات عن بعضها، حيث كل شاشة تعرض الألوان وفق مستوى صناعتها.

كان على المصمم الذي كان يعمل في السابق ضمن لوحة الويب الآمنة أن يتجنب استخدام الألوان ذات الاختلافات الدقيقة، مما جعل الخيارات في العمل محدودة داخل لوحة الويب الآمنة، والتالي قد يحصل المصمم على نتيجة أقل من مرضية. إن التقدم في إمكانيات الأجهزة والبرامج وانتشار الشاشات التي تتمتع بقدرة عرض أكبر جعلت لوحة الألوان الآمنة على الويب أداة مفيدة ولكنها أقل أهمية مما كانت عليه في الماضي.

لكن في حالة العمل خارج حدود لوحة الويب الآمنة، توجد مجموعة هائلة من الألوان المتاحة، حيث كل منها يجب أن يتم تحديده بشكل فردي حسب الوظيفة المطلوبة. وبالتالي، قد يكون اختيار الألوان من هذا العدد الهائل أمرًا مربكًا.

يساعد تقليل التدرج اللوني إلى الحصول على لوحة أصغر، أو مجموعة محدودة من الألوان مع وجود علاقات محددة مسبقًا بين الألوان، في جعل عملية تحديد اللون أكثر قابلية للإدارة. يتوفر نظام لوحات الألوان المحددة مسبقًا Preselected color palettes للمصممين سواء على شكل برامج أو رسوم بيانية مجانية أو للشراء، حيث يقدم كل منها مجموعات يمكن الاختيار الأفضل منها.

تتمثل إحدى المشكلات المرتبطة بلوحة الألوان الثابتة في أن الألوان المطلوبة لعرض صورة معينة قد لا تكون متوفرة في اللوحة، بينما يتواجد العديد من الألوان الأخرى المتاحة. فعلى سبيل المثال، اللوحة الثابتة التي تحتوي في الغالب على درجات مختلفة من اللون الوردي، لن تكون مناسبة تمامًا للصور التي لا تحتوي على اللون الوردي.

يتمثل أحد الاتجاهات في البرامج، التي تفترض وجود شاشة بعمق 24 بت، في استخدام لوحة ألوان قابلة للتكيف أو محسّنة، حيث يتم تحديد الألوان المتاحة من خلال تحديد مدى تكرار ظهورها في صورة المصدر الأصلية. حيث من المرجح أن تكون الصورة القائمة على لوحة محسّنة أو قابلة للتكيف قريبة من صورة المصدر الأصلية أكثر من أي طريقة أخرى.

أمثلة عميلة عن برمجة ألوان الويب

Practical Examples of Web Color Programming

مثال (1)

ترميز لون الشاشة: ألوان الشاشة مشفرة بأكثر من طريقة. يمكن تحديد لون الشاشة في الترميز الثنائي binary coding، والترميز السداسي العشري hexadecimal coding، وبواسطة الطباعة CMYK المكافئة. 

مثال (2)

لوحة الويب الآمنة. تقدم VisiBone لوحة آمنة للويب عبر الإنترنت وفي شكل مخططات مطبوعة وكتب ومجلدات وبطاقات. © 2005 VisiBone. (لا يستخدم هذا الشكل عملية الطباعة ذات الألوان الثمانية في VisiBone لمطابقة لون شاشة الكمبيوتر). 

مثال (3)

لوحات محدودة: تقدم VisiBone لوحة مختارة مسبقًا من 1.068 لونًا خارج لوحة الألوان الآمنة للويب، مع تسميات الكود الثنائي كأداة مرجعية لمصممي صفحات الويب. © 2010 VisiBone’s 1,068 مخطط مرجعي ملون. (لا تستخدم هذه الطريقة عملية طباعة VisiBone ذات الثمانية ألوان لمطابقة لون شاشة الكمبيوتر). 

 

أرجو أن تنال التدوينة إعجابكم وإلى لقاء قريب بإذن الله

 

المراجع والمصادر: -

كتاب "فهم اللون – مدخل المصمم".

UNDERSTANDING COLOR - An Introduction for Designers

 

لمزيد من التواصل تابعونا على وسائل التواصل الاجتماعي

حساب "مدونة ألوان" على فيسبوك.

حساب "مدونة ألوان" على انستجرام.

حساب "مدونة ألوان" على تويتر.