X بستن تبليغات
مطالب پيشنهادي
loading...

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

تاريخ : ۷ شهریور
بازديد : 689

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

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

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

تکفام، آنالوگ، مکمل، مکمل شکسته، سه تایی و در نهایت آرایش چهارتایی

آرایش رنگ تکفام

rang1 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

 

الگوی آرایش رنگ تکفام

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

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

بخوانید :   ابزار رایگان بازیابی داده‌ برای موبایل و دسکتاپ

در ادامه چند طرح از این آرایش رنگ ارائه می شود.

rang2 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

rang3 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

rang4 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

آرایش رنگ آنالوگ

rang21 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

الگوی آرایش رنگ آنالوگ

آرایش رنگ آنالوگ معمولاً از رنگ هایی ساخته شده است که در چرخ رنگ ۱۲ رنگه مانند بالا دقیقا کنار یکدیگر قرار گرفته اند. اما نقطه ضعف این آرایش هم کمبود کننتراست است.

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

در ادامه تعدادی طرح وب سایت با این آرایش رنگ ارائه می گردد:

rang24 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

rang22 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

rang23 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

آرایش رنگ مکمل

rang31 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

 

یک الگو از رنگ های مکمل

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

بخوانید :   بهترین روش رمزگذاری فلش مموری بدون نیاز به نرم افزار

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

در ادامه وب سایت هایی با ارایش رنگ مکمل می بینید.

rang35 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب rang34 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

rang32 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

rang33 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

آرایش رنگ مکمل شکسته

rang41 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

 

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

برای شروع می توانید از یک رنگ شروع کنید و سپس چرخ رنگ را به سه قسمت مساوی تقسیم کنید رنگ مورد نظر شما در یکی از این سه ناحیه قرار می گیرد و دو رنگ بعد را از دو ناحیه باقی مانده انتخاب نمایید. یا اگر بخواهیم به ساده ترین شکل بگویم می توانید از الگوی Y انگلیسی برای تعیین رنگ ها استفاده نمایید.

در ادامه نمونه هایی از ارایش رنگ مکمل سه تایی را مشاهده می فرمایید.

بخوانید :   صاحبان جدید گوشیهای قاچاق پیامک اخطار دریافت می کنند!

rang43 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

rang42 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

rang44 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

آرایش رنگ سه تایی و چهارتایی

rang51 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

 

آرایش رنگ سه تایی

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

 rang52 یک راهنمای ساده برای ترکیب رنگ ها در طراحی صفحات وب

الگوی رنگ چهارتایی

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

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

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

 

منبع: yadbegir.com

(کل ۲۴۴ , ۱ آمار امروز)
loading…


آخرين هاي اين بخش
ديگران چه مي خوانند
دیدگاه ها
برای ارسال دیدگاه مرتبط با این مطلب کلیک کنید
گـهـر در شبکه هاي اجتماعي