پنل کاربری
021 4421 4598
info@portalsaz.com
صفحه 1 از 1 < 1 >

Feed
1390/08/20 00:00

آموزش HTML بخش هفتم

رنگها

رنگها در صفحات وب از اهمیت فوق العاده ای برخوردارند.رنگها میتوانند تاثیر بسیار زیادی در زیبایی و یا عدم زیباییی وب سایت شما داشته باشند.

امروزه شاخه ای در طراحی وب با نام روانشناسی وب ایجاد شده است که یکی از مهمترین مسائل در طراحی وب میباشد.یکی از مسائل مهمی که در این شاخه بررسی می گردد رنگ های مورد استفاده در یک صفحه وب با توجه به موضوع آن وب سایت  و همچنین نوع بازدیدکنندگان آن وب سایت است.

رنگها به چندین شکل در یک صفحه وب وجود دارند.رنگهای تصاویرپیکسلی و رنگهایی که به وسیله کدهای HTML   ایجاد شده اند . در هر دو صورت این رنگها دارای استاندارد خاصی هستند و این استاندارد به دلیل متفاوت بودن صفحات نمایش یا مانیتورها و همچنین browser  ها ایجاد شده است.این استاندارد باعث نمایش یکسان تصاویر و صفحات وب در کلیه مانیتورها و browser ها میشود.

با توجه به گستردگی دنیای وب در سراسر جهان رعایت استانداردهای طراحی وب امری لازم و ضروریست و عدم رعایت آن می تواند باعث عدم بازخورد وب سایت شما باشد.

این مسئله بسیار مهم است که صفحه وب شما در تمامی مانیتورها و browser  ها به صورت دلخواه شما و با یک شکل  واحد نمایش داده شود و این موضوع زمانی اتفاق می افتد که شما استانداردها را در وب سایت خود رعایت کرده باشید.

حال به رنگها می پردازیم.

تقسیم بندی رنگها به چندین روش ( با توجه به کاربرد ) انجام میگیرد که دو نوع آشنای آن تقسیم بندی های CMYK  و RGB  هستند.

از تقسیم بندی CMYK  که مخفف رنگهای(  ( cyan, magenta, yellow, and key (black )  هستند در طراحی هایی که برای چاپ اماده می شوند استفاده می شود.

و از تقسیم بندی RGB   که مخفف رنگهای( red,green,blue ) هستند برای طرحهایی استفاده میشود که در صفحات نمایش استفاده میشوند.(مانند تلویزیون و مانیتور)

با توجه به توضیحات بالا در دنیای وب از تقسیم بندی RGB استفاده میشود.

رنگها در این سیستم دارای کدهای منحصر به فردی هستند که استفاده از رنگها را در طراحی صفحات وب بسیار هدفمند تر و دقیقتر می کند.نحوه کدگذاری این رنگها بر پایه هگزادسیمال است (HEX) .در این تقسیم بندی هر رنگ با یک کد ۶ رقمی که در ابتدای آن # وجود دارد مشخص می شود. به طور مثال رنگ مشکی با کد #۰۰۰۰۰۰ و رنگ سفید با کد #FFFFFF مشخص میشوند.بر پایه این تقسیم بندی ۱۶ میلیون رنگ مختلف وجود دارد!

آیا میتوان از این تعداد رنگ در طراحی وب استفاده کرد؟

پاسخ به این سوال مشکل است.در این تقسیم زیر شاخه ای نیز وجود دارد به نام رنگهای  (Web Safe Color) که متشکل از تعداد معدودی رنگ است.این رنگها بر طبق استانداردهای W3C  در سالها پیش  مشخص شده اند و طراحان وب بر طبق این استاندارد تنها اجازه استفاده از این رنگها را در طراحی صفحات وب خود داشتند.هر چند که این زیر شاخه در حال حاضر نیز در بسیاری از نرم افزارهای طراحی وب و گرافیک موجود هستند ولی این زیر شاخه در زمانی به وجود آمده بود که مانیتورها تنها از ۲۵۶ رنگ برای نمایش تصاویر استفاده می کردند ، حال با توجه به پیشرفت فوق العاده دنیای کامپیوتر مانیتورها از چندین میلیون رنگ برای نمایش تصاویر خوب استفاده میکنند ، بنابراین دست طراحان در استفاده از تمامی ۱۶ میلیون رنگ باز است.

با این توضیحات ذکر این نکته بسیار ضروریست که استفاده از این کدها برای همسان سازی تصاویر با کدهای HTML  و صفحات وب و همچنین کدهای CSS   ، بسیار سودمند و ضروریست.

لیست ها

لیستها در حال حاضر کاربرد بسیار گسترده ای در طراحی صفحات وب پیدا کردهاند. در تکنبکهای جدید طراحی صفحات وب از جمله JQuery   و CSS  لیستها نقش بسیار مهمی دارند.(مخصوصا در ساخت منوها)

لیستها با استفاده از تگ <ul>  در صفحات HTML  وارد می شوند و دارای چندین نوع هستند. لیستها گاهی با عددها شماره گذاری میشوند و گاهی با اشکالی مانند دایره و مربع و…. ( و گاهی بدون نشانه ).

از لیستها در مواقعی استفاده میشود که بخواهیم یکسری موضوعات و یا اجزائ مرتبط و یک شکل را به صورت مرتب و دسته بندی شده نمایش بدهیم.

به طور مثال :

<ul>
<li>google.com</li>
<li>microsoft.com</li>
</ul>

و یا

<ol>
<li>google.com</li>
<li>microsoft.com</li>
</ol>

  1. google.com
  2. microsoft.com

نحوه نمایش این لیستها در زیر کدهای انها مشخص شده است که در مثال اول با استفاده از اشکال نمایش داده شده اند و در مثال بعدی با عددها.

در این مثالها تگ <ul>  و <ol>  نشان دهنده لیست و تگ <li>  نشان دهنده اجزاء این لیست هستند.

نوع دیگری از لیستها نیز وجود دارد که در زیر با ذکر یک مثال به آن میپردازیم.

<dl>
<dt> www.portalsaz.com </dt>
<dd>آموزش طراحی وب سایت </dd>
<dt> www.google.com </dt>
<dd>موتور جستجو</dd>
</dl>

در این مثال تگ <dl>  نشان دهنده لیست در صفحات  HTML  و تگ <dt> نشان دهنده اجزاء لیست و تگ های <dd>  نشان دهنده توضیحاتی برای اجزاء می باشد.

نظرات

نظر شما
نام :
پست الکترونیکی :
وب سایت :
متن :

تصویر :

برچسب ها :