نکاتی برای یک طراحی سایت موفق نکاتی برای یک طراحی سایت موفق

رتبه این آیتم
نکاتی برای یک طراحی سایت موفق
رتبه 4 در 1 رای از 1 تا 5

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

  • از راهنمای مدلها استفاده کنید

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

  • ستونهای کناری رو کم کم حذف کنید

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

  • طراحی رو از بیرون نمایشگر شروع کنید

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

  • فونتهای بزرگتر استفاده کنید

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

  • فضای بیشتری تولید کنید

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

  • طراحی واکنشگرا انتخابی نیست

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

  • از طراحی موادگرای گوگل بهره ببرید.

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

  • ابزارتونو گسترش بدید و بهتر کنید

اگر حس میکنید کارهایی که قراره انجام بدید میتونه مؤثرتر یا حداقل لذت بخش تر باشن، میتونید با یکم سرچ ببینید آیا ابزار جدیدی برای این نیازهاتون هست یا نه.
همونطور که نکات طراحی سایت داره هر لحظه به روز میشه و مرتبا نکات جدیدتری رو کار میان، ابزارهای طراحی هم مدام اضافه میشن و ابزارهای تازه ظهور میکنن. از برنامه های رایگانی مثل Pixate گرفته تا آپدیت هایی مثل Adobe CC apps for web designers. بد نیست همیشه یه نیم نگاهی هم به چیزای جدید داشته باشید تا کارتونو بهتر کنید و بیشتر ازش لذت ببرید.

  • جهتیابی سایتتونو ساده کنید

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

  • با تصویرها بازی کنید

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

  • اسلایدرها رو حذف کنید

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

  • تست A/B رو یاد بگیرید

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


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

شبکه اجتماعی های نویسنده اینستاگرام و لینکدین.

به اشتراک گذاری مطلب در

به اشتراک گذاری در فیس بوک به اشتراک گذاری در توئیتر به اشتراک گذاری در لینکدین

يک نظر بدهيد

موارد ستاره دار الزامی هستند

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