رنگ در دنیای وب
نوشته سودابه امیر اکبری • 03 بهمن 1389
در طراحی وب، رنگ مهمترین عامل بصری و اولین عنصر تاثیرگذار بر کاربر است. چون وجود نور باعث تشدید رنگها میشود، بنابراین انتخاب مناسب و بهجای آن میتواند به جذابیت سایت بیافزاید و گاهی انتخاب نامناسب باعث میشود کاربر تا بارگذاری کامل صفحه منتظر نماند.
انتخاب رنگ، یک موضوع کاملا سلیقهای است و اثر روانشناسی و مفهوم آن در فرهنگهای گوناگون در درجات بعدی اهمیت قرار دارند اما رعایت این مسائل باعث انتقال بهتر موضوع به کاربر میشود.
رنگ
به طور کلی رنگها دارای سه مشخصه اصلی هستند که با تغییر در آنها طیفهای گوناگون رنگ پدید میآیند. این سه مشخصه عبارتند از:
فام (Hue)
درخشندگی (Value)
اشباع (Saturation)
فام یا تهرنگ
فام در واقع همان اسم عام رنگ است که به صورت کامل و در نهایت درخشش دیده شود، مثلا فام آبی. رنگها به دو دسته کلی فامدار (قرمز، آبی، زرد و …) و بی فام (سیاه، سفید و خاکستری) تقسیم میشوند.
فامهای اولیه
این فامها در مثلث مرکز دایره رنگ قرار دارند که شامل سه رنگ اصلی آبی، زرد و قرمز میشوند و سایر رنگها از ترکیب این سه رنگ بوجود میآیند. نمونههای زیر، طرحهایی را نمایش میدهد که در آنها، از رنگهای اصلی برای ساختار سایت استفاده شده است.
فامهای ثانویه
این رنگها از ترکیب دو به دو رنگهای اولیه با هم بهدست میآیند که شامل سبز، نارنجی و بنفش میباشد.
فامهای ثالثه
از ترکیب فامهای اولیه و ثانویه با هم، فام های ثالثه بدست میآیند که شامل رنگهای حلقه بیرونی دایره رنگ میشود.
درخشندگی
درخشندگی درجه تیرگی یا روشنی هر رنگ است و طیفهای گوناگون یک فام (رنگ) از روشنترین حالت تا تیرهترین را تشکیل میدهد.
طرحهایی که در ادامه میبینید، نمونههای مناسبی از بهکار گیری طیفهای مختلف رنگی است. در این نمونهها با تغییر در تیرگی و روشنی، سعی شده تا کنتراست درخشندگی لازم در آنها ایجاد شود.
اشباع یا خلوص رنگی
از ترکیب رنگهای فام دار با رنگهای بیفام (سفید، سیاه و خاکستری) درجه خلوص رنگی تغییر میکند. در واقع اشباع، همان خالص بودن یک رنگ است در حالتی که هیچ رنگ دیگری با آن ترکیب نشده است. مانند آبی خالص.
ترکیب رنگهای خالص با خاکستری از انرژی رنگها کم میکند و از نظر بصری دورتر میشوند و هر چه خالصتر باشند نزدیکتر بهنظر میآیند. از این خاصیت میتوان برای پلانبندی کار کمک گرفت و از رنگهای پر انرژیتر برای عنوانهای مهمتر و در سطوح کم استفاده کرد.
در قسمت بعدی به بررسی رنگهای سرد و گرم و تاثیر آن در طراحی سایت و همچنین رنگهای مکمل میپردازیم. برای نوشتن این مطلب از کتاب “هنر رنگ” و ویکیپدیا نیز استفاده شده است.
آرش اصغری
سلام!
خیلی مطلب جالبی بود!بدردم خورد خیلی! ممنونم سودابه جان!
منو که شناختی؟
کلا کار وبلاگینا عالیه :دی
جواد
سلام
مرسی جالب بود
بابک
مطلب خیلی خوب و مفیدی بود. ممنون سودابه جان 🙂
وحید
برای یک طراح وب بزرگترین دغدغه انتخاب و ترکیب رنگه!
هرچقدر هم که در این مورد مقاله بخونی و تمرین کنی بازم کمه.
ممنون از این مقاله کاربردیتون
سئو
سلام
بله. روانشناسی رنگ ها خیلی مهم هست و حتی برای بعضی از رنگ ها تحقیقات گسترده ای انجام دادند تا ببینند کدوم رنگ فروش بیشتری داره!
solmaz
مرسی مطلب خوبی بود
آرش
بسیار مطلب پایه ای در اینجا مطرح شده ، منتها به نظر میرسه که contrast کاملا فراموش شده. همچنین در ابزارهای قوی مثل photoshop از دو تکنیک مختلف برای ساختن رنگ استفاده می شود . RGB و HSB . اگر در مورد این تکنیک ها هم توضیحاتی بفرمایید مطلب پربار تر خواهد بود.
طــراحـی وب ســایـت
خانم امیر اکبری مطلب زیبایی را در مورد رنگ ها بخصوص رنگ بندی در طراحی وب سایت منتشر کردید. مطمئناً در طراحی وب سایت رنگ بندی هوشمندانه تاثیر بسزایی در جذب بیننده ایفا می کنه ….
ميلاد
مطب جالبي بود ممنون مرسي
پرویز
در مورد ترکیب رنگها در وب هم مطلب بنویسید.
طــــراحـــی وب ســایــت
خانم امیر اکبری میشه معنی رنگها رو هم در مقالات بعدیتون توضیح دهید برامون
تشکر می کنم از زحماتتون
نعیمه
ممنون سودابه جان از مطلب مفیدت
سبحان جوی
درسته . ولی در کتاب ‘رنگ شناسی مدرن’ نوشته “آکدن نیکولاس رود” به جلوه های بصری خیلی توجه نشان داده شده و می خواهد تاکید کند که رنگ ها آن نیستند که به ما دارد تلقین می شود . مثلا رنگ سبز را همه تصور می کنند از ترکیب رنگ های آبی و زرد رنگ سبز پدید می آید ولی رنگ سبز در واقعیت تداعی کننده رنگ خاکستری است و رنگ ترکیبی از آبی و زرد فقط ایجاد یک رنگ مصنوعی از رنگ سبز است . یا رنگ ها دارای طول موج هستند و بیشترین طول موج را رنگ قرمز و کمترین را رنگ بنفش داراست . و از میان بقیه رنگ ها رنگ سبز برای این بیشترین توجه را به خود جلب می کند که رنگ ما بین رنگ های گرم و سرد است و طول موج آن در مقدار میانه قرمز و بنفش قرار دارد .
محمد
مطلب جالب و کاربردی بود.
منکه استفاده کردم.ممنون.
یاعلی…
م.نراقی
اگه واقعا نظر نمیدادم پای این مطلب بی انصافی بود! من همیشه از یکی از دوستانم در مورد رنگ کمک میگرفتم! ولی حالا تا حدودی به رنگ ها آشنایی پیدا کردم!
سارا
سودابه جان
خسته نباشی، واقعا لذت بردم، لطفا نام کتاب مرجع و نام نویسنده کتاب رو اعلام کن
m
tnx
میکروسیلیس
با تشکر از شما سودابه خانم جالب و بدرد بخور بود
طراحی سایت و سئو
مفید و کاربردی ممنون
بتن
واقعا ممنونم بابت اطلاعاتی که در سایت گذاشتین . برام خیلی مفید بود
میکروسیلیس
واقعا جالب بود . ممنونم
رضا
سلام، خیلی ممنون استفاده کردیم.
همینجا یک منبع غنی از گالری طیف رنگ ها بتون معرفی میکنم.
http://p5x.co/19428
طراحی سایت
سلام مطلب جالبی بود خسته نباشید
افسانه
ممنون خوب بود
مهاجرت استرالیا
سایتتون عالیه
طراحی سایت
مطلب خوبی بود خسته نباشید
طراحی وب سایت
خیلی کمک کرد
کرکره اتوماتیک
من اصلا فکر می کنم کور رنگی دارم درست نمی تونم رنگ جالب دربیارم.
کاناپه بادی
با تشکر از مطالب خوبتون
تور ترکیه
من از وقتی رنگ بندی سایتمو عوض کردم بازدیدم بیشتر شده
سئو
استفاده کردم.ممنون
فروشگاه عروسک
با سلام
ممنون بابت مقاله زیبا تون بسیار مفید بود
آچیلان در
خانم سودابه امیر اکبری فقط میتونم بگم ممنون و خسته نباسید
سانترال
عالی بود مرسی استفاده کردیم
مالدیو
خیلی عالی بود دستتون درد نکنه
طراحی نمای ساختمان
مطالب بسیار مفیدی بود.
مهدی جلالی
بازم مثل همیشه عالــــی
بتیس
خیلی کمک کرد
دکتر ارتودنسی
عالی بود مرسی
ثبت اختراع
خیلی خوشم اومد. سایتتون رو همیشه دنبال می کنم.
طراحی وب سایت
خیلی آموزنده و جامع بود. ممنون.
چاپ فوری کارت ویزیت
سلام
واقعا مطالبتون جالب و مفیده
خواهشمندم مطالب بیشتری از این دست رو تو سایتتون بذارید
با تشکرات فراوان
site دیزاین
مطلب طراحی وب خوبی بود ممنون
دستگاه حضور و غیاب
رنگ بندی در دنیای طراحی سایت خیلی مهم و کلیدی هست. مطلبتون بسیار عالی است.
تور کیش
خیلی مقاله خوبی بود مخصوصا من که اول راه طراحی وب هستم
آسانسور و پله برقی
سلام
متشکر از سایت خوبتون اطلاعات خوبی ارائه کردید من منتظر اطلاعات جدید هستم
بوستر پمپ آبرسانی
مرسی
خیلی خوب
طراحی سایت
خیلی مقاله خوبی بود برای نیمه حرفه ای ها . ما که حرفه ای هستیم. :))
آموزش 3d max
عالی بود ممنونم از سایت خوبتون
پرسشنامه
مرسی از زحمات و تلاش بی وقفه شما در ارائه مطالب خوب و باارزشتون در این سایت
دانلود فیلم با لینک مستقیم
درود بر شما
مطلب واقعا آموزنده ای بود. وب فارسی به تولید محتوا نیاز داره. همون کاری که شما میکنید 🙂
پارتیشن دوجداره
مرسی از محتوای خوبی که در سایتتون ایجاد کردید
درمان بی خوابی
خسته نباشید
مرسی از آموزه های خوبی که در سایتتون قرار دادید
دوربین مدار بسته
خیلی مفید بود ممنون
طراحی کاتالوگ
نظر ندارید؟
عکاسی صنعتی
نظر در چه مورد؟
پنل اس ام اس
خیلی خوبه دستت درد نکنه
خرید شارژ
بسیار عالی و کاربردی. تشکر
عکاسی صنعتی
لطف میکنید مطالب بیشتری بگید؟
چاپ کارت ویزیت
عالی بود متشکرم
طراحی سایت
خیلی عالی بود موفق باشین
ظرفشویی
عالی بود ، با سپاس فراوان از زحمات شما
طراحی سایت تفریحی
من هم فقط می تونم بگم عالی بود
کیف دلسی
عالی بود ، سپاس فراوان
طراحی سایت در تبریز
ممنون از مطالب بسیار خوبتون
تخریب ساختمان
عالی بود , سپاس فراوان از زحمات شما
سیامک ابراهیمی
من یه مطلب بگم جدیدا باب شده دوستان فوق تخصص سئو همانطور که می بینید شروع کردن به کامنت دادن برای گرفتن بک لینک مجانی باید به عرضشون مطلبی برسونم ممکنه نا امید بشن بیش از 90% وبلاگها لینک شما به صورت rel=”nofollow” درج میشه عزیزان و این روش هم روش جالبی نیست
کیف لپ تاپ
ممنون بابت اشتراک گذاری این مطلب
طراحی سایت
سلام
ممنون از مطالب خوبتون.
طراحی سایت
با سلام
ممنون خیلی خوب و جالب بود.
تور دبی
thanks man
خرید کریو
خیلی خوب و جالب بود.
خرید cccam
می تونم بگم عالی بود
طراحی سایت
خیلی عالی بود ممنووووووون
ماشین لباسشویی
مطلب بسیار خوبی بود ممنون بابت به اشتراک گذاری
سفارش گل
مرسی از مطلب خوب و مفیدی که به اشتراک گذاشتید
موفق باشید
کرکره برقی
روانشناسی رنگ واقعا پیچیده است.
طراحی سایت
با سلام و احترام
لطفا به این رویه مطالب مفیدتون ادامه دهید
لذت بردیم
سپاسگذارم
برنامه نویسی اندروید
با سلام
ممنون از مطالب مفیدتون.