TAHA
01-23-2010, 12:07 PM
حدس مي زنيد که چه مقدار از متن صفحه وب شما به طور واقعي توسط کاربر خوانده مي شود ؟ تمام آن ؟ بيشتر آن ؟ حقيقت آن است که کابران اغلب هيچ مقداري از آن را نمي خوانند .
به دنبال اين جمله بايد گفت که در حدود 80% از مردم فقط در مندرجات سايت پويش مي کنند و به دنبال نکات و عبارات کليدي مي گردند . به طور متوسط 25 % کاربراي در خواندن روي مانيتور نسبت به خواندن از روي چاپ آهسته تر عمل مي کنند . بنابراين ،اين واقعيت چگونه بر ساختار صفحه شما اثر مي گذارد ؟ به عنوان يک طرح شما بايد صفحه اي ايجاد کنيد که کاربران بتوانند سريع آن را کاوش کرده و اطلاعات مطالبه کرده را پيدا کنند .
بخاطر آوريد که يکي از تناقضات در طراحي وب اين است که تصور کنيد که وب فرم ديگري از رسانه چاپ است . هنگامي که طرح يک صفحه با مندرجات مشابه به يک مجله و يا بروشور ايجاد مي کنيد کاربران به طور مسلم به سايت ديگري خواهد رفت چراکه شما در نظر نگرفتيد که ماهيت مطالب بر روي وب بايد با ديگر رسانه ها به خصوص چاپ متفاوت باشد.هنگامي که کاربران به سايت شما مي رسند اولين حسي که درآنها ايجاد مي شود از اهميت زيادي برخوردار است.
مثلا ممکن است سايت وب شما که به قصد تجارت ايجاد شده است فقط يک پنجره داشته باشد ولي به هر حال اگر به نظر مشتري غير جذاب باشد شما مشتري خود را به رقيب خود واگذار کرديد. بنابراين اگر بدانيد که بازديد کنندگان فقط سايت شما را مرور مي کنند متوجه خواهيد شد که چرا نبايد کاربران را مجبور به خواندن مطالبي کنيد که براي آنها جالب نيست . کاربران را راضي نگه داريد و آنچه را که مي خواهند به آنها عطا کنيد، حتما آنها به سايت شما باز خواهند گشت .
(قابل ذکر است قواعد بازار يابي در سايتهاي تجاري متفاوت تر از دنياي واقعي مي باشد)
کاربران نمي خواهند که صفحات در هم و نا مربوط را ببينند و از طرفي محتويات و مندرجات سايت نيز ضروري است پس با اين وجود ساختار و انتشار آن هر دو با هم از اهميت برخوردار هستند .
معمولا کاربران سايت شما را براي اطلاعات ويژه اي که در مورد جستجو و يا خريد و ... مي خواهند بازديد مي کنند .
هر چقدر اين عمل براي آنها آسانتر باشد، کارشان را راحت و سريعتر انجام ميدهند. کاربران وب فقط علاقه مند به آنچه که مي خواهند بيابند هستند . کساني که در کارهاي تجارت خرده و جزئي هستند اعتقاد بر اين دارند که مشتري ها خود خواه هستند ، ولي آنها مي دانند که پرداخت صورتحساب است که درهاي تجارت را باز نگه مي دارد و اگر شما اين نکته را درک کنيد صفحه اي بوجود خواهيد آورد که ساختار آن اهداف تجاري کاربران را تامين کند .
سايتي نظير سايت http://www.cnn.com (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.cnn.com) را در نظر بگيريد . به محض ورود به سايت سريعا مي توانيد مرور کلي از کل سايت داشته باشيد و يا به عبارت ديگر شما مي توانيد کل سايت را با نگاه از يک عبارت به عبارت بعدي مرور کنيد و آنچه را که بخواهيد خيلي سريع بدست آوريد . بنابراين تمايل به ديدن مجدد سايت راداريد .سايت فوق از نمونه سايتهاي موفق در جهان مي باشد.
واقعيت در طراحي
يک طراح وب بايد براي فن آوري جديد و اينکه چگونه از ابزارهادر طراحي استفاده کند آماده باشد و معمولا طراحان جديدترين سخت افزارها و نرم افزارها را به کار مي گيرند . به هر جهت اين انگيزه ايجاد مي شود که شما بايد صفحات دو طرفه ديناميکي ايجاد کنيد که نرم افزارهاي جديد و قديم را حمايت کنند . اکثريت استفاده کنندگان وب به جستجوي طراحي عالي وپيشرفته نيستند ولي استثنائاتي هميشه در اين قواعد وجود دارند . به هر جهت يک راهنماي خوب در هنگام طراحي وجود دارد که به قرار زير است :
1- بيشتر کاربران از مانيتورهاي 17 Inch يا کمتر استفاده مي کنند .
2- بيشتر کاربران با تنظيم تفکيک پذيري 480*640 کار مي کنند .
3- بيشتر کاربران داراي مودم هاي با سرعت 56k هستند .
4- اغلب کاربران مرورگرهاي ورژن 4 به پايين دارند .
5- تعداد کمي از مردم زمان زيادي را براي بارگذاري فايلها صرف مي کنند.
*همواره در طراحي وب نکات کلي بالا را در نظر داشته باشيد
المانهاي طرح بندي يک صفحه
قبل از شروع به ساختن صفحه يک ديد کلي و ساختار کلي از سايت را در نظر بگيريد . شما بايد المانهاي صفحه و نيز چگونگي فعل و انفعالاتي که آنها با هم دارند را بدانيد . از نقطه نگاه بصري بايد المانهاي انتخابي را در داخل سايت ايجاد کنيد که اين المانها عبارتند از طرح ، رنگ ، نوع قلم ، تصاوير و چند رسانه اي ها و ... طرح صفحه منوط به آن است که طراح بتواند اطلاعات خود را به کاربر نشان دهد اين نوع قالب بندي بايد براي درک آسان تر اطلاعات باشد مثل اسناد و گزارشها . اين نوع ساختار به دسته بندي و ساده کردن ، ويرايش و توزيع و پخش اطلاعات کمک مي کند به عنوان يک طراح وب بايد ساختار خود را توسعه دهيد ودر اين مرحله تجربيات کاربران مي تواند براي شما بسيار مفيد واقع شود.
موارد زير را در هنگام طراحي يک صفحه در نظر بگيريد :
1- Frameset اجازه مي دهد که صفحات چند گانه شما بصورت واحد ظاهر شود .
2- Margin کنترل مي کند که مطالب چگونه و با چه فاصله اي از کادر مانيتور شروع شوند.
3- Border براي Frame ها و جداول HTML استفاده مي شود.
4- رنگ ايجاد يک احساس گيرا و کلي از ساختار سايت و باعث ازدياد توانايي خواندن ميشود .
5- Space جدا کردن المانهاي صفحه
6- Navigation براي کنترل کاربران براي حرکت در سايت
7- Rule مندرجات صفحه را به قسمتهاي جداگانه و وابسته قسمت مي کند.
8- White Space باعث کم تر کردن بي نظمي المانهاي صفحه مي گردد.
9- Table توزيع المانهاي صفحه در جاهاي مختلف صفحه و شکل دادن اطلاعات در ستونهاي مخفي
10- Lists به طراح اجازه مي دهد تا اقلام را سازماندهي کنيم.
11- Paragraph گروهي از کاراکترهاي متني در صفحه مي باشد.
12- Heading level ايجاد سايزهاي گوناگون از متن و طراحي و سازماندهي آن .
13- Image مورد استفاده در ايجاد جاذبه ابعادي ، اطلاعات ، Navigation
تعيين کنيد که سايت شما کداميک از اين عوامل را در بر دارد و شما را در روند توسعه ياري مي دهد و اگر به اين عوامل پرداخته نشود به تدريج منابع و نيرو ها و زمان خود را از دست خواهيد داد.
طرح معمول صفحه :
وب سايتها از قالبهاي اصلي و پايه براي نمايش اجزاء صفحه استفاده مي کنند . شما مي توانيد اين قالبهاي معمول را از خيلي از سايتها ايده بگيريد . براي مثال المان Navigator معمولا در قسمت چپ بالاي صفحه نمايش نشان داده مي شود و رنگ اين المان اغلب کمي متفاوت تر از رنگ بقيه صفحه است همچنين المان Navigation مي تواند در پائين يک صفحه نيز قرار گيرد .
متن سياه بر روي زمينه سفيد و نيز قرار گرفتن تبليغات کمپاني در بالاترين گوشه سمت چپ صفحه نمايش نيز از قالبهاي متداول مي باشد که اغلب بکار برده مي شود .
اين قالبها و نيز قالبهاي ديگربراي تشخيص اينکه از کدام قالب بايد استفاده شود در عمل مي تواند کمک کند.
کاربران هنگامي که سايت شما را بازديد مي کنند مي دانند که چه توقعي از آن دارند . در اينجا نمي خواهم بگويم که کاربران بايد مندرجات و محصولات سايت شما را بدانند . ولي بايد اساس و اصول استفاده از سايت شما را بداند و اين اصل شامل کاربردهاي مختلف Navigation و متون و عکسها مي باشد . طرح سايت شما مي تواند با جايگزين شدن Navigation در قسمتهاي مختلف رده بندي شود ونيز نوع قالبندي به طور زيادي وابسته به محتويات و مندرجاتي است که داخل سايت شما قرار مي گيرد .
سرعت و سايز صفحات(اسکرول کردن)
کاربران خواهان سرعت زياد هستند . شما اين خواسته آنها رامي توانيد با طراحي صفحاتي با سايزهاي محدود فايلها مي توانيد تامين کنيد . با 10 ثانيه مکث در سايت، کاربران از سايت شما بريده خواهد شد و توجه آنها به سايت را از دست خواهيد و اين نکته بدان معني است که طراح وب بايد از عکسهاي مقرون به صرفه استفاده کند و انتخاب فايل ها بايدبا دقت زيادي همراه باشد . بهينه سازي عکسها عامل مهمي در بارگذاري سريعتر آنهااست که بعدا به جزئيات آن مي پردازيم .
جدول زير ماکسيمم سايز صفحه اي که براي واکنش درخواست ارتباطات با سرعتهاي گوناگون مجاز است .
زمان واکنش 1 ثانیه زمان واکنش 10 ثانیه
modem 2Kb 34Kb
ISDN 8Kb 150Kb
Tl 100Kb 2mb
سايز صفحه به معناي سايز تمام فايلها و المانهاي بکار برده شده در صفحه شامل فايلهاي HTML و تمامي عناصر تعبيه شده ( jpg , gif ) مي باشد .
توجه داشته باشيد که 1 ثانيه عکس العمل به کاربران اين اجازه را مي دهد که آنها حس کنند که به طور آزاد و راحت در ميان اطلاعات جابه جا مي شوند ولي زمان 10 ثانيه نيازدارد که به توجه کاربر به سايت پرداخته شود . در اواسط سال 1997 مطالعات نشان مي داد که متوسط سايز يک صفحه وب 44 کيلو بايت است يعني طبق جدول 5 برابر بيشتر از زمان معمول واکنش براي کاربراني که از ISDN استفاده مي کنند . بنابراين براي بيشتر کاربراني که از پهناي باند متوسط استفاده مي کنند سرعت بارگذاري بسيار کم خواهد بود . همچنين توجه داشته باشيد که 44 kb ، 30 درصد بيشتر از بزرگترين حد سايز براي کاربران استفاده کننده از مودم خواهد بود .
دانستن چنين مطالعاتي شما را به سمت توسعه وب متمايل مي کند تا جايي که کامپيوترها و ارتباطات آنها با يکديگر سريع تر شود . خيلي از وب سايتهايي که منتشر شده صفحات کوچکي هستند که از عکسهاي کم مصرف در آن استفاده شده است .
طراحي با دقت و توجه در کيفيت نمايش
توصيه مي شود که براي طراحي از درجه تفکيک 640*480 استفاده کنيد تا جايي که بدانيد کاربر از Resolution ديگري استفاده مي کند . با طراحي با اين Resolution اطمينان داريد که کاربران براي ديدن تمام صفحه شما از Scroll استفاده مي کنند . براي پرهيز از ايجاد اسکرول افقي صفحه را از 600 pix پهن تر نکنيد و به خاطر داشته باشيد که کاربران فقط سايت شما را مرور مي کنند و حاضر نيستند که براي ديدن تمام صفحه شما از اسکرول استفاده کنند . کيفيت استاندارد و اصلي 640*480 مي باشد که بيشتر در عمل به کار مي رود هنگامي که شما با تفکيک 640*480 طراحي مي کنيد اين عدد اثر بيشتري نسبت به درجات تفکيکهاي بالاتر دارد . شکلهاي زير يک وب سايت را در انواع Resolution ها نشان مي دهد . با وجود اينکه هنوز همه از مانيتورهاي 640*480 استفاده مي کنند اما در سالهاي اخير Resolution هاي بيشتري بوجود آمده اند و شما ممکن است که بخواهيد تکنولوژي برتر را بدون رها کردن کاربران و با سخت افزار قديمي براي آنها تامين کنيد. يک راه انجام اين عمل طراحي است که بتواند سازگاري خوبي با کاربران داشته باشد . در صورت استفاده از Resolution زياد کاربران تصميم به بزرگتر کردن پنجره مي کنند .
سايتهاي http://www.altavista.com (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.altavista.com) و http://www.amazon.com (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.amazon.com) و http://www.cnet.com (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.cnet.com) مثالهاي خوبي در این زمینه هستند .
رنگ
المانهاي رنگي نقش مهمي را در اصول و نظام ارائه يک سايت دارند . سبک و روش و فرهنگ و آداب شرکتها با ارائه رنگ در سايت و چگونگي هماهنگي و ترکيب آنها با يکديگر به تصوير کشيده مي شود .
به عنوان مثال يک وب سايت با رنگ بندي قوي مثل قرمز و صورتي و زرد و سبز ، برداشت هنري جذابي از ماهيت هاي صنعتي و فرهنگي مثل حالتي از يک نرم افزاري با تکنولوژي بالا يا يک واحد گرافيکي به بيننده ارائه مي دهد . و از نقطه نظر يک سايت با رنگهاي ملايم تري مثل سفيد و آبي روشن و يا خاکستري براي محافظه کاري و براي ارگانهاي سنتي مثل بانک و يا شرکتهاي سرمايه گذاري به کار برده مي شود .
يکي از مسائلي که در توسعه و پيشرفت طراحي سايت با آن مواجه ميشويد اين است که چگونه احساسها را در هنگام انتخاب رنگ براي وب سايت شرکت خود منتقل کنيد. کدام رنگها بيشتر مکمل هستند چند رنگ به معرض نمايش گذاشته مي شود ؟ آياشما از خطوط پايه افقي و عمودي استفاده مي کنيد ؟ آيا سايت شماداراي اشکال هندسي مثل چند ضلعي و مربع مي باشد ؟ اين سئوال و نيز بقيه سئوالات بايد براي بهترين مدل به تصوير کشيدن عکس در يک کمپاني براي کار بران مطرح شود .
نمايش رنگ :
يک مانيتور کامپيوتر شامل هزاران المان است که پيکسل ناميده مي شود . هر پيکسل فقط يک رنگ را در يک زمان نشان مي دهد . هنگامي که به يک عکس نگاه مي کنيد شما صدها يا هزاران پيکسل مي بينيد که هر کدام يک رنگ ويژه دارد و ترکيب آنها باعث ايجاد تصويري مي شود که شما مي بينيد . رنگهايي که وقتي با يکديگر ترکيب مي شوند رنگ سفيد را مي سازند به عنوان يک رنگ افزودني تلقي مي گردند . اصل اين رنگ شامل رنگهاي قرمز و سبز و آبي است که RGB ناميده مي شود . مانيتور کامپوتر رنگهاي افزودني را نشان مي دهد . اضافه کردن رنگهاي بيشتري به اين ترکيب در سيستم RGB باعث جابه جايي رنگ به سمت رنگ سفيد مي شود .
قالبهاي رنگ :
رنگها با دو قالب عددي استاندارد شده اند :
1- درجات قرمز و سبز و آبي (RGB)
2- هگزا دسيمال
يک طراح براي انجام يک طراحي وب دقيق بايد منحصرا از کدهاي هگزا دسيمال استفاده کند . ولي به هر جهت براي بحث در مورد اهداف خود هر دو مورد را در نظر مي گيريم .
سيستم RGB و هگزا دسيمال يا هر دو ( با هر رنگي که در محدوده ديد و بينايي قرار دارند و با خواص گوناگون با يکديگر ترکيب مي شوند معرفي مي شوند) . قالبهاي اين رنگها توانايي نمايش 16772216 رنگ را دارد .
RGB :
مقدار RGB در مبناي 10 در رنج عددي 0 تا 255 مي باشد . در سيستم مبناي 10 از ارقام بين 0 تا 9 استفاده مي شود . وقتي رقم 1 در دسترس قرار مي گيرد مقدار از 0 به 1 افزايش مي يابد و همينطور بالا مي رود . با استفاده از قانون RGB رنگ سفيد به شرح زير تعيين مي شود :
R = 255 , G = 255 , B= 255
بنابراين مقدار RGB براي رنگ سفيد B=255 ، G=255 ، R=255 که (نمايش ماکسيمم درجه قرمز و سبز و آبي است ) مي باشد .
مقدار درجه RGB براي رنگ سبز به اينگونه است :
R = 0 , G = 255 , B= 0
بنابراين مقدار RGB براي رنگ سبز 0 و 255 مي باشد که نمايش 0% براي قرمز و آبي و بيشترين درصد براي رنگ سبز است .
شما مي توانيد رنگ سبز را با کدهاي HTML به قرار زير دنبال کنيد :
< Body bgcolor=" 0,255,0 " > المانهاي رنگي نقش مهمي را در اصول و نظام ارائه يک سايت دارند . سبک و روش و فرهنگ و آداب شرکتها با ارائه رنگ در سايت و چگونگي هماهنگي و ترکيب آنها با يکديگر به تصوير کشيده مي شود .
به عنوان مثال يک وب سايت با رنگ بندي قوي مثل قرمز و صورتي و زرد و سبز ، برداشت هنري جذابي از ماهيت هاي صنعتي و فرهنگي مثل حالتي از يک نرم افزاري با تکنولوژي بالا يا يک واحد گرافيکي به بيننده ارائه مي دهد . و از نقطه نظر يک سايت با رنگهاي ملايم تري مثل سفيد و آبي روشن و يا خاکستري براي محافظه کاري و براي ارگانهاي سنتي مثل بانک و يا شرکتهاي سرمايه گذاري به کار برده مي شود .
يکي از مسائلي که در توسعه و پيشرفت طراحي سايت با آن مواجه ميشويد اين است که چگونه احساسها را در هنگام انتخاب رنگ براي وب سايت شرکت خود منتقل کنيد. کدام رنگها بيشتر مکمل هستند چند رنگ به معرض نمايش گذاشته مي شود ؟ آياشما از خطوط پايه افقي و عمودي استفاده مي کنيد ؟ آيا سايت شماداراي اشکال هندسي مثل چند ضلعي و مربع مي باشد ؟ اين سئوال و نيز بقيه سئوالات بايد براي بهترين مدل به تصوير کشيدن عکس در يک کمپاني براي کار بران مطرح شود .
*تذکر فني :
براي کامل کردن سيستم رنگهاي RGB و درجات هگزا دسيمال ميتوانيد سايت http://www.lynda.com/hexb.html (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.lynda.com%2Fhexb.html) مراجعه کنيداين سايت توسط Lynda Weinman از مرکز هنري Ojai Digital ايجاد شده است .
ارقام هگزا دسيمال :
درجات ارقام هگزا دسيمال دربازه بين 00 تا FF بصورت زير است :
(1,2,3,4,5,6,7,8,9,A,B,C,D,E,F)
عدد در مبناي 10 با همان مقدار به مبناي 16 تبديل شده و نمايش داده مي شود . مقدار 00 هيچ درصدي را نمايش نمي دهد و مقدار FF بيشترين درصد مقدار رنگ را نمايش مي دهد .
رنگ سفيد در مبناي 16 به اين صورت نشان داده مي شود :
Red= FF , Green = FF , Blue= FF
اين مقادير بيشترين درصد رنگهاي قرمز و سبز و آبي را نشان مي دهد .
نمايش سبز در مبناي هگزا دسيمال به قرار زير است :
Red = 00 , Green = FF , Blue = 00
اين مقادير بيشترين درصد رنگ براي رنگ سبز و هيچ درصدي را براي رنگهاي آبي و قرمز نشان نمي دهد . براي هر رنگ سبز و آبي و ... در مبناي 16 ، 2 کاراکتر اختصاص داده شده است و با توجه به اين مي باشد که اساس RGB از ارقامي مابين 0 تا 255 براي هر مقدار آبي و قرمز و سبز استفاده مي کند. نمودار فوق را ملاحظه کنيد :
Hex Code RGB Color
FF0000 255,0,0 Red
00FF00 0,255,0 Green
0000FF 0,0,255 Blue
FFFFFF 255,255,0 White
000000 0,0,0 Black
وقتي از مبناي 16 در HTML استفاده مي شود در ابتداي آن از علامت # استفاده مي شود که لازم نيست اما قسمتي از ويژگيهاي رسمي HTML محسوب مي شود . در تگ Body براي مثال کد رنگ پيش زمينه آن اگر سبز باشد ، خواهيم داشت :
< body bgcolor="#00FF00" > :
< body bgcolor="#00FF00" >
هشدار :
Netscape 4 در قرار دادن " " در اطراف ويژگيها اشکال مي گيرد .هنگامي که از مقدار مبناي 16 در قسمت Style ها استفاده مي کنيد " " را برداريد .
ترکيبات اصلي رنگها
هر مانيتور براي نمايش يک رنگ از 3 تفنگ الکترونيکي استفاده مي کند . هر تفنگ مسئول يک رنگ منفرد است ( قرمز ، سبز ، آبي ) ترکيبات گوناگوني از تفنگ ها و جريان زيادي از الکترونها يک رنگ را ايجاد مي کنند . در يک لحظه شخصي با شليک اين تفنگ ها رنگ سفيد بر روي صفحه توليد مي کند . شليک تفنگهاي قرمز و سبز رنگ سبز ايجاد مي کند . شليک تفنگهاي سبز و آبي رنگ فيروزه اي ايجاد مي کند . ترکيب رنگهاي قرمز و آبي رنگ سرخابي ايجاد مي کند .
نمودار زير مثالهايي از ترکيبات اين رنگها و ارتباط ميان آنها است:
http://pnu-club.com/imported/mising.jpg
تناقضات زيادي در نمايش رنگ توسط مانيتور وجود دارد . اين تناقضات شامل نوع مانيتور و طراحي کارتهاي گرافيکي ، تنظيمات کامپيوتر و حتي محدوديت روشنايي مي باشد .
مرورگر تضمين کننده رنگها :
با وجود آنکه هر مقدار از RGB و هگزا دسيمال براي يک رنگ خاص استفاده مي شود ولي مهم است که به خاطر داشته باشيد که فقط 216 رنگ با ويندوز و مکينتاش و Netscape navigator و Internet Explorer حمايت مي شوند . هر 8 بيت مانيتور هر مرورگر 256 رنگ را مي تواند به نمايش بگذارد که تا حدود 40 مورد ازاين رنگها توسط سيستم عامل استفاده مي شود . اين 216 مقدار حمايت مي شوند و بقيه رنگها شدت نورشان افزايش مي يابد .
افزايش شدت نور فرآيندي است که مرورگر يک رنگ را به نزديکترين رنگي که مرورگر قادر به حمايت از آن است تبديل مي کند . وقتي رنگي با کدهاي HTML ايجاد شود به رنگ ثابت و يکپارچه تبديل مي شود .
(اميدوار باشيد که به رنگ اصلي که شما مي خواستيد نزديک باشد ) اگر مرورگر نور رنگي که در يک تصوير نشان داده مي شود رابا ترکيب 2 رنگي که نزديک به يکي از آنهاست زياد کندتوسط مرورگر حمايت نخواهد شد و بصورت لکه نشان داده مي شود .
جدول 3-2 سيستمي از مقادير RGB و هگزا دسيمال را که بدون مشکل در مرورگرهاي متعدد و بر روي سيستم هاي متعدد ترجمه خواهد شد را نشان مي دهد . ( اگر مقادير ديگري به غير از اينها استفاده شود مرورگر نور آن را به نزديکترين مقدار تخميني افزايش مي دهد .
RGB HEX
0 00
51 33
102 66
153 99
204 CC
255 FF
هر کدام از اين مقادير مطابق با مقدار واقعي است . براي مثال استفاده از مقدار 51 در سيستم RGB درست مانند استفاده از مقدار 33 در سيستم هگزا دسيمال است . به عبارت ديگر مقدار RGB (201 ، 153 ، 51( معادل با مقادير #3399cc در هگزا دسيمال است.
مرورگر ضامن هر ترکيبي از اين مقادير است و بدون تناقض و مشکل در پايگاه داده ها مرورگر ترجمه مي شوند .
ترکيبات هر کدام از رنگهاي قرمز و سبز و آبي شدت رنگي که بايد نمايش داده شود را محاسبه مي کند . جدول 4-2 در صد شدت رنگهايي که توسط مرورگر از کمتر به بيشتر حمايت مي شوند را نشان مي دهد .
Browser – Safe Color Intensities
RGB Intensity in percentage Hex
0 0% 00
51 20% 33
102 40% 66
153 60% 99
204 80% cc
255 100% ff
ليست کامل بالا را مي توانيد در سايت http://www.lynda.com/hexh.html (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.lynda.com%2Fhexh.html) پيدا کنيد .
تذکر
مشکلاتي در ترجمه رنگ براي مانيتورهاي 16 bit وجود دارد . به دلايل رياضي 216 رنگي که در مرورگرها حمايت مي شود در جدول رنگ اين کامپيوترها نشان داده مي شود و مرورگرها با استفاده از رنگهاي ديگري که به آن رنگها نزديک است اين جابجايي را براي نمايش رنگ و به طور دقيق انجام مي دهند . اما مرورگرها جابجايي رنگ را به طرق مختلف ( منوط به اينکه آياآن رنگ در يک عکس ارائه مي شود يا توسط HTML ايجاد مي شود ) انجام مي دهند . براي بحث در مورد جزئيات بيشتر به آدرس زير مراجعه کنيد :
http://hotwired.lycos.com/webminkey/00/37/index.html (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fhotwired.lycos.com%2Fwebmin key%2F00%2F37%2Findex.html)
تمرين ) کدام ترکيب RGB توسط مرورگر هدايت مي شود .
A)003399
B)1B6565
C)66FF33
D) FF6600
به دنبال اين جمله بايد گفت که در حدود 80% از مردم فقط در مندرجات سايت پويش مي کنند و به دنبال نکات و عبارات کليدي مي گردند . به طور متوسط 25 % کاربراي در خواندن روي مانيتور نسبت به خواندن از روي چاپ آهسته تر عمل مي کنند . بنابراين ،اين واقعيت چگونه بر ساختار صفحه شما اثر مي گذارد ؟ به عنوان يک طرح شما بايد صفحه اي ايجاد کنيد که کاربران بتوانند سريع آن را کاوش کرده و اطلاعات مطالبه کرده را پيدا کنند .
بخاطر آوريد که يکي از تناقضات در طراحي وب اين است که تصور کنيد که وب فرم ديگري از رسانه چاپ است . هنگامي که طرح يک صفحه با مندرجات مشابه به يک مجله و يا بروشور ايجاد مي کنيد کاربران به طور مسلم به سايت ديگري خواهد رفت چراکه شما در نظر نگرفتيد که ماهيت مطالب بر روي وب بايد با ديگر رسانه ها به خصوص چاپ متفاوت باشد.هنگامي که کاربران به سايت شما مي رسند اولين حسي که درآنها ايجاد مي شود از اهميت زيادي برخوردار است.
مثلا ممکن است سايت وب شما که به قصد تجارت ايجاد شده است فقط يک پنجره داشته باشد ولي به هر حال اگر به نظر مشتري غير جذاب باشد شما مشتري خود را به رقيب خود واگذار کرديد. بنابراين اگر بدانيد که بازديد کنندگان فقط سايت شما را مرور مي کنند متوجه خواهيد شد که چرا نبايد کاربران را مجبور به خواندن مطالبي کنيد که براي آنها جالب نيست . کاربران را راضي نگه داريد و آنچه را که مي خواهند به آنها عطا کنيد، حتما آنها به سايت شما باز خواهند گشت .
(قابل ذکر است قواعد بازار يابي در سايتهاي تجاري متفاوت تر از دنياي واقعي مي باشد)
کاربران نمي خواهند که صفحات در هم و نا مربوط را ببينند و از طرفي محتويات و مندرجات سايت نيز ضروري است پس با اين وجود ساختار و انتشار آن هر دو با هم از اهميت برخوردار هستند .
معمولا کاربران سايت شما را براي اطلاعات ويژه اي که در مورد جستجو و يا خريد و ... مي خواهند بازديد مي کنند .
هر چقدر اين عمل براي آنها آسانتر باشد، کارشان را راحت و سريعتر انجام ميدهند. کاربران وب فقط علاقه مند به آنچه که مي خواهند بيابند هستند . کساني که در کارهاي تجارت خرده و جزئي هستند اعتقاد بر اين دارند که مشتري ها خود خواه هستند ، ولي آنها مي دانند که پرداخت صورتحساب است که درهاي تجارت را باز نگه مي دارد و اگر شما اين نکته را درک کنيد صفحه اي بوجود خواهيد آورد که ساختار آن اهداف تجاري کاربران را تامين کند .
سايتي نظير سايت http://www.cnn.com (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.cnn.com) را در نظر بگيريد . به محض ورود به سايت سريعا مي توانيد مرور کلي از کل سايت داشته باشيد و يا به عبارت ديگر شما مي توانيد کل سايت را با نگاه از يک عبارت به عبارت بعدي مرور کنيد و آنچه را که بخواهيد خيلي سريع بدست آوريد . بنابراين تمايل به ديدن مجدد سايت راداريد .سايت فوق از نمونه سايتهاي موفق در جهان مي باشد.
واقعيت در طراحي
يک طراح وب بايد براي فن آوري جديد و اينکه چگونه از ابزارهادر طراحي استفاده کند آماده باشد و معمولا طراحان جديدترين سخت افزارها و نرم افزارها را به کار مي گيرند . به هر جهت اين انگيزه ايجاد مي شود که شما بايد صفحات دو طرفه ديناميکي ايجاد کنيد که نرم افزارهاي جديد و قديم را حمايت کنند . اکثريت استفاده کنندگان وب به جستجوي طراحي عالي وپيشرفته نيستند ولي استثنائاتي هميشه در اين قواعد وجود دارند . به هر جهت يک راهنماي خوب در هنگام طراحي وجود دارد که به قرار زير است :
1- بيشتر کاربران از مانيتورهاي 17 Inch يا کمتر استفاده مي کنند .
2- بيشتر کاربران با تنظيم تفکيک پذيري 480*640 کار مي کنند .
3- بيشتر کاربران داراي مودم هاي با سرعت 56k هستند .
4- اغلب کاربران مرورگرهاي ورژن 4 به پايين دارند .
5- تعداد کمي از مردم زمان زيادي را براي بارگذاري فايلها صرف مي کنند.
*همواره در طراحي وب نکات کلي بالا را در نظر داشته باشيد
المانهاي طرح بندي يک صفحه
قبل از شروع به ساختن صفحه يک ديد کلي و ساختار کلي از سايت را در نظر بگيريد . شما بايد المانهاي صفحه و نيز چگونگي فعل و انفعالاتي که آنها با هم دارند را بدانيد . از نقطه نگاه بصري بايد المانهاي انتخابي را در داخل سايت ايجاد کنيد که اين المانها عبارتند از طرح ، رنگ ، نوع قلم ، تصاوير و چند رسانه اي ها و ... طرح صفحه منوط به آن است که طراح بتواند اطلاعات خود را به کاربر نشان دهد اين نوع قالب بندي بايد براي درک آسان تر اطلاعات باشد مثل اسناد و گزارشها . اين نوع ساختار به دسته بندي و ساده کردن ، ويرايش و توزيع و پخش اطلاعات کمک مي کند به عنوان يک طراح وب بايد ساختار خود را توسعه دهيد ودر اين مرحله تجربيات کاربران مي تواند براي شما بسيار مفيد واقع شود.
موارد زير را در هنگام طراحي يک صفحه در نظر بگيريد :
1- Frameset اجازه مي دهد که صفحات چند گانه شما بصورت واحد ظاهر شود .
2- Margin کنترل مي کند که مطالب چگونه و با چه فاصله اي از کادر مانيتور شروع شوند.
3- Border براي Frame ها و جداول HTML استفاده مي شود.
4- رنگ ايجاد يک احساس گيرا و کلي از ساختار سايت و باعث ازدياد توانايي خواندن ميشود .
5- Space جدا کردن المانهاي صفحه
6- Navigation براي کنترل کاربران براي حرکت در سايت
7- Rule مندرجات صفحه را به قسمتهاي جداگانه و وابسته قسمت مي کند.
8- White Space باعث کم تر کردن بي نظمي المانهاي صفحه مي گردد.
9- Table توزيع المانهاي صفحه در جاهاي مختلف صفحه و شکل دادن اطلاعات در ستونهاي مخفي
10- Lists به طراح اجازه مي دهد تا اقلام را سازماندهي کنيم.
11- Paragraph گروهي از کاراکترهاي متني در صفحه مي باشد.
12- Heading level ايجاد سايزهاي گوناگون از متن و طراحي و سازماندهي آن .
13- Image مورد استفاده در ايجاد جاذبه ابعادي ، اطلاعات ، Navigation
تعيين کنيد که سايت شما کداميک از اين عوامل را در بر دارد و شما را در روند توسعه ياري مي دهد و اگر به اين عوامل پرداخته نشود به تدريج منابع و نيرو ها و زمان خود را از دست خواهيد داد.
طرح معمول صفحه :
وب سايتها از قالبهاي اصلي و پايه براي نمايش اجزاء صفحه استفاده مي کنند . شما مي توانيد اين قالبهاي معمول را از خيلي از سايتها ايده بگيريد . براي مثال المان Navigator معمولا در قسمت چپ بالاي صفحه نمايش نشان داده مي شود و رنگ اين المان اغلب کمي متفاوت تر از رنگ بقيه صفحه است همچنين المان Navigation مي تواند در پائين يک صفحه نيز قرار گيرد .
متن سياه بر روي زمينه سفيد و نيز قرار گرفتن تبليغات کمپاني در بالاترين گوشه سمت چپ صفحه نمايش نيز از قالبهاي متداول مي باشد که اغلب بکار برده مي شود .
اين قالبها و نيز قالبهاي ديگربراي تشخيص اينکه از کدام قالب بايد استفاده شود در عمل مي تواند کمک کند.
کاربران هنگامي که سايت شما را بازديد مي کنند مي دانند که چه توقعي از آن دارند . در اينجا نمي خواهم بگويم که کاربران بايد مندرجات و محصولات سايت شما را بدانند . ولي بايد اساس و اصول استفاده از سايت شما را بداند و اين اصل شامل کاربردهاي مختلف Navigation و متون و عکسها مي باشد . طرح سايت شما مي تواند با جايگزين شدن Navigation در قسمتهاي مختلف رده بندي شود ونيز نوع قالبندي به طور زيادي وابسته به محتويات و مندرجاتي است که داخل سايت شما قرار مي گيرد .
سرعت و سايز صفحات(اسکرول کردن)
کاربران خواهان سرعت زياد هستند . شما اين خواسته آنها رامي توانيد با طراحي صفحاتي با سايزهاي محدود فايلها مي توانيد تامين کنيد . با 10 ثانيه مکث در سايت، کاربران از سايت شما بريده خواهد شد و توجه آنها به سايت را از دست خواهيد و اين نکته بدان معني است که طراح وب بايد از عکسهاي مقرون به صرفه استفاده کند و انتخاب فايل ها بايدبا دقت زيادي همراه باشد . بهينه سازي عکسها عامل مهمي در بارگذاري سريعتر آنهااست که بعدا به جزئيات آن مي پردازيم .
جدول زير ماکسيمم سايز صفحه اي که براي واکنش درخواست ارتباطات با سرعتهاي گوناگون مجاز است .
زمان واکنش 1 ثانیه زمان واکنش 10 ثانیه
modem 2Kb 34Kb
ISDN 8Kb 150Kb
Tl 100Kb 2mb
سايز صفحه به معناي سايز تمام فايلها و المانهاي بکار برده شده در صفحه شامل فايلهاي HTML و تمامي عناصر تعبيه شده ( jpg , gif ) مي باشد .
توجه داشته باشيد که 1 ثانيه عکس العمل به کاربران اين اجازه را مي دهد که آنها حس کنند که به طور آزاد و راحت در ميان اطلاعات جابه جا مي شوند ولي زمان 10 ثانيه نيازدارد که به توجه کاربر به سايت پرداخته شود . در اواسط سال 1997 مطالعات نشان مي داد که متوسط سايز يک صفحه وب 44 کيلو بايت است يعني طبق جدول 5 برابر بيشتر از زمان معمول واکنش براي کاربراني که از ISDN استفاده مي کنند . بنابراين براي بيشتر کاربراني که از پهناي باند متوسط استفاده مي کنند سرعت بارگذاري بسيار کم خواهد بود . همچنين توجه داشته باشيد که 44 kb ، 30 درصد بيشتر از بزرگترين حد سايز براي کاربران استفاده کننده از مودم خواهد بود .
دانستن چنين مطالعاتي شما را به سمت توسعه وب متمايل مي کند تا جايي که کامپيوترها و ارتباطات آنها با يکديگر سريع تر شود . خيلي از وب سايتهايي که منتشر شده صفحات کوچکي هستند که از عکسهاي کم مصرف در آن استفاده شده است .
طراحي با دقت و توجه در کيفيت نمايش
توصيه مي شود که براي طراحي از درجه تفکيک 640*480 استفاده کنيد تا جايي که بدانيد کاربر از Resolution ديگري استفاده مي کند . با طراحي با اين Resolution اطمينان داريد که کاربران براي ديدن تمام صفحه شما از Scroll استفاده مي کنند . براي پرهيز از ايجاد اسکرول افقي صفحه را از 600 pix پهن تر نکنيد و به خاطر داشته باشيد که کاربران فقط سايت شما را مرور مي کنند و حاضر نيستند که براي ديدن تمام صفحه شما از اسکرول استفاده کنند . کيفيت استاندارد و اصلي 640*480 مي باشد که بيشتر در عمل به کار مي رود هنگامي که شما با تفکيک 640*480 طراحي مي کنيد اين عدد اثر بيشتري نسبت به درجات تفکيکهاي بالاتر دارد . شکلهاي زير يک وب سايت را در انواع Resolution ها نشان مي دهد . با وجود اينکه هنوز همه از مانيتورهاي 640*480 استفاده مي کنند اما در سالهاي اخير Resolution هاي بيشتري بوجود آمده اند و شما ممکن است که بخواهيد تکنولوژي برتر را بدون رها کردن کاربران و با سخت افزار قديمي براي آنها تامين کنيد. يک راه انجام اين عمل طراحي است که بتواند سازگاري خوبي با کاربران داشته باشد . در صورت استفاده از Resolution زياد کاربران تصميم به بزرگتر کردن پنجره مي کنند .
سايتهاي http://www.altavista.com (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.altavista.com) و http://www.amazon.com (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.amazon.com) و http://www.cnet.com (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.cnet.com) مثالهاي خوبي در این زمینه هستند .
رنگ
المانهاي رنگي نقش مهمي را در اصول و نظام ارائه يک سايت دارند . سبک و روش و فرهنگ و آداب شرکتها با ارائه رنگ در سايت و چگونگي هماهنگي و ترکيب آنها با يکديگر به تصوير کشيده مي شود .
به عنوان مثال يک وب سايت با رنگ بندي قوي مثل قرمز و صورتي و زرد و سبز ، برداشت هنري جذابي از ماهيت هاي صنعتي و فرهنگي مثل حالتي از يک نرم افزاري با تکنولوژي بالا يا يک واحد گرافيکي به بيننده ارائه مي دهد . و از نقطه نظر يک سايت با رنگهاي ملايم تري مثل سفيد و آبي روشن و يا خاکستري براي محافظه کاري و براي ارگانهاي سنتي مثل بانک و يا شرکتهاي سرمايه گذاري به کار برده مي شود .
يکي از مسائلي که در توسعه و پيشرفت طراحي سايت با آن مواجه ميشويد اين است که چگونه احساسها را در هنگام انتخاب رنگ براي وب سايت شرکت خود منتقل کنيد. کدام رنگها بيشتر مکمل هستند چند رنگ به معرض نمايش گذاشته مي شود ؟ آياشما از خطوط پايه افقي و عمودي استفاده مي کنيد ؟ آيا سايت شماداراي اشکال هندسي مثل چند ضلعي و مربع مي باشد ؟ اين سئوال و نيز بقيه سئوالات بايد براي بهترين مدل به تصوير کشيدن عکس در يک کمپاني براي کار بران مطرح شود .
نمايش رنگ :
يک مانيتور کامپيوتر شامل هزاران المان است که پيکسل ناميده مي شود . هر پيکسل فقط يک رنگ را در يک زمان نشان مي دهد . هنگامي که به يک عکس نگاه مي کنيد شما صدها يا هزاران پيکسل مي بينيد که هر کدام يک رنگ ويژه دارد و ترکيب آنها باعث ايجاد تصويري مي شود که شما مي بينيد . رنگهايي که وقتي با يکديگر ترکيب مي شوند رنگ سفيد را مي سازند به عنوان يک رنگ افزودني تلقي مي گردند . اصل اين رنگ شامل رنگهاي قرمز و سبز و آبي است که RGB ناميده مي شود . مانيتور کامپوتر رنگهاي افزودني را نشان مي دهد . اضافه کردن رنگهاي بيشتري به اين ترکيب در سيستم RGB باعث جابه جايي رنگ به سمت رنگ سفيد مي شود .
قالبهاي رنگ :
رنگها با دو قالب عددي استاندارد شده اند :
1- درجات قرمز و سبز و آبي (RGB)
2- هگزا دسيمال
يک طراح براي انجام يک طراحي وب دقيق بايد منحصرا از کدهاي هگزا دسيمال استفاده کند . ولي به هر جهت براي بحث در مورد اهداف خود هر دو مورد را در نظر مي گيريم .
سيستم RGB و هگزا دسيمال يا هر دو ( با هر رنگي که در محدوده ديد و بينايي قرار دارند و با خواص گوناگون با يکديگر ترکيب مي شوند معرفي مي شوند) . قالبهاي اين رنگها توانايي نمايش 16772216 رنگ را دارد .
RGB :
مقدار RGB در مبناي 10 در رنج عددي 0 تا 255 مي باشد . در سيستم مبناي 10 از ارقام بين 0 تا 9 استفاده مي شود . وقتي رقم 1 در دسترس قرار مي گيرد مقدار از 0 به 1 افزايش مي يابد و همينطور بالا مي رود . با استفاده از قانون RGB رنگ سفيد به شرح زير تعيين مي شود :
R = 255 , G = 255 , B= 255
بنابراين مقدار RGB براي رنگ سفيد B=255 ، G=255 ، R=255 که (نمايش ماکسيمم درجه قرمز و سبز و آبي است ) مي باشد .
مقدار درجه RGB براي رنگ سبز به اينگونه است :
R = 0 , G = 255 , B= 0
بنابراين مقدار RGB براي رنگ سبز 0 و 255 مي باشد که نمايش 0% براي قرمز و آبي و بيشترين درصد براي رنگ سبز است .
شما مي توانيد رنگ سبز را با کدهاي HTML به قرار زير دنبال کنيد :
< Body bgcolor=" 0,255,0 " > المانهاي رنگي نقش مهمي را در اصول و نظام ارائه يک سايت دارند . سبک و روش و فرهنگ و آداب شرکتها با ارائه رنگ در سايت و چگونگي هماهنگي و ترکيب آنها با يکديگر به تصوير کشيده مي شود .
به عنوان مثال يک وب سايت با رنگ بندي قوي مثل قرمز و صورتي و زرد و سبز ، برداشت هنري جذابي از ماهيت هاي صنعتي و فرهنگي مثل حالتي از يک نرم افزاري با تکنولوژي بالا يا يک واحد گرافيکي به بيننده ارائه مي دهد . و از نقطه نظر يک سايت با رنگهاي ملايم تري مثل سفيد و آبي روشن و يا خاکستري براي محافظه کاري و براي ارگانهاي سنتي مثل بانک و يا شرکتهاي سرمايه گذاري به کار برده مي شود .
يکي از مسائلي که در توسعه و پيشرفت طراحي سايت با آن مواجه ميشويد اين است که چگونه احساسها را در هنگام انتخاب رنگ براي وب سايت شرکت خود منتقل کنيد. کدام رنگها بيشتر مکمل هستند چند رنگ به معرض نمايش گذاشته مي شود ؟ آياشما از خطوط پايه افقي و عمودي استفاده مي کنيد ؟ آيا سايت شماداراي اشکال هندسي مثل چند ضلعي و مربع مي باشد ؟ اين سئوال و نيز بقيه سئوالات بايد براي بهترين مدل به تصوير کشيدن عکس در يک کمپاني براي کار بران مطرح شود .
*تذکر فني :
براي کامل کردن سيستم رنگهاي RGB و درجات هگزا دسيمال ميتوانيد سايت http://www.lynda.com/hexb.html (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.lynda.com%2Fhexb.html) مراجعه کنيداين سايت توسط Lynda Weinman از مرکز هنري Ojai Digital ايجاد شده است .
ارقام هگزا دسيمال :
درجات ارقام هگزا دسيمال دربازه بين 00 تا FF بصورت زير است :
(1,2,3,4,5,6,7,8,9,A,B,C,D,E,F)
عدد در مبناي 10 با همان مقدار به مبناي 16 تبديل شده و نمايش داده مي شود . مقدار 00 هيچ درصدي را نمايش نمي دهد و مقدار FF بيشترين درصد مقدار رنگ را نمايش مي دهد .
رنگ سفيد در مبناي 16 به اين صورت نشان داده مي شود :
Red= FF , Green = FF , Blue= FF
اين مقادير بيشترين درصد رنگهاي قرمز و سبز و آبي را نشان مي دهد .
نمايش سبز در مبناي هگزا دسيمال به قرار زير است :
Red = 00 , Green = FF , Blue = 00
اين مقادير بيشترين درصد رنگ براي رنگ سبز و هيچ درصدي را براي رنگهاي آبي و قرمز نشان نمي دهد . براي هر رنگ سبز و آبي و ... در مبناي 16 ، 2 کاراکتر اختصاص داده شده است و با توجه به اين مي باشد که اساس RGB از ارقامي مابين 0 تا 255 براي هر مقدار آبي و قرمز و سبز استفاده مي کند. نمودار فوق را ملاحظه کنيد :
Hex Code RGB Color
FF0000 255,0,0 Red
00FF00 0,255,0 Green
0000FF 0,0,255 Blue
FFFFFF 255,255,0 White
000000 0,0,0 Black
وقتي از مبناي 16 در HTML استفاده مي شود در ابتداي آن از علامت # استفاده مي شود که لازم نيست اما قسمتي از ويژگيهاي رسمي HTML محسوب مي شود . در تگ Body براي مثال کد رنگ پيش زمينه آن اگر سبز باشد ، خواهيم داشت :
< body bgcolor="#00FF00" > :
< body bgcolor="#00FF00" >
هشدار :
Netscape 4 در قرار دادن " " در اطراف ويژگيها اشکال مي گيرد .هنگامي که از مقدار مبناي 16 در قسمت Style ها استفاده مي کنيد " " را برداريد .
ترکيبات اصلي رنگها
هر مانيتور براي نمايش يک رنگ از 3 تفنگ الکترونيکي استفاده مي کند . هر تفنگ مسئول يک رنگ منفرد است ( قرمز ، سبز ، آبي ) ترکيبات گوناگوني از تفنگ ها و جريان زيادي از الکترونها يک رنگ را ايجاد مي کنند . در يک لحظه شخصي با شليک اين تفنگ ها رنگ سفيد بر روي صفحه توليد مي کند . شليک تفنگهاي قرمز و سبز رنگ سبز ايجاد مي کند . شليک تفنگهاي سبز و آبي رنگ فيروزه اي ايجاد مي کند . ترکيب رنگهاي قرمز و آبي رنگ سرخابي ايجاد مي کند .
نمودار زير مثالهايي از ترکيبات اين رنگها و ارتباط ميان آنها است:
http://pnu-club.com/imported/mising.jpg
تناقضات زيادي در نمايش رنگ توسط مانيتور وجود دارد . اين تناقضات شامل نوع مانيتور و طراحي کارتهاي گرافيکي ، تنظيمات کامپيوتر و حتي محدوديت روشنايي مي باشد .
مرورگر تضمين کننده رنگها :
با وجود آنکه هر مقدار از RGB و هگزا دسيمال براي يک رنگ خاص استفاده مي شود ولي مهم است که به خاطر داشته باشيد که فقط 216 رنگ با ويندوز و مکينتاش و Netscape navigator و Internet Explorer حمايت مي شوند . هر 8 بيت مانيتور هر مرورگر 256 رنگ را مي تواند به نمايش بگذارد که تا حدود 40 مورد ازاين رنگها توسط سيستم عامل استفاده مي شود . اين 216 مقدار حمايت مي شوند و بقيه رنگها شدت نورشان افزايش مي يابد .
افزايش شدت نور فرآيندي است که مرورگر يک رنگ را به نزديکترين رنگي که مرورگر قادر به حمايت از آن است تبديل مي کند . وقتي رنگي با کدهاي HTML ايجاد شود به رنگ ثابت و يکپارچه تبديل مي شود .
(اميدوار باشيد که به رنگ اصلي که شما مي خواستيد نزديک باشد ) اگر مرورگر نور رنگي که در يک تصوير نشان داده مي شود رابا ترکيب 2 رنگي که نزديک به يکي از آنهاست زياد کندتوسط مرورگر حمايت نخواهد شد و بصورت لکه نشان داده مي شود .
جدول 3-2 سيستمي از مقادير RGB و هگزا دسيمال را که بدون مشکل در مرورگرهاي متعدد و بر روي سيستم هاي متعدد ترجمه خواهد شد را نشان مي دهد . ( اگر مقادير ديگري به غير از اينها استفاده شود مرورگر نور آن را به نزديکترين مقدار تخميني افزايش مي دهد .
RGB HEX
0 00
51 33
102 66
153 99
204 CC
255 FF
هر کدام از اين مقادير مطابق با مقدار واقعي است . براي مثال استفاده از مقدار 51 در سيستم RGB درست مانند استفاده از مقدار 33 در سيستم هگزا دسيمال است . به عبارت ديگر مقدار RGB (201 ، 153 ، 51( معادل با مقادير #3399cc در هگزا دسيمال است.
مرورگر ضامن هر ترکيبي از اين مقادير است و بدون تناقض و مشکل در پايگاه داده ها مرورگر ترجمه مي شوند .
ترکيبات هر کدام از رنگهاي قرمز و سبز و آبي شدت رنگي که بايد نمايش داده شود را محاسبه مي کند . جدول 4-2 در صد شدت رنگهايي که توسط مرورگر از کمتر به بيشتر حمايت مي شوند را نشان مي دهد .
Browser – Safe Color Intensities
RGB Intensity in percentage Hex
0 0% 00
51 20% 33
102 40% 66
153 60% 99
204 80% cc
255 100% ff
ليست کامل بالا را مي توانيد در سايت http://www.lynda.com/hexh.html (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fwww.lynda.com%2Fhexh.html) پيدا کنيد .
تذکر
مشکلاتي در ترجمه رنگ براي مانيتورهاي 16 bit وجود دارد . به دلايل رياضي 216 رنگي که در مرورگرها حمايت مي شود در جدول رنگ اين کامپيوترها نشان داده مي شود و مرورگرها با استفاده از رنگهاي ديگري که به آن رنگها نزديک است اين جابجايي را براي نمايش رنگ و به طور دقيق انجام مي دهند . اما مرورگرها جابجايي رنگ را به طرق مختلف ( منوط به اينکه آياآن رنگ در يک عکس ارائه مي شود يا توسط HTML ايجاد مي شود ) انجام مي دهند . براي بحث در مورد جزئيات بيشتر به آدرس زير مراجعه کنيد :
http://hotwired.lycos.com/webminkey/00/37/index.html (http://forum.majidonline.com/redirect-to/?redirect=http%3A%2F%2Fhotwired.lycos.com%2Fwebmin key%2F00%2F37%2Findex.html)
تمرين ) کدام ترکيب RGB توسط مرورگر هدايت مي شود .
A)003399
B)1B6565
C)66FF33
D) FF6600