انتخاب رنگ برای طراحی سایت از سخت ترین وظایف طراح وبسایت محسوب میشه. در طراحی وبسایت معمولا از رنگهای لوگو استفاده میشه اما در صورت خواست مشتری این مسئولیت رو طراح به عهده میگیره.
نحوه انتخاب رنگ برای طراحی سایت
یکی از بهترین ابزارها برای ترکیب بندی رنگها در طراحی، سایت color.adobe هست که زیرمجموعه شرکت ادوبی (سازنده نرمافزارهایی مثل Photoshop و Adobe Reader) هست. برای انتخاب رنگ مثل شکل زیر آدرس color.adobe.com را در نوار آدرس مرورگرتون تایپ کنید.
منوی Create
زیرمنوی COLOR WHEEL
اولین صفحهای که با آن مواجه میشید صفحه color wheel از منوی create هست. برای ساخت یک ترکیب رنگ اهرم وسط که یک فلش سفید رنگ روی آن قرار داره رو حرکت بدید. با این کار رنگهای دیگه مطابق رنگ انتخابی شما تغییر میکنه و تُن رنگی بر اساس رنگ پایه انتخابی شما نمایش داده میشه.
بخش change color harmony
از سمت چپ صفحه، از طریق منوی کشویی change color harmony میتونید حالتهای مختلف هارمونی رنگ را برای انتخاب تم رنگی سایت انتخاب کنید.
هارمونی رنگ و انواع آن
هارمونی رنگ یا color harmony چیست؟
هارمونی به معنای هماهنگی و تناسب هست. دانش هارمونی ساخته فکر بشر نیست و اصل اون از طبیعت گرفته شده. بشر این دانش رو از طبیعت گرفته و به مرور اون رو تکمیل و تدوین کرده، تا تبدیل علمی جداگانه شده. تمرکز هارمونی رنگ بر اساس روابط رنگها و تناسب اونهاست. در ساخت هر نوع هارمونی از سه شاخص فام یا هیو (Hue)، روشنی یا ولیو (Value) و خلوص یا کروما (Chroma) استفاده میشه.
هارمونی رنگها در سایت color.adobe
رنگبندی بر اساس همجواری؛ آنالوگ یا (Analogous)
با ترکیب رنگهایی ایجاد میشه که در چرخه رنگ کنار یکدیگر قرار گرفتند. این نوع هارمونی از ترکیب سه رنگ کنار هم در دایره رنگ ایجاد میشه. در این نوع هارمونی معمولا یک رنگ از نظر مقدار استفاده از دور رنگ دیگه بیشتره.
رنگبندی مونوکروم یا Monochromatic
در هارمونی مونوکروم از درجههای خلوص و شدت مختلف یک گروه از رنگ استفاده میشه. این درجات شامل: روشن (tints)، شدت (tones) و سایه (shades) هستند. با اضافه کردن رنگ سفید به یک رنگ، اون رنگ روشن یا تینت میشه و با اضافه کردن سیاه، رنگ تیرهتر یا سایه ایجاد میشه؛ و در نهایت ترکیب خاکستری با رنگ، نتیجه شدت یا تُن رو تغییر میده.
رنگبندی متساویالاضلاع یا Triad
در هارمونی متساویالاضلاع یا سهتایی، رنگها از سه رنگ با فاصلهی برابر از همدیگر انتخاب میشن. ترکیب این سه رنگ به شکل یک مثلث متساویالاضلاع دیده میشن.
رنگبندی مکمل یا Complementary
رنگهای مکمل در چرخه رنگ در مقابل یکدیگر قرار دارند.
رنگبندی متساویالساقین (compound یا Split Complementary)
این هارمونی از ترکیب یک رنگ با دو رنگ همجوار مکمل رنگ اصلی ایجاد میشه. مثل شکل زیر، رنگهای همسایه رنگ سبز که مکمل رنگ قرمز هست مورد استفاده قرار گرفته. این هارمونی به همین دلیل از سه جزء تشکیل میشه.
رنگبندی مستطیل یا Double complement
این هارمونی از دو رنگ همجوار به همراه رنگهای مکملشان انتخاب میشه. به این نوع هارمونی «دو مکمل یا مکمل برابر» هم گفته میشه. اگر به شکل دقت کنید، موقعیت رنگها به شکل حرف «X» دیده میشه.
هارمونی رنگ Shades
در این هارمونی یک رنگ از چرخه انتخاب میشه و با روشنایی و تاریکی از ۰ تا ۲۵۵ ترکیب shades رو میسازه. این هارمونی برای ترکیب از دو رنگ سیاه و سفید استفاده میکنه.
سایر هارمونی رنگها
رنگبندی چهارضلعی یا Tetrad
این هارمونی از یک رنگ و یک رنگ مکمل همراه با دو رنگ همجوار رنگ مکمل تشکیل میشود. در شکل زیر ترکیب رنگها مانند رنگهای انتخاب شده یک چهارضلعی است.
رنگبندی دوتایی یا Diad
هارمونی دوتایی از ترکیب دو رنگ با حذف رنگ وسط به دست میاد.
هارمونی رنگ اساس طبیعت:
طبیعت، بهترین نقطه شروع برای درک هارمونی رنگهاست. تصویر زیر نشون میده که زرد، سبز و قرمز چه نقش هماهنگی ایجاد کردن و این ترکیب متناسب، لزوما در هارمونیهای قبلی نمی گنجه، اما زیبا و قابل اجرا هست.
زیرمنوی IMPORT IMAGE
در این بخش میتونید با ایمپورت کردن تصویر لوگو یا هر تصویر دیگری تم رنگ اون تصویر را به دست بیارید. برای استخراج رنگهای یک تصویر روی گزینه import image کلیک کرده و تصویر مورد نظر خود را انتخاب کنید.
با باز شدن تصویر تم رنگی اون توسط سایت شناسایی و نمایش داده میشه، که میتونید با ساخت اکانت اون رو با کلیک روی دکمه save color theme در تمهای خودتون ذخیره کنید.
منوی explore
در این بخش برترین ترکیبهای رنگ به ترتیب نمایش داده میشن که با بردن ماوس روی هر کدوم میتونید اونها رو ویرایش، دانلود، رتبهدهی یا در تمهای خودتون ذخیره کنید.
همچنین از طریق گزینه info میتونید کامنت بگذارید یا اطلاعاتی مثل نام سازنده، تاریخ ساخت، تعداد نمایش و غیره درباره این تم کسب کنید. یکی از آپشنهای خوب سایت color.adobe اینه که میتونید هر کدوم از این رنگها رو در نرم افزار فتوشاپ بارگذاری کنید و از اونها برای طرح خود استفاده کنید.
افزودن بخش color adobe theme در فتوشاپ
برای اضافه کردن تمام امکانات بالا در فتوشاپ باید حتما اکانت adobe داشته باشید و در اکانت خودتون لاگین کرده باشید. برای ساخت اکانت کافیه روی لینک Sign In کلیک کنید.
از صفحه باز شده روی لینک Get an Adobe ID کلیک کنید.
با کلیک روی لینک در صفحه باز شده فرم زیر نمایش داده میشه که با پر کردن فیلدهای نام، نام خانوادگی، آدرس ایمیل، پسورد کاربری (پسورد باید دارای حداقل ۸ کاراکتر، یک عدد یا سیمبل و هردو حروف بزرگ و کوچک لاتین باشه)، نام کشور (متاسفانه کشور ایران به دلیل تحریمها در لیست وجود نداره)، تاریخ تولدتان به میلادی و کلیک روی دکمه Sign Up اکانت کاربری شما ساخته میشه.
نکته) برای تایید نهایی و استفاده از سایت باید روی لینک تاییدی که به ایمیل شما ارسال میشه کلیک کنید تا اون لینک باز بشه.
پس از ساخت یا ورود به حساب کاربری، نرمافزار فتوشاپ رو باز کنید. از منوی Window، زیر منوی Extensions، گزینه Adobe Color Theme رو انتخاب کنید تا این بخش به فضای کاریتون اضافه بشه.
برای نمایش رنگها باید سایت را در مرورگرتون باز کرده و با اکانت خود لاگین کرده باشید. پس از طی مراحل بالا این بخش به صورت زیر نمایش داده میشه.