مبحث كاربرد رنگ در طراحي وب بسيار گسترده است كه در اين مجال نمي گنجد . بحث هايي هم چون رنگ هاي عملي در وب ، رنگ هاي مطمئن در مرورگر ، تصحيح گاما جز اين مقوله به شمار مي رود كه تنها در اين پست به بررسي هارموني رنگ ها در طراحي وب بسنده مي كنيم .

همان طور كه مي دانيد رنگ ها بر روي وب نه تنها به منظور جالب تر كردن بيشتر سايت ها استفاده مي شود بلكه براي تحريك كردن ، سرگرم كردن و يا حتي بر انگيختن احساسات كاربر به كار مي روند . جداي از آن عوامل ديگري نيز وجود دارند كه بر قابليت استفاده از رنگ ها برروي وب تاثير مي گذارند . براي مثال ، يك برداشت نادرست از اهميت فرهنگي بعضي از رنگ ها ي خاص ممكن است تاثيري منفي در كاربر داشته باشد و يا برعكس .

وقتي از رنگ استفاده مي شود ، طراحان سعي دارند تا اشيا را در يك حالت تعادل قرار دهند . استفاده زياد از رنگ تحريك كنندگي و بي نظمي را به دنبال دارد ، در حالي كه استفاده كم از رنگ ها خسته كننده است . وقتي كه از رنگ استفاده مي كنيم ، براي به وجود آوردن هماهنگي تقلا مي كنيم . به عبارت ديگر از رنگ ها به روش خوشايندي استفاده مي كنيم . البته ، با وجودي كه به نظر مي رسد اين كار يك مسئله كاملا سليقه اي است ، تئوري رنگ مدت هاست كه نشان مي دهد چگونه تركيبات به خصوصي از رنگ ها با يكديگر خوب كار مي كنند .

چند راهنمايي اساسي در مورد استفاده خوب از رنگ ها : 1) فقط از چند رنگ متفاوت بر روي يك صفحه استفاده كنيد . 2) از مقدار زيادي از رنگ ها استفاده نكنيد. 3) رنگ هاي سرد و گرم را با يكديگر استفاده كنيد .

مي توانيم با چرخه رنگي كه در اينجا ارائه شده است با چند طرح رايج براي پيدا كردن تركيبات رنگي خوشايند مواجه شويم . آسانترين راه براي انجام اين كار انتخاب رنگ هاي نزديك به هم در چرخه است . كه با عنوان همتراز يا analogous خوانده مي شود . رنگ هايي كه بر روي چرخه به طور مستقيم به صورت متضاد قرار گرفته اند نيز با يكديگر خوب كار مي كنند و به نظر مكمل هم مي آيند . ادامه مطلب …

منظور از پيوند گرافيكي ساده در اينجا همون منو گرافيكي هست كه در اغلب وب سايت ها حتما ديديد . بعضي از اون ها قابليت Rollover رو هم دارن و خلاصه اينكه از افكت هاي ويژه ايي براي تزيين پيوندها استفاده مي كنند .

Rollover هم همون جور كه مطلع هستيد يه مكانيزم براي نشان دادن اينكه چيزي فعال است ، مي باشد و يك پيوند Rollover هم پيوندي است كه در بعضي مدها ، معمولا با يك رنگ يا تغيير شكل ، وقتي موس كاربر روي آن قرار مي گيرد فعال مي شود . فكر نكنم كسي تا به حال اين جور پيوندي نديده باشه . چون استفاده از اون ها تحت وب آن قدر رايجه كه به صورت كليشه اي در آمدند .

اين مكانيزم براي يه پيوند معمولي متني خيلي ساده است و از توضيح اون خودداري مي كنيم . در عوض در اين تمرين ، اين مكانيزم رو براي يك پيوند گرافيكي تشريح مي كنيم . اما قبل از اون بايد بگم كه پيوندهاي گرافيكي يه چندتا عيب اساسي دارن ؟ اول اينكه وقتي بهينه مي شوند ، مي توانند روي زمان دريافت تاثير بگذارند ، به خصوص وقتي كه همراه با Rollover باشند . دوم اينكه پيوندهاي متني در مقايسه با اين مدل حجم و اندازه خيلي كمتري خواهند داشت . بنابراين من توصيه مي كنم از اين پيوندها خيلي كم استفاده بشه .

اما وقتي اصرار فردي كه دارين واسش وب طراحي مي كنيد ، در طراحي اين چنين منوهايي ، بالاي سرتون باشه مجبور هستيد . اما باز هم راه حل هايي داره . من ترجيح مي دم در اين موارد به CSS متوسل بشم چون اون مي تونه تا حدودي كار رو حل كنه . هر چند با جاوا اسكريت هم اين كار عمليه . اما قابليت هاي CSS در اين مورد مخفي نيست . براي مقايسه ما هر دو صورت رو در اين تمرين پياده مي كنيم .

اول با استفاده از جاوا اسكريپت . اين كد جاوا اسكريپت نسبتا به سادگي نوشته مي شود ، و در ابتدا فقط نيازمند تصاويري جهت بارگذاري است و پشتيباني از شي JavaScript Image بايد وجود داشته باشد . كد زير اين rollover پايه را نشان مي دهد : ادامه مطلب …

در HTML قديمي و حتي CSS اصلي ، انتخاب قلم بر روي وب بسيار محدود شده است . طراحان غالبا به قرار دادن متن درون فرم تصويري متوسل مي شوند تا بتوانند يك قلم غير استاندارد را در صفحه استفاده كنند . ولي اين راه حل بهينه نيست . خوشبختانه ، فروشنده هاي عمده مرورگرها شروع به پشتيباني از قلم هاي قابل دريافت يا به اصطلاح Downloadable Font از اينترنت كرده اند .

راه حل مايكروسافت Open Type ناميده مي شود و از نگارش 4 در اينترنت اكسپلرر ساخته شده است . مرورگرهاي نت اسكيپ 4.x از فناوري قلم معمولي به صورت بومي استفاده كردند . متاسفانه مرورگرهاي اپرا ، 6.7 نت اسكيپ و موزيلا 1 قلم هاي قابل دريافت از اينترنت را در بر نمي گيرند ، بنابراين استفاده از قلم در پلت فرم هاي مختلف مي تواند دشوار باشد .

فناوري مايكروسافت تنها روش معقول براي گذاشتن قلم ها در صفحه وب است . براي اضافه كردن يك قلم ، اول بايد با استفاده از عنصر <font> يا قوانين شيوه نامه كه قلم هايي متعلق به شما را نصب مي كند يك صفحه بسازيد . وقتي صفحه تان را ساختيد ، در مورد اينكه آيا كاربر نهايي قلم نصب شده دارد يا خير نگران نباشيد ، زيرا خودش از اينترنت دريافت خواهد شد .

سپس از Microsofts Web Embedding Font Tool (WEFT) كه در اينجا در دسترس است براي تحليل كاربرد قلم بر روي صفحه استفاده كنيد . اين برنامه بايد يك فايل .eot كه شامل قلم هاي جايگزين شده مي باشد را ايجاد كند . سپس ، اطلاعات استفاده از قلم را به صفحه و به شكل قوانين CSS كه در CSS2 به طور اساسي تعريف شده اند اضافه كنيد ، همان گونه كه در زير نشان داده شده است : ادامه مطلب …

در ادامه مقاله قبل قصد داريم به بررسي ويژگي فرمت هاي ديگر تصاوير از جمله JPEG و PNG بپردازيم . فرمت JPEG :
قالب ديگر تصوير كه در وب متداول است JPEG است و پسوند فايل آن jpeg يا jpg مي باشد . JPEG مخفف Joint Photographic Experts Group است كه نام انجمني مي باشد كه اين اسم استاندارد را نوشته است . اين قالب تصوير با اتلاف ( Lossy ) است كه جهت فشرده سازي تصاوير فتوگرافيي كه ممكن است شامل هزاران يا حتي ميليون ها رنگ يا سايه ي خاكستري باشند طراحي شده است .
به دليل اينكه jpeg يك قالب تصوير با اتلاف است ، تعادلي بين كيفيت تصوير و اندازه ي فايل برقرار مي شود . با وجود اينكه قالب jpeg تصاوير رنگي با كيفيت بالاي 24 بيت را نسبت به GIF در فضاي كوچكتر ذخيره مي كنند ، ذخيره كردن ديسك هاي با ارزش در وب باعث حفظ فضاي گران بهاي ديسك و زمان بارگذاري كمتري خواهد شد . نمونه ايي از كيفيت در مقابل تعادل بين اندازه فايل در JPEG در اينجا نشان داده شده است . با كمي صرفنظر از كيفيت مي توان به حجم بالاتري از ديسك دست يافت .
ممكن است كه قالب JPEG تصاوير عكسبرداري شده را به خوبي فشرده كند ، اما اين كار براي خط كشي ها ، زمينه هايي با تصاوير رنگي ، يا متن ها مناسب نيست . در اينجا مي توانيد اندازه هاي دوفايل JPEG و GIF را باهم مقايسه كنيد . اما انتخاب بين اين دو خلي ساده است . عكس ها را با JPEG و شكل ها را با GIF نمايش دهيد .
شواهدي وجود دارد كه نشان مي دهد ، سازندگان صفحات ممكن است بخواهند يك عكس را به قالب GIF جهت استفاده از ويژگي هاي آن تغيير بدهند ، زيرا تصاوير jpeg از انيميشن يا هيچگونه شفافيتي پشتيباني نمي كنند . با وجود اين تصاوير jpeg از يك ويژگي شبيه به عمل ظهور در تصوير به صورت بافتي در GIF در قالبي به نام JPEG پي رونده يا همان Progressive JPEG پشتيباني مي كنند . اين مدل از وضوح تصوير در سطح پايين شروع به آشكار شدن مي كند تا در سطح بالا ، و همچنين از مات و كدر بودن به طرف واضح بودن مي رود . ادامه مطلب …