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

کاربرد رنگ در طراحی سایت

رنگ ها در تایپوگرافی سایت و جذب کاربر نقش بسیار مهمی ایفا می کنند . پس از آزمایشات ایزاک نیوتون بر روی منشور ، انسان متوجه شد که نور از رنگ های متعددی تشکیل شده است . هنرمندان از رنگ های قرمز و زرد و آبی به عنوان رنگ های پایه استفاده می کنند و از زمان نیوتون تا به حال دید و علم انسان نسبت به رنگ ها تکامل یافته است . چشم هر فرد دارای گیرنده های مختلفی است که گیرنده هایی با نام “rod” برای تشخیص سیاه و سفید است و گیرنده هایی با نام “cone” سه رنگ پایه ای قرمز و سبز و آبی را تشخیص می دهند .
این رنگ ها برای طراحان وب سایت آشناست ، چرا که هر پیکسل از نمایشگر متشکل از این سه رنگ می باشد . هر رنگ دارای 256 تنوع می باشد که در مجموع بیش از 16 میلیون رنگ متنوع وجود دارد . می توان رنگ ها را با تابع رنگ (255،115،0)rgb و یا در مبنای هشت#ff7300 تعریف کرد ، هر دو تابع رنگ یکسانی را از دو طریق کمی متفاوت تعریف می کنند .

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

برای شروع به صحبت درباره تناسب رنگ در طراحی سایت ، از تابع رنگ hsl() در CSS استفاده می کنیم . این تابع رنگ ها را به صورت هیو (HUE) ، پر رنگی (Saturation) و روشنایی (Lightness) به کار می گیرد . هیو با واحد درجه (0-360) و پر رنگی و روشنایی با واحد درصد (0-100) بیان می شود .
بنابراین ، مقادیر هیو بر روی دایره رنگ (colour wheel) ترسیم می شوند . مثلا اگر رنگ قرمز(0) را دارید و رنگ زرد را می خواهید ، کافی است هیو را به 60 تغییر دهید . در کاربرد رنگ ها ، از اصل رنگ های مکمل استفاده می شود ؛ دو رنگ مکمل در دو سمت مخالف دایره رنگ . مثلا برای یافتن مکمل قرمز ، باید رنگی با مقدار 180 درجه را بیابیم . در این مثال ، 0 (قرمز) + 180 ، رنگ حاصل فیروزه ای می باشد .
پر رنگی و روشنایی کم آسان تر است . رنگ با غلظت 100 هیچ تیرگی ندارد ، اما غلظت 0 کاملا تیره است . در روشنایی ، 0 سیاه و 100 سفید است . چون تفکر ما معمولا با هیو رنگ ها گره خورده است ، از نظر مقیاس رنگ ها بهتر است از پر رنگی و روشنایی استفاده کنیم .

استفاده از رنگ ها با ساس (SASS)

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

به کارگیری رنگ متناسب در عمل

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