یک طراحی سایت تمیز نباید کسل کننده باشد و همچنین یک طراحی سایت رنگارنگ نباید زننده و آزار دهنده باشد، در ادامه مقاله ای در این زمینه از زبان Tara Horner، سردبیر ارشد شرکت کارشناسان محتوا،  می خوانیم .

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

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

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

استفاده از فضای غیر سفید برای طراحی سایت رنگین

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

نمونه مثال :

سایت Rubrasonic

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

سایت Mooze Design

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

 رنگ های دقیق و جسورانه

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

سایت BarCamp Omaha

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

سایت Jolby & Friends

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

از عکس های بزرگ برای طراحی سایت رنگارنگ استفاده کنید

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

سایت Beaver Lab

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

سایت Apres Ski

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

طرح رنگی تمیز

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

سایت Big Eye Deers

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

سایت XGraphica

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

سلسله مراتب تایپوگرافی

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

سایت Bench

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

سایت Greenhouse

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

 جهت دهی ساده ( منوی ساده)

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

سایت Pollenize

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

سایت Foco Pure

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

ترازبندی دقیق

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

سایت Dropbox Guide

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

 

سایت Natrel

    طراحی سایت رنگارنگ
طراحی سایت رنگارنگ

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

نظر شما چیست؟

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

منبع: Tara Horner

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *