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

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

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

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

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


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


تمرکزتان را به سمت خواسته هایتان معطوف کنید.

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


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


استفاده از رنگ در طراحی وب سایت Vibrant

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

استفاده از رنگ در طراحی وب سایت Takeit

شخصیت سازی

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


An Interesting Day سایتی است که شامل یک کنفرانس عجیب و یک روزه در جزیره ای کوچک و در اسلوفیور می باشد. مسلماً هنگامی که پس زمینه سایت را با متن قرمز در بالای آن مشاهده می کنید، مفاهیم «عجیب» و «متفاوت» باید برایتان جا بیفتد. آن چه از این ترکیب بندی مهم تر جلوه می کند، انتقال عجیب بودن اتفاق مذکور در سایت به وسیله این ترکیب رنگی است.

استفاده از رنگ در طراحی وب سایت An Interesting Day

مقصودتان را منتقل کنید

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


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


استفاده از رنگ در طراحی وب سایت Gaga Symphony

پیوستگی ایجاد کنید

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


به عنوان مثال دیگر سایت Innovation Project Canvas را مدنظر داشته باشید. آن ها از رنگ سبز برای هدایت کاربر به هنگام گشت و گذار در سایت استفاده می کنند؛ و این نشان دهنده آن است که شما برای ایجاد یک سایت منسجم و با شمایل زیبا، به رنگ های بسیاری نیاز ندارید و گاها استفاده از یک رنگ هم کفایت می کند.


استفاده از رنگ در طراحی وب سایت Innovation Project Canvas

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

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


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


استفاده از رنگ در طراحی وب سایت CartoDB

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


استفاده از رنگ در طراحی وب سایت ETQ

چه کسی باز هم به رنگ نیاز دارد؟

این که وب سایتی را بدون رنگ در نظر بگیریم هم به نوبه خود جالب است. گاها به رنگ نیاز پیدا نخواهید کرد. یک وب سایت بعضاً بدون رنگ های سبز و قرمز و آبی هم جلوه زیبای خود را به دست می آورد. یک منظره خاکستری علاوه بر زیبایی به انتقال مفاهیم یک وب سایت هم کمک می کند. سایت هایی چون Visual Soldiers و Tomasz Wysocki’s portfolio در این موضوع به درستی گام برداشته اند و بدون استفاده از رنگ های مختلف، جلوه زیبایی به صفحات خود بخشیده اند که توجه کاربران را به خود جلب می کند. رنگ های آبی و یا سبزی که به دنبال آن ها در گوشه کنار سایت هستید را نخواهید یافت که البته مشکلی به وجود نمی آید. عدم استفاده از رنگ، در واقع جزوی از سیاست های این سایت ها محسوب می شود؛ سایت هایی که با رنگ های سیاه و سفید جلوه های زیبایی به خود بخشیده اند.


استفاده از رنگ در طراحی وب سایت Visual Soldiers

نتیجه گیری

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

مطالب منتشر شده در سایت - خدمات طراحی حرفه ای وب سایت و بهینه سازی سایت - سئو وب سایت

اهمیت طراحی سایت مناسب، در رونق کسب و کار ها
محتوا در مقابل کلیدواژه – بخش 1
نکاتی برای طراحی سایت رستوران
روش هایی کاربردی برای بهینه سازی طراحی سایت
چگونه از رنگ ها در طراحی وب سایت استفاده کنیم?
8 راه بهینه سازی سایت برای موبایل
7 پیش بینی برای روند طراحی سایت در سال 2017
۴ استراتژی طراحی سایت , برای ایجاد روش call to action
بهترین فونت برای استفاده در طراحی سایت چیست؟
طراحی وب سایت شما آزار دهنده است؟
در کجا لینک بگذاریم؟
تفاوت وبلاگ با وب سایت چیست؟
نگاهی به گوگل
تفاوت قیمت طراحی در شرکت های طراحی سایت
طراحی حرفه ای، عامل حیاتی برای موفقیت آنلاین
اصولا چرا ما به يك وب سايت نياز داريم ؟
:: اهمیت “درباره ما” در طراحی سایت
بررسی رنگ در دنیای طراحی وب
طراحی سایت در سال ۲۰۱۲ - نکته‌ها و پیشنهادها
۹ نکته موثر در طراحی وب سایت
طراحی سایت با ASP.Net
روش مدولار در طراحي سايت‌
قدم اول پیش از طراحی سایت چیست ؟
تدوین برنامه و پلن کاربردی در طراحی سایت
ساخت سایت سومین گام مربوط به طراحی سایت
ضرورت طراحی سایت های ایرانی مطابق با اینترنت اکسپلورر
امنیت در طراحی سایت و نرم افزارهای مبتنی بر وب
پنهان سازی سیستم عامل سرور در طراحی وب سایت
گام های سفارشی سازی طراحی سایت
طراحی حرفه ای وب سایت چیست؟
معماری در طراحی سایت و افزایش سود دهی
رعایت اصول حرفه ای در طراحی سایت