ألوان الويب
إتش.تي.إم.إل HTML |
---|
|
ألوان الويب هي ألوان مستخدمة في تصميم صفحات الويب، وهي طرق لوصف وتحديد تلك الألوان.
ولدى مصممي صفحات الويب مجموعة متنوعة من الخيارات المتاحة لتحديد ألوان عناصر الوثائق على شبكة الإنترنت. ويمكن تحديد الألوان بثلاثية ح خ ز بشكلها الستة عشري، كما أنها قد تكون محددة وفقا لأسمائها الانكليزية المعروفة في بعض الحالات. وغالبا ماتستخدم أداة الألوان (color tool) أوبرامج الرسوميات لتوليد قيم اللون.
لقد استخدمت الإصدارات الأولى من برنامج موزايك ومستكشف نتسكيب أسماء الألوان إكس 11 كأساس لقوائم اللون الخاصة بها، وفهي بدأت كتطبيقات في نظام النوفذة س.
ولألوان الويب تعريفا لونيا واضحا، وهي الفضاء اللوني المعياري ح خ ز، التي تربط لونيات إعدادات الفوسفورات، ومنحني التحويل المحدد، والنقطة البيضاء، وظروف الرؤية. وقد اختيرت هذه المتغيرات لتكون مماثلة للعديد من شاشات العرض القريبه مما نراه في العالم الحقيقي وظروف الرؤية، وبذلك تكون قريبة من القيم المحددة بدون حتى إدارة الألوان. ومع ذلك، وكلاء المستخدم (user agents) يتفاوتون في دقة تمثيل الألوان المحددة. بعض وكلاء المستخدم المتطورون يستخدمون إدارة الألوان لتوفير أفضل الألوان، وهذا مهم بشكل خاص لشبكة الإنترنت في تطبيقات الطباعة.
الهيكس الثلاثي
الهيكس الثلاثي (Hex triplet) مكون من ست خانات، في جميع خانه عدد ستعشري مكون من ثلاثه بايت byte وتستخدم في الاتش تي ام الHTML وCSSالسي اس اس واس في جي SVG، وغيرها من تطبيقات الحوسبة، لتمثيل الألوان.
البايت يمثل المكونات الحمراء والخضراء والزرقاء للون. والبايت الواحد يمثل رقم في نطاق 00 إلى FF (في التدوين الرقمي الست عشري)، أومن 0 إلى 255 بالتدوين الرقمي العشري.
وهذا يمثل على الأقل من (0) إلى (255) كثافة جميع عنصر من عناصر اللون.
ان الهيكس الثلاثي يتشكل بواسطة سلسله من ثلاثه بايت في تدوين ست عشري، وفقا للترتيب التالي :
- البايت 1 : قيمة الاحمر (نوع اللون الأحمر)
- البايت 2 : قيمة خضراء (نوع اللون الأخضر)
- البايت 3 : قيمة زرقاء (نوع اللون الأزرق)
- البايت 2 : قيمة خضراء (نوع اللون الأخضر)
على سبيل المثال، حيث قيم الالوان الأحمر / الأخضر / الأزرق هي الأرقام العشرية : أحمر = 36، 104 = الأخضر، الأزرق = 160 (رمادي أزرق اللون).
الأرقام العشرية 36 و104 و160 هي معادلة لأرقام ست عشرية 24 و68 وA0 على التوالي. يتم تمثيل الهيكس الثلاثي بواسطة سلسلة منستة أرقام ست عشرية معا، كما في هذا المثال 2468A0.
فهما أنه إذا كانت قيمه أيا من الثلاث قيم أقل من 16 (عشري) أوعشرة (ستعشري)، يجب حتى يسبق الرقم بصفر حتىقد يكون دائما مكون من ست أرقام. على سبيل المثال، الثلاثي العشري أربعة وثمانية و16 يمثل بالستعشري 04، 08، 10، ويتشكل الهيكس الثلاثي هكذا 040810.
عدد الألوان التي يمكن حتى يمثلها هذا النظام:
ان توسيع النموذج إلى تمثيل الستة أرقام يعتبر بسيطا.فكل رقم يضاعف : حيث 09C يصبح 0099CC. وهذا يسمح لكل قيمة لون تغطية مجموعتها الكاملة من 00 إلى FF. وتمثيل الرقم الثلاثي مشروح في مواصفات السي اس اس CSS، وليس في الاتش تي ام ال HTML. نتيجة لذلك هوغير صالح في بعض المتصفحات. {1 [بحاجة لمصدر]
تحويل ح خ ز إلى الست عشري
قيم ح خ ز عادة في نطاق ما بين 0-255 ؛ اما إذا كانوا في نطاق 0-1، فالقيم مضروبة في 255 قبل التحويل. عندما نقسم العدد بالعدد 16 (قسمة عدد سليم ؛ تجاهل المتبقي) يعطينا أول عدد ست عشري (بين 0 ووF، حيث الحروف A إلىF تمثل الأرقام منعشرة ال 15. انظر الستعشري hexadecimal لمزيد من التفاصيل). والباقي يعطينا ثاني رقم ستعشري.
على سبيل المثال قيمة العددRGB= 201 نقسم العدد 201 على 16 يعطينا 12، وبالتالي فإن الرقم الأول هوC. والمتبقييتسعة هوالرقم الثاني فالنتيجه الرقم الست عشري C9. وتتكرر هذه العملية لكل واحد من قيم اللون الثلاثه.
ان معظم أنظمة التشغيل الحديثة مدمج فيها آلة حاسبة لتطبيق تحويلات بين قواعد العدد ويمكن أيضا القيام بهذه العمليات بواسطة آلات الحاسبة اليدوية. ويمكن حتى تكون هذه المهمة نفذت باستخدام موارد الشبكة المتنوعة. [6]
أسماء ألوان الاتش تي ام ال HTML
تقوم مواصفات أتش تي أم أل 4.01 بتعريف ستة عشر لونا مسمياً، كما يلي : (أسماءهذه الألوان مرتبة أبجديا كم أنها تتأثر بحالة الأحرف الكبيرة والصغيرة (case-insensitive) :
اللون | الستة عشري | اللون | الستة عشري | اللون | الستة عشري | اللون | الستة عشري |
---|---|---|---|---|---|---|---|
سيان | #00FFFF | رمادي | #808080 | بحري | #000080 | فضي | #C0C0C0 |
أسود | #000000 | أخضر | #008000 | زيتوني | #808000 | أخضر مزرق معتدل | #008080 |
أزرق | #0000FF | ليموني | #00FF00 | أرجواني | #800080 | أبيض | #FFFFFF |
فوشي / قرمزي | #FF00FF | كستنائي | #800000 | أحمر | #FF0000 | أصفر | #FFFF00 |
هذه الستة عشرة لونا وصفت بأنها اس ار بي جي sRBG ووهي مدرجه في مواصفات اتش تي ام ال HTML 3.0، وملاحظ انها " الوان لوح ويندز في جي اي VGA القياسية [8]
أسماء ألوان إكس 11 X11
بالإضافة إلى ذلك فإن عددا من الألوان يتم تعريفها بواسطة متصفحات الويب. بعض المتصفحات قد لا تتعهد على جميع من هذه الألوان، ولكن بصفه عامه اعتبارا من عام 2005 جميع المتصفحات الحديثة تدعم القائمة الكاملة. الكثير من هذه الألوان هي من قائمة أسماء ألوان X11وهي موزعه مع نظام X Window. هذه الألوان هي قياسيه بالنسبة اس في جيSVG 1.0، ومقبولة من قبل وكلاء مستخدمي اس في جي{1 SVG الكامل{/1 . وأنها ليست جزءا من SVG Tiny.
ولغه نت فريم وركNET Framework{/0. تستخدم نفس الاسماء تقريبا، في KnownColor وترقيم الألوان. والفرق الوحيد هولون الاخضر البحري الغامق الذي يعهد بأنه 8F، BC، 8B (بدلا من 8F، BC، 8F).
قائمة الألوان مدمجه مع منتج اكس ون ون X11 الذي يتفاوت بين التطبيق، والذي يتشابك مع بعض أسماءHTMLا مثل اللون الأخضر. وعلاوة على ذلك، فإن ألوان الاكس ون ون X11 تعهد بأنها اس ار بي جي RGB البسيطة (لا سيما لون الفضاء)، بدلا من sRGB. وهذا يعني حتى قائمة من الألوان التي توجد في X11 (مثلا في / usr/lib/X11/rgb.txt) لا ينبغي حتى تستخدم بشكل مباشر في اختيار الألوان لشبكة الإنترنت. [9]
قائمة "ألوان X11" على شبكة الإنترنت هي من مواصفات CSS3، جنبا إلى جنب مع نظرائها العشرية والستعشرية، في الجدول المبين أدناه، قارن قوائم الأبجدي في معايير W3C. فهما بأن هذا يضم المترادفات الشائعة : أكوا (HTML4/CSS 1.0 اسم قياسي) وسماوي (الاسم الشائع sRGB)، قرمزي (الاسم الشائع sRGB) وف (HTML4/CSS 1.0 اسم قياسي) والرمادي (HTML4/CSS 1.0 اسم القياسية والرمادية.
|
|
|
ألوان شبكة الانترنت الآمنة Web-safe colors
العمق اللوني بالپكسل |
---|
لون بت واحد لون 8-بت |
متعلقات |
أحمر أخضر أزرق |
مجموعة أخرى مكونه من 216 قيم اللون رائج انها الوان الويب "الآمنة" لوحة الألوان، وضعت في وقت كان فيه الكثير من شاشات الحاسوب فقط قادرة على عرض 256 لون وهناك مجموعة من الألوان التي بحاجة إلى حتى تظهر من دون التردد على 256 -عروض اللون ؛ والرقم 216 قد تم اختياره ويرجع ذلك ان أنظمة تشغيل الكمبيوتر عادة تحفظ ستة عشر إلى عشرين لونا لاستعمالهم الخاص، أيضا تم اختياره لأنه يسمح بستة ظلال للون الأحمر والأخضر والأزرق (6 ×ستة ×ستة = 216).
قائمة الألوان غالبا ما تعرض وكأن لديها خصائص خاصة الأمر الذي يجعلها في مأمن من التردد. في الواقع، على 256 لونا ان تعرض تطبيقات يمكن حتى تحدد لوحة من اختيارات الألوان التي يختارونها وقد تم اختيار هذه الألوان على وجه التحديد لأنها مطابقة لوحات مختارة من قبل المتصفح ثم التطبيقات الرائدة لحسن الحظ، لم تكن هناك اختلافا جذريا في استخدام لوحات في المتصفحات الشعبية مختلفة.
"ألوان الويب" آمنة كانت تعاني من عيب في ذلك، على أنظمة مثل X11 حيث لوح الالوان هومشهجر بين التطبيقات ،كثيرا ما كانت توزع من قبل المستعرضات مكعبات اللون صغيرة (5 ×خمسة ×خمسة أوأربعة × أربعة × 4) -- إلى غير ذلك ،الوان "الشبكة الآمنة" ممكن ان ترتجف في هذه الأنظمة. وقد تم الحصول على نتائج أفضل من خلال تقديم صورة مع مجموعة أكبر من الألوان ويسمح للمتصفح حتى يثبت قيمة لون الفراغ إذا لزم الأمر، بدلا من حتى يعاني من فقدان جودة تكميم مزدوجة.
اعتبارا من عام 2007 [التحديث]، الحواسيب الشخصية عادة ما تكون على الأقل 16 بت اللون وعادة 24 بت (لون حقيقي). وحتى الأجهزة المحمولة تحتوي على الأقل 16 بت اللون، مدفوعا بإدراج الكاميرات في الهواتف المحمولة. استخدام الوان "الشبكة العالمية " الآمنة قد عفا عنه الزمن العملي، ولكن لا تزال قائمة في مجال الثقافة.
على نظام لوح شبكة الإنترنت الآمنة لا يزال مستمرا حيث اللوحة مريحه حيث العين البشريه يمكنها تمييز الألوان. وأدى استخدام ألوان الويب الآمنة في أنظمه مكافحة الخداع. [12]
الوان الويب الآمنة لا يناسبكل منها أسماء قياسية، ولكن جميع منها يمكن حتى تكون محددة من قبل الثلاثي RGB : جميع عنصر (الأحمر والأخضر والأزرق) تأخذ واحدة من القيم الستة من الجدول التالي (من أصل 256 قيم ممكنه متاحة لكل جزْء تام في 24 بت اللون).
رَقْم | سِتَّ عَشَرِيّ | عُشْرِيّ |
---|---|---|
0 | 00 | 0 |
3 | 33 | 51 |
6 | 66 | 102 |
9 | 99 | 153 |
C أو(12) | CC | 204 |
F أو(15) | FF | 255 |
ويبين الجدول التالي "ألوان" شبكة الإنترنت الآمنة، مما يؤكد ح - الألوان الآمنة الحقيقة. عدم وجود تسليم غاما يعني حتى الكثافات الستة المرجوة 0 ٪، 20 ٪، 40 ٪، 60 ٪، 80 ٪، و100 ٪، كما يتم عرض 0 ٪، 2 ٪،عشرة ٪، 28 ٪، 57 ٪، وبنسبة 100 ٪ على معيار {1 ويندوز{/1 2.5 غاما إنبوب أشعة القطب السالب أوشاشات الكريستال السائل ،2.5 CRT or LCD وتصبح الألوان داكنة جدا. (أحد أوجه القصور في لوحة شبكة الإنترنت الآمنة هوسوء اختيار ألوان الخلفية الخفيفة.) في كثير من الأحيان من الصعب التمييز بسبب شدة في نهاية منخفضة للمجموعة، وخاصة في أحلك اثنين،
جدول اللون Color table
في الجدول أدناه، لكل لون رمز مذكور مختزل لقيمة RGB، على سبيل المثال، رمز 609 اي ما يعادل رمز RGB 660099.
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* |
الألوان الأكثر أمانا على شبكة الإنترنت Safest web colors
المصممين شجعوا على التمسك بهذه الـ 216 لونا آمنا"على شبكة الإنترنت " في مواقعهم على شبكة الإنترنت، ومع ذلك فإن عرضثمانية بت اللون كان أكثر شيوعا عند لوحة 216 لون مما هي عليه الآن. ديفيد لين وهادلي شتيرن منذ ذلك الحين اكتشفوحتى 22 فقط من 216 الألوان في لوحة شبكة الإنترنت الآمنة موثوق بها وتعرض دون تغيير على 16 بت، على شاشات الكمبيوتر. وأصبحت تسمى هذه ال 22 لونا باللوحه الآمنه،، وتتكون أساسا من ظلال خضراء وصفراء، كما يمكن ملاحظتها في الجدول أعلاه،. [13]
الوان السي اس اس css
CSS هي أوراق الأنماط المتتالية لغة تعهد على نفس العدد من ألوان الاتش تي ام ال HTML، وهي 16 لون المذكورة سابقا. بالإضافة إلى ذلك، CSS 2.1 يضيف |سم اللون 'البرتنطقي' في لائحة :
اللون | الستعشري |
---|---|
بُرْتُنطقِيَّ | #FFA500 |
CSSوSVG وCSS 2.1 تسمح للمحررين على شبكة الإنترنت باستخدام ما يسمى نظام الألوان، والتي هي تعبير عن أسماء الألوان والقيم تؤخذ من نظام التشغيل. يتيح هذا للمحررين على شبكة الإنترنت لعرض المضمون وفقا لنظام التشغيل لوكيل المستخدم.
تطوير مواصفات CSS3 سيدخل لون فراغHSL القيم لأوراق الأنماط :
/* 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 */
/* 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 */
سهولة الدخول والوصول Accessibility
- بعض المتصفحات والأجهزة لا تدعم الألوان.
- بالنسبة للمستخدمين المكفوفين وعمى الألوان، يمكن حتى محتوى الويب يعتمد على ألوان تكون غير صالحة للاستعمال أويصعب استخدامها.
- خلط هجرة ترميزية مثل bgcolor مع CSS الحديثة قد يحصل فشل لإرث المتصفحات التي لا تدعم CSS.
- وينبغي حتى جميع لون الأمامية والخلفية قابله للتعديل لتجنب الآثار السوداء على السوداء.
المتصفحات تظهر الروابط التشعبية كظلال زرقاء. ألوان الخلفية المظلمة، مثل الأزرق أوالبحرية، لا تعرض بشكل جيد لمثل هذه الروابط. استخدام CSS لتعديل الألوان قد لا تعمل مع جميع المتصفحات. على سبيل المثال، نتسكيب 4.x يدعم CSS غالبا مايمنع لانه لا قيمه له.
اقرأ أيضاً
- قائمة لوحات الألوان
- أداة اللون
- قائمة الألوان
المراجع
- ^ Web Design in a Nutshell By Jennifer Niederst Robbins. Page 103.
- ^ Beginning CSS By Richard York. Page 71-72.
- ^ Guide to Graphics. SP LUS, splus.com. Page 13.
- ^ Digital Color Imaging Handbook By Gaurav Sharma. ISBN 084930900X
- ^ W3C TR CSS3 Color Module, SVG color keywords
- ^ W3C TR SVG 1.0, recognized color keyword names
وصلات خارجية
- 4,096 Web-Safe Colors
- CSS2.1 Color Specification
- Sortable Table of X11 Colors
- ألوان الويب at the Open Directory Project
- X11/browser colors, with closest web-safe equivalents
أسود | رمادي | فضي | أبيض | أحمر داكن | أحمر | أرجواني | قرمزي | أخضر | ليموني | زيتوني | أصفر | أزرق داكن | أزرق | أخضر داكن | أزرق مائي |