مرجع
آخر الزيارات

ألوان الويب

2٬103 كلمة•0 مشاهدة•🗒️ منذ 16 يوماً
باختصار: ألوان الويب هي ألوان مستعملة في تصميم صفحات الويب، وهي طرق لوصف وتحديد تلك الألوان. تتناول المقالة 11 قسماً، منها «الوان السي اس اس css»، «/* RGB model */» و«/* HSL model, added to CSS3 */».
المحتويات
  1. الوان السي اس اس css
  2. /* RGB model */
  3. /* HSL model, added to CSS3 */
  4. سهولة الدخول والوصول Accessibility
  5. جدول اللون Color table
  6. ألوان شبكة الإنترنت الآمنة
  7. /* HSL model with alpha channel */
  8. أسماء ألوان الاتش تي ام ال HTML
  9. أسماء ألوان إكس 11 X11
  10. الهيكس الثلاثي
  11. تحويل ح خ ز إلى الست عشري
ألوان الويب

بدايةً، ألوان الويب هي ألوان مستعملة في تصميم صفحات الويب، وهي طرق لوصف وتحديد تلك الألوان. ونتناول فيما يلي مزيدًا من التفاصيل.

كذلك، لقد استعملت الإصدارات الأولى من برنامج موزايك ومستكشف نتسكيب أسماء ألوان إكس 11 كأساس لقوائم اللون الخاصّة بها، وفهي بدأت كتطبيقات في نظام النوفذة س.

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

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

الوان السي اس اس css

من جهة ثانية، CSS هي أوراق الأنماط المتتالية لغة تعرف على نفس العدد من ألوان الاتش تي ام ال HTML، وهي 16 لون المذكورة سابقا.

فضلًا عن ذلك، CSS 2.1 يضيف – سم اللون 'البرتقالي' في لائحة:

تطوير مواصفات CSS3 سيدخل لون فراغHSL القيم لأوراق الأنماط:

وعلى صعيد آخر، CSSو SVG وCSS 2.1 تسمح للكاتبين على شبكة الإنترنت باستخدام ما يسمى نظام الألوان، والتي هي عبارة عن أسماء الألوان والقيم تؤخذ من نظام التشغيل. يتيح هذا للكاتبين على شبكة الإنترنت لعرض المضمون بحسب نظام التشغيل لوكيل المستعمل.

/* RGB model */

  • p { color: #F00 } /* #rgb */
  • p { color: #FF0000 } /* #rrggbb */
  • p { color: rgb(255,0,0) } /* integer range 0 - 255 */
  • p { color: rgb(100%, 0%, 0%) } /* float range 0.0% - 100.0% */
  • /* RGB with alpha channel, added to CSS3 */
  • p { color: rgba(255,0,0,0.5) } /* 0.5 opacity, semi-transparent */

/* HSL model, added to CSS3 */

  • p { color: hsl(0, 100%, 50%) } /* red */
  • p { color: hsl(120, 100%, 50%) } /* green */
  • p { color: hsl(120, 100%, 25%) } /* dark green */
  • p { color: hsl(120, 100%, 75%) } /* light green */
  • p { color: hsl(120, 50%, 50%) } /* pastel green */

سهولة الدخول والوصول Accessibility

من جانب آخر، خلط تركة ترميزية مثل bgcolor مع CSS الحديثة قد يحصل فشل لإرث المتصفحات التي لا تدعم CSS.

وعلى صعيد آخر، بالنسبة للمستعملين المكفوفين وعمى الألوان، يمكن أن محتوى الويب يعتمد على ألوان تكون غير صالحة للاستعمال أو يصعب استخدامها.

وفي السياق ذاته، المتصفحات تظهر الروابط التشعبية كظلال زرقاء. ألوان الخلفية المظلمة، مثل الأزرق أو البحرية، لا تعرض بشكل جيد لمثل هذه الروابط. استخدام CSS لتعديل الألوان قد لا تعمل مع جميع المتصفحات. مثلًا، نتسكيب 4.x يدعم CSS غالبا مايمنع لانه لا قيمه له. [عدل]

  • اقرأ كذلك
  • قائمة لوحات الألوان
  • أداة اللون
  • قائمة الألوان
  • المراجع
  • وصلات خارجية
  • 4,096 Web-Safe Colors
  • CSS2.1 Color Specification
  • Sortable Table of X11 Colors

بعض المتصفحات والأجهزة لا تدعم الألوان.

من جانب آخر، وينبغي أن كل لون الأمامية والخلفية قابله للتعديل لتجنب الآثار السوداء على السوداء.

جدول اللون Color table

الألوان الأكثر أمانا على شبكة الإنترنت Safest web colors

وفي السياق ذاته، Web-Safe Colors *000* 300 600 900 C00 *F00* *003* 303 603 903 C03 *F03* 006 306 606 906 C06 F06 009 309 609 909 C09 F09 00C 30C 60C 90C C0C F0C *00F* 30F 60F 90F C0F *F0F* 030 330 630 930 C30 F30 033 333 633 933 C33 F33 036 336 636 936 C36 F36 039 339 639 939 C39 F39 03C 33C 63C 93C C3C F3C 03F 33F 63F 93F C3F F3F 060 360 660 960 C60 F60 063 363 663 963 C63 F63 066 366 666 966 C66 F66 069 369 669 969 C69 F69 06C 36C 66C 96C C6C F6C 06F 36F 66F 96F C6F F6F 090 390 690 990 C90 F90 093 393 693 993 C93 F93 096 396 696 996 C96 F96 099 399 699 999 C99 F99 09C 39C 69C 99C C9C F9C 09F 39F 69F 99F C9F F9F 0C0 3C0 6C0 9C0 CC0 FC0 0C3 3C3 6C3 9C3 CC3 FC3 0C6 3C6 6C6 9C6 CC6 FC6 0C9 3C9 6C9 9C9 CC9 FC9 0CC 3CC 6CC 9CC CCC FCC 0CF 3CF 6CF 9CF CC FCF *0F0* 3F0 *6F0* 9F0 CF0 *FF0* 0F3 *3F3* *6F3* 9F3 CF3 *FF3* *0F6* *3F6* 6F6 9F6 *CF6* *FF6* 0F9 3F9 6F9 9F9 CF9 FF9 *0FC* *3FC* 6FC 9FC CFC FFC *0FF* *3FF* *6FF* 9FF CFF *FFF*

وفي هذا الصدد، المصممين شجعوا على التمسك بهذه الـ 216 لونا آمنا«على شبكة الإنترنت» في مواقعهم على شبكة الإنترنت، ومع ذلك فإن عرض 8 بت اللون كان أكثر شيوعا عند لوحة 216 لون مما هي عليه الآن. ديفيد لين وهادلي شتيرن منذ ذلك الحين اكتشفو أن 22 فقط من 216 الألوان في لوحة شبكة الإنترنت الآمنة موثوق بها وتعرض دون تغيير على 16 بت، على شاشات الكمبيوتر. وأصبحت تسمى هذه ال 22 لونا باللوحة الآمنه، وتتكون أساسا من ظلال خضراء وصفراء، كما يمكن ملاحظتها في الجدول أعلاه. [13]

ومن ناحية أخرى، في الجدول أدناه، لكل لون رمز مذكور مختزل لقيمة RGB، مثلًا، رمز 609 أي ما يعادل رمز RGB 660099.

ألوان شبكة الإنترنت الآمنة

علاوةً على ذلك، مجموعة أخرى مكونه من 216 قيم اللون شائع انها الوان الويب «الآمنة» لوحة الألوان، وضعت في وقت كان فيه الكثير من شاشات الحاسوب فقط قادرة على عرض 256 لون وهناك مجموعة من الألوان التي بحاجة إلى أن تظهر من دون التردد على 256 -عروض اللون؛ والرقم 216 قد تم اختياره ويرجع ذلك ان أنظمة تشغيل الكمبيوتر عادة تحفظ ستة عشر إلى عشرين لونا لاستعمالهم الخاص، كذلك تم اختياره لأنه يسمح بستة ظلال للون الأحمر والأخضر والأزرق (6 × 6 × 6 = 216).

علاوةً على ذلك، الوان الويب الآمنة ليس لكل منها أسماء قياسية، ولكن كل منها يمكن أن تكون محددة من قبل الثلاثي RGB : كل عنصر (الأحمر والأخضر والأزرق) تأخذ واحدة من القيم الستة من الجدول التالي (من أصل 256 قيم ممكنه متاحة لكل جزْء كامل في 24 بت اللون).

إضافةً إلى ذلك، على نظام لوح شبكة الإنترنت الآمنة لا يزال مستمرا حيث اللوحة مريحه حيث العين البشرية يمكنها تمييز الألوان. وأدى استخدام ألوان الويب الآمنة في أنظمة مكافحة الخداع. [12]

علاوةً على ذلك، «ألوان الويب» آمنة كانت تعاني من عيب في ذلك، على أنظمة مثل نظام النافذة إكس حيث لوح الألوان هو مشترك بين التطبيقات، كثيرا ما كانت توزع من قبل المستعرضات مكعبات اللون صغيرة (5 × 5 × 5 أو 4 × 4 × 4) -- وهكذا، الوان «الشبكة الآمنة» ممكن ان ترتجف في هذه الأنظمة. وقد تم الحصول على نتائج أفضل من خلال تقديم صورة مع مجموعة أكبر من الألوان ويسمح للمتصفح أن يثبت قيمة لون الفراغ إذا لزم الأمر، بدلا من أن يعاني من فقدان جودة تكميم مزدوجة.

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

إضافةً إلى ذلك، ويبين الجدول التالي «ألوان» شبكة الإنترنت الآمنة، مما يؤكد ح - الألوان الآمنة الحقيقة.

ومن جهة أخرى، عدم وجود تصحيح غاما يعني أن الكثافات الستة المرجوة 0 ٪، 20 ٪، 40 ٪، 60 ٪، 80 ٪، و 100 ٪، كما يتم عرض 0 ٪، 2 ٪، 10 ٪، 28 ٪، 57 ٪، وبنسبة 100 ٪ على معيار {1}ويندوز{/1} 2.5 غاما إنبوب أشعة القطب السالب أو شاشات الكريستال السائل،2.5 CRT or LCD وتصبح الألوان داكنة جدا. (أحد أوجه القصور في لوحة شبكة الإنترنت الآمنة هو سوء اختيار ألوان الخلفية الخفيفة.) في كثير من الأحيان من الصعب التمييز بسبب شدة في نهاية منخفضة للمجموعة، وخاصة في أحلك اثنين،

علاوةً على ذلك، اعتبارا من عام 2007 [التحديث]، الحواسيب الشخصية عادة ما تكون على الأقل 16 بت اللون وعادة 24 بت (لون حقيقي). وحتى الأجهزة المحمولة تحتوي على الأقل 16 بت اللون، مدفوعا بإدراج الكاميرات في الهواتف المحمولة. استخدام الوان «الشبكة العالمية» الآمنة قد عفا عنه الزمن العملي، ولكن لا تزال قائمة في مجال الثقافة.

/* HSL model with alpha channel */

  • p { color: hsla(120, 100%, 50%, 1) } /* green */
  • p { color: hsla(120, 100%, 50%, 0.5) } /* semi-transparent green */
  • p { color: hsla(120, 100%, 50%, 0.1) } /* very transparent green */

أسماء ألوان الاتش تي ام ال HTML

وعلى صعيد آخر، تقوم مواصفات أتش تي أم أل 4.01 بتعريف ستة عشر لونا مسمياً، كما يلي: (أسماءهذه الألوان مرتبة أبجديا كم أنها لا تتأثر بحالة الأحرف الكبيرة والصغيرة (case-insensitive):

من جانب آخر، هذه الستة عشرة لونا وصفت بأنها اس ار بي جي sRBG ووهي مدرجه في مواصفات اتش تي ام ال HTML 3.0، وملاحظ انها " الوان لوح ويندز في جي أي VGA القياسية [8]

أسماء ألوان إكس 11 X11

ومن جهة أخرى، قائمة الألوان مدمجه مع منتج اكس ون ون X11 الذي يتفاوت بين التنفيذ، والذي يتشابك مع بعض أسماءHTMLا مثل اللون الأخضر. وعلاوة على ذلك، فإن ألوان الاكس ون ون X11 تعرف بأنها اس ار بي جي RGB البسيطة (لا سيما لون الفضاء)، بدلا من sRGB. وهذا يعني أن قائمة من الألوان التي توجد في X11 (مثلا في / usr/lib/X11/rgb.txt) لا ينبغي أن تستعمل بشكل مباشر في اختيار الألوان لشبكة الإنترنت. [9]

وعلى صعيد آخر، و لغه نت فريم وركNET Framework{/0.} تستعمل نفس الأسماء على وجه التقريب، في KnownColor وترقيم الألوان. والفرق الوحيد هو لون الأخضر البحري الغامق الذي يعرف بأنه 8F، BC، 8B (بدلا من 8F، BC، 8F).

وهذه RGB هي (Red_Green_Blue).

إضافةً إلى ذلك، قائمة «ألوان X11» على شبكة الإنترنت هي من مواصفات CSS3، جنبا إلى جنب مع نظرائها العشرية والستعشرية، في الجدول المبين أدناه، قارن قوائم الأبجدي في معايير W3C. علما بأن هذا يشمل المترادفات الشائعة: أكوا (HTML4/CSS 1.0 اسم قياسي) وسماوي (الاسم الشائع sRGB)، قرمزي (الاسم الشائع sRGB) وف (HTML4/CSS 1.0 اسم قياسي) والرمادي (HTML4/CSS 1.0 اسم القياسية والرمادية.

من جهة ثانية، علاوةً على ذلك فإن عددا من الألوان يتم تعريفها بواسطة متصفحات الويب. بعض المتصفحات قد لا تتعرف على كل من هذه الألوان، ولكن بصفه عامه اعتبارا من عام 2005 جميع المتصفحات الحديثة تدعم القائمة الكاملة. الكثير من هذه الألوان هي من قائمة أسماء ألوان X11وهي موزعه مع نظام X Window. هذه الألوان هي قياسيه بالنسبة اس في جيSVG 1.0، ومقبولة من قبل وكلاء مستعملي اس في جي{1}SVG الكامل{/1}. وأنها ليست جزءا من SVG Tiny.

الهيكس الثلاثي

وفي هذا السياق، الأرقام العشرية 36 و 104 و 160 هي معادلة لأرقام ست عشرية 24 و 68 و A0 على التوالي. يتم تمثيل الهيكس الثلاثي بواسطة سلسلة من 6 أرقام ست عشرية معا، كما في هذا المثال 2468A0.

من جانب آخر، مثلًا، حيث قيم الألوان الأحمر / الأخضر / الأزرق هي الأرقام العشرية: أحمر == 36، 104 = الأخضر، الأزرق == 160 (رمادي أزرق اللون).

عدد الألوان التي يمكن أن يمثلها هذا النظام:

وفي هذا السياق، علما أنه إذا كانت قيمه أيا من الثلاث قيم أقل من 16 (عشري) أو 10 (ستعشري)، يجب أن يسبق الرقم بصفر حتى يكون دائما مكون من ست أرقام. مثلًا، الثلاثي العشري 4 و 8 و 16 يمثل بالستعشري 04، 08، 10، ويتشكل الهيكس الثلاثي هكذا 040810.

إضافةً إلى ذلك، وهذا يمثل على الأقل من (0) إلى (255) كثافة كل عنصر من عناصر اللون.

  • البايت 1 : قيمة الأحمر (نوع اللون الأحمر)
  • البايت 2 : قيمة خضراء (نوع اللون الأخضر)
  • البايت 3 : قيمة زرقاء (نوع اللون الأزرق)

وفي هذا السياق، ان الهيكس الثلاثي يتشكل بواسطة سلسله من ثلاثه بايت في تدوين ست عشري، بحسب الترتيب التالي:

كذلك، الهيكس الثلاثي مكون من ستّ خانات، في كل خانه عدد ستّ عشريّ مكوّن من ثلاثة بايت وتستعمل في الإتش تي إم إل و السي إس إس وإس في جي ، وغيرها من تطبيقات الحوسبة، لتمثيل الألوان.

البايت يمثّل المكوّنات الحمراء والخضراء والزرقاء للون.

في هذا الإطار، والبايت الواحد يمثل رقم في نطاق 00 إلى FF (في التدوين الستّ عشري)، أو من 0 إلى 255 بالتدوين العشري.

ومن جهة أخرى، ان توسيع النموذج إلى تمثيل الستة أرقام يعتبر بسيطا.فكل رقم يضاعف: حيث 09C يصبح 0099CC. وهذا يسمح لكل قيمة لون تغطية مجموعتها الكاملة من 00 إلى FF. وتمثيل الرقم الثلاثي موضح في مواصفات السي اس اس CSS، وليس في الاتش تي ام ال HTML. نتيجة لذلك هو غير صالح في بعض المتصفحات. {1

تحويل ح خ ز إلى الست عشري

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

كذلك، مثلًا قيمة العددRGB= 201 نقسم العدد 201 على 16 يعطينا 12، وبالتالي فإن الرقم الأول هو C. والمتبقيي 9 هو الرقم الثاني فالنتيجة الرقم الست عشري C9. وتتكرر هذه العملية لكل واحد من قيم اللون الثلاثة.

وفي هذا الصدد، قيم ح خ ز عادة في نطاق ما بين 0-255 ؛ اما إذا كانوا في نطاق 0-1، فالقيم مضروبة في 255 قبل التحويل. عندما نقسم العدد بالعدد 16 (قسمة عدد صحيح؛ تجاهل المتبقي) يعطينا أول عدد ست عشري (بين 0 ووF، حيث الحروف A إلىF تمثل الأرقام من 10 ال 15. انظر الستعشري hexadecimal لمزيد من التفاصيل). والباقي يعطينا ثاني رقم ستعشري.

ما رأيك في هذه المقالة؟

📝 هل في هذه المقالة خطأ؟

إذا وجدت معلومة تحتاج تصحيحاً أو إضافة، أو أردت حذف المقالة، أرسل لنا طلباً وسنراجعه.