راهنمای ایجاد سبک در طراحی سایت

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

راهنمای سبک چیست؟

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

چرا مهم است؟

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

ایجاد یک راهنمای سبک طراحی سایت:

1. مطالعه برند

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

2. تعریف فن نوشتاری (تایپوگرافی)

طبق گفته الیور ریچنشتاین، فن نوشتاری 95 درصد از طراحی سایت می باشد. شما باید فن نوشتاری را به خوبی انجام دهید زیرا یکی از مهم ترین ابزارهای ارتباطی بین بازدیدکنندگان و وب سایت شما می باشد. یک سلسله مراتب را مشخص نمایید. تعدادی از عناوین موجود می باشند: h1, h2, h3, h4, h5, h6 . نسخه ای سفارشی سازی شده را در نظر بگیرید که برای متون مقدمه، پیوندهای کوتاه و غیره مورد استفاده قرار خواهند گرفت. نوع فونت، وزن و رنگ را تعریف کنید.

3. پالت رنگ

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

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

4. بیان مناسب

هر برندی دارای شخصیت است. با استفاده از شناسایی شخصیت برند مورد نظر، نحوه بیان کلمات و اصطلاحات را تعیین کنید. برای مثال اگر متوجه شدید که برند شما دارای شخصیت جوان و مد روز است، می توانید از اصطلاحات امروزی تر استفاده نمایید. اگر هیچ پیامی برای سایت در نظر نگرفته اید، باید آن را تعریف کنید. پیام ها باید به صورت حرفه ای و در عین حال صمیمانه باشد. به عنوان مثال: به جای بیان “You’ve got 404 error”می توانید بگویید “Oh boy, you’ve broken the interwebs. 404 error.”

5. استفاده از آیکون های مناسب

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

6. تصاویر در طراحی وب سایت

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

7. فرم ها

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

از ایجاد یک سلسله مراتب اطمینان یابید و بازخوردهای ممکن از فرم های فعال، دکمه های شناور، اضافه کردن خطا، اخطار و پیام های موفقیت آمیز از قبیل ضعیف بودن رمز عبور، نامعتبر بودن ایمیل یا پیام های موفقیت ساده نظیر “email was sent.” را در نظر بگیرید.

8. دکمه ها

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

9. فاصله گذاری

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

10. بایدها و نبایدها

آخرین نکته اما پر اهمیت: بخش بایدها و نبایدها را مانند پرسش و پاسخ در طراحی سایت خود نظر بگیرید که نشان دهنده بیشترین ارتباط بین کاربران و وب سایت می باشد.

نتیجه گیری:

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