انتخاب رنگ در طراحی وب سایت




رنگ های مختلف می توانند احساسات مختلفی را نیز پدید آورند.با دیدن بعضی از رنگ ها احساس آرامش می کنیم و دیدن برخی دیگر احساس هیجان را به ما منتقل می کند. حتی رنگ ها می توانند در شادی یا غمگین کردن ما تاثیر داشته باشند.بنابراین انتخاب رنگ در مواردی که قصد داریم بهترین تاثیر را بر مخاطب خود گذاشته یا بهترین وضعیت را از خود نمایش دهیم اهمیت زیادی پیدا می کند. یکی از این موارد انتخاب رنگ مناسب برای طراحی وب سایت است.

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

انتخاب رنگ مناسب در طراحی سایت می تواند روی کارکرد آن و بر روی شناسایی برند و نام تجاری تاثیر مستقیم داشته باشد. کافی است به وب سایت های فیسبوک (رنگ آبی ) ، کوکاکولا (رنگ قرمز) ویا وب سایت شرکت اپل (رنگ سفید و سیاه) نگاهی بیاندازید تا متوجه سرمایه گذاری این شرکت روی برندسازی و استحکام نام تجاری از طریق نحوه انتخاب و بکارگیری رنگ در طراحی سایت شوید.

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

اطلاعات پایه در مورد رنگ 

در ابتدا اجازه دهید کمی در مورد رنگ و خصوصیات آن صحبت کنیم. همه ما رنگ های اصلی (Primary) و رنگ های ثانوی (Secondary) را می شناسیم.رنگ های قرمز ، آبی و زرد رنگ های اصلی محسوب می شوند و رنگ های ثانوی نیز رنگهایی هستند که از ترکیب دو یا چند رنگ اصلی ایجاد می شوند مانند سبز ، بنفش و نارنجی و.. درجه دیگری از رنگ نیز وجود دارد (رنگ های ثالث یا Tertiary) که از ترکیب رنگ های اصلی و رنگ های ثانوی بوجود می آیند.

در زیر عکس چرخه رنگ (Color Wheel) را مشاهده می کنید. سیستم چرخه رنگ یکی از مبناهای انتخاب رنگ و ترکیب آنها با یکدیگر محسوب می شود که در بخش ترکیبات رنگی بیشتر راجع به آن توضیح داده شده است.



چرخ رنگ یا دایره رنگ



اصطلاحات رایج در مورد رنگ ها

·         واژه هیو یا Hue تقریبا مترادف و هم معنی رنگ است

·         سایه یا Shade به نسخه های تیره تر از هر Hue یا رنگ گفته می شود که بستگی به میزان رنگ سیاهی دارد که به آن Hue اضافه می شود.

·         سایه رنگ یا Tint نیز به نسخه های روشن تر هر Hue اطلاق می شود که با توجه به میزان رنگ سفید اضافه شده سنجیده می شود.

·         تُن رنگ یا Tone نیز زمانی ایجاد می شود که به یک Hue هم سفید و مشکی اضافه شود تا افکت های متفاوتی خلق شود.در مفاهیم دیجیتال به تُن ، Saturation نیز گفته می شود که به معنی ارتعاش رنگ نیز می باشد.

بصورت کلی در طراحی دو نوع طرح رنگ استفاده می شود :

·         RGB Red , Green , Blue

·         CMYK Cyan , Magenta , Yellow , Key

برای اطلاعات بیشتر به مقاله فرمت های رنگی RGB و CMYK مراجعه نمایید.

مفهوم بعدی تضاد رنگ یا Contrast است. Contrast در واقع مفهومی که به تمایز و وضوح یک عکس اشاره دارد. کُنتراست بالاتر به معنی تمایز بیشتر عنصر رنگی است ( مانند متن قرمز در پس زمینه سفید) و کُنتراست پایین تر به معنی تمایز کمتر است (مانند متن آبی روشن در پس زمینه ای به رنگ آبی تیره)

انتخاب طرح رنگ

حالا که اطلاعات پایه در مورد رنگ را بدست آوردیم به این سوال می رسیم که چه رنگ هایی را برای طراحی سایت انتخاب کنیم ؟ در اینجا عوامل مختلفی وجود دارد که لازم است قبل انتخاب رنگ سایت به آن ها توجه کنید :

در نظر بگیرید هدف و شعار اصلی نرم افزار ، وب سایت ویا برند و نام تجاری شما چیست ؟

چه چیزی قرار است در سایت خود رائه دهید و انتظار چه عکس العملی دارید و یا انتظار برانگیخته شدن چه احساساتی از طرف مخاطبان خود را دارید؟

برای مثال اگر برند یا محصول شما یک محصول مربوط به محیط زیست است، تُن های رنگ سبز و خاکی انتخاب مناسبی می تواند باشد.اگر محصول شما شکلات است ، سایه های مختلف رنگی مربوط به قهوه ای احتمالا اولین گزینه است. هر زمینه کاری که مربوط به پرشکی و سلامت باشد بهتر در طراحی آن از سایه های سفید و آبی به همراه مقدار جزئی رنگ های قرمز، نارنجی یا سبز استفاده شود.

مخاطبان هدف شما چه کسانی هستند ؟ سایه های صورتی و یاسی معمولا بهترین انتخاب رنگ برای طراحی سایت محصولات مربوط به دختران است در حالیکه رنگ های قرمز ، سیاه ، آبی و قهوه ای بیشتر باعث جذب مردان می شود.

آیا نشان تجاری (برند) یا محصول شما دارای ترکیب رنگ خاصی است ؟ اگر اینطور است گاهی بهترین گزینه این است که رنگ های سایت نیز با توجه به رنگ برند و محصول انتخاب شود مانند وب سایت کوکاکولا.

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

هارمونی رنگ

روشی که ما رنگ ها را درک می کنیم بستگی به روش استفاده آنها دارد. روش ترکیبات رنگی (color schemes) مختلفی در هارمونی رنگ ها وجود دارد :

1- Analogous

این نوع طرح رنگ از ترکیب یک رنگ اصلی به همراه دو رنگی که در کنار آن در چرخه رنگ قرار دارد ایجاد می شود.اگر می خواهید 5 طرح رنگ داشته باشید می توانید رنگ های کنارِ رنگ های کناری را انتخاب کنید. این ترکیب رنگ ها منجر به طراحی های روان تر و نرم تر به همراه کُنتراست (تضاد رنگ) کمتر می شود.



     



2- Monochromatic

در این روش یک رنگ پایه انتخاب می شود و رنگ های دیگر با استفاده از tint و Saturation مختلف همان رنگ ایجاد میگردد و ظاهری مرتب و حرفه ای به طراحی وب سایت می دهد



3- Triadic

از این نوح طرح رنگ برای ایجاد ترکیباتی با کُنتراست بالا بدون تغییر در تُن رنگ استفاده می شود.این ترکیب رنگ از طریق انتخاب رنگ هایی که در چرخه رنگ در یک خط قرار بصورت مثلثی قرار دارند استفاده می شد.



     



4- Complementary

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



     



5- Split Complementary

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



     



انتخاب بهترین ترکیب رنگ برای طراحی سایت

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

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

همچنین لازم است هارمونی رنگ ها را در تمام وب سایت رعایت کنید و در تمام وب سایت قوانین اولیه را در نظر بگیرید.برای مثال اگر یک دکمه درخواست عمل یا CTA مانند دکمه "اضافه به سبد خرید" در صفحه اول سایت خود دارید باید هارمونی رنگ مربوط به این دکمه خاص در تمام صفحه ها یکسان باشد.مثلا اگر از رنگ سبز تیره برای آن استفاده کرده اید نباید در صفحه های دیگر دکمه "اضافه به سبد خرید" شما به رنگ دیگری باشد. یا اگر از رنگ صورتی برای "پیشنهاد ویژه" در صفحه اول سایت خود استفاده کرده اید همین ترکیب رنگ برای تمام دکمه های "پیشنهاد ویژه" در صفحه های دیگر سایت رعایت کنید.

بخاطر داشته باشید که از هر روش و متدی که برای ترکیب رنگ در طراحی سایت استفاده می کنید ، در نهایت باید هدف اصلی شما تاثیر بر مخاطب باشد. شاید ترکیب رنگی از نگاه خودتان خوب به نظر نرسد اما لازم نیست حتما شما از ترکیب رنگ وب سایتتان خوشتان بیاید بلکه هدف اصلی مخاطبان و بازدیدکنندگان سایت شما هستند هرچند اگر قوائد ذکر شده در مطالب بالا را رعایت کنید مطمئنا از مسیر صحیح و علمی انتخاب رنگ سایت منحرف نخواهید شد.

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

نکات آخر در انتخاب رنگ های مناسب هنگام طراحی سایت :

1- خانم ها : صورتی ؛ آبی و سبز

اگر وب سایتی طراحی می کنید که قرار است با خانم ها سرو کار داشته باشد حتی فکر استفاده از رنگ های خاکستری و قهوه ای را از سرتان بیرون کنید. طبق تحقیقات 35% خانم ها آبی را رنگ مورد علاقه شان عنوان کرده اند ، 23% عاشق رنگ ارغوانی هستند و 14% نیز رنگ سبز را دوست دارند. جالب است بدانید 33% خانم ها از رنگ نارنجی بدشان می آید ، 33%  رنگ قهوه ای و 17% هم رنگ خاکستری را دوست ندارند.

بنابراین استفاده از رنگ های آبی ، سبز و ارغوانی انتخاب هوشمندانه ای در طراحی سایت مخصوص بانوان خواهد بود.

2- مردها نیز با زن ها نقاط مشترکی دارند زیرا آقایان نیز عاشق رنگ های آبی و سبز هستند.

اگر طراحی سایت خود را برای آقایان انجام می دهید از رنگ های قهوه ای ، ارغوانی و نارنجی تیره استقاده نکنید.مردان رنگ های آبی ، سبز و سیاه را بیشتر ترجیح می دهند.

3- هم مردان و هم زنان رنگ آبی را دوست دارند

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

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

به یاد داشته باشید در مورد وب سایت هایی که در مورد خوردنی ها است رنگ آبی را کنار گذاشته و از آن استفاده نکنید زیرا تحقیقات نشان داده رنگ آبی موجب کم شدن اشتها و  کم شدن علاقه افراد به خوراکی ها می شود.

4- چه زمانی از رنگ زرد استفاده کنیم ؟

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

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

5- درباره رنگ سبز

رنگ سبز نماد طبیعت ، آب و هوا ، محیط زیست و فعالیت های بیرون از خانه است.

6- نارنجی برای ایجاد هیجان

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

7- چرا از رنگ مشکی استفاده کنیم ؟

رنگ مشکی باعث ایجاد ارزش بیشتر و همچنین حس اغواگری می شود.رنگ مشکی می تواند لاکچری (لوکس) بودن کالا را به بینده القا کند و تقریبا تمام کالاهای لوکس معروف رنگ مشکی را به عنوان بخشی از تم رنگی خود دارند.

8- رنگ سفید را فراموش نکنیم

زمانی که تحقیقات در مورد رنگ ها را مشاهده می کنید ، جای خالی رنگ سفید کاملا محسوس است. رنگ سفید یکی از مورد علاقه ترین رنگ ها و نشان دهنده خلوص ، معنویت ، آزادی و صلح است.

مقاله استفاده از رنگ سفید در طراحی سایت را مطالعه کنید


نکاتی در مورد طراحی وب سایت فروشگاهی
نکاتی در مورد طراحی وب سایت فروشگاهی
نکاتی در مورد طراحی وب سایت فروشگاهی
موارد مهم در طراحی صفحه اول سایت
موارد مهم در طراحی صفحه اول سایت
موارد مهم در طراحی صفحه اول سایت
تفاوت UX  و UI در مباحث طراحی سایت چیست؟
تفاوت UX و UI در مباحث طراحی سایت چیست؟
تفاوت UX و UI در مباحث طراحی سایت چیست؟
تایپوگرافی در طراحی سایت
تایپوگرافی در طراحی سایت
تایپوگرافی در طراحی سایت