سلام، مهمان
امروز،
90 نکته در خصوص طراحی UX
UX به مجموعه نکاتی گفته می شود با رعایت آن ها و بهبود کارایی می توانید رضایت بازدیدکننده از سایت را افزایش دهید. ما در لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید پرنا با بررسی و مطالعه رفتار کاربران بهترین و مهم ترین نکات را برای شما عزیزان جمع آوری کرده ایم. با رعایت 100 نکته زیر شما می توانید تجربه خوبی را برای کاربران سایت خود فراهم کنید.
جریان
1- وب سایت شما باید مانند یک جاده آجر نما باشد . کاربران را با توجه به اهداف خود به آرامی به بخش های مختلف وب سایت هدایت کنید.
2- کاربران ابتدا به المان های قسمت بالایی سایت شما توجه خواهند کرد. مهم ترین قسمت سایت آنجاست.
3- طراحی تمیز و مرتبط به کاربران این اجازه را می دهد که با آرامش به بررسی سایت شما بپردازند.
4- تمامی صفحات شما باید به هم متصل باشند. هیچ صفحه ای نباید "بن بست " باشد تا کاربر برای بازگشت دچار سردرگمی بشود.
5- از طرح ها و الگو های رایج در طراحی سایت استفاده کنید. کاربر را مجبور به یادگیری چیز جدید نکنید.
![[تصویر: 1800618-bigthumbnail-300x200.jpg]](https://www.parnasite.com/wp-content/uploads/2018/09/1800618-bigthumbnail-300x200.jpg)
اسکرول کردن
6-کاربران تا زمانی به اسکرول وب سایت ادامه می دهند که به اطلاعات مورد نیاز خودشان دسرسی پیدا کنند. نکات مهم تر را در قسمت های بالایی قرار دهید.
7-در تمامی قسمت هایی که اسکرول می شوند وب سایت باید از لحاظ گرافیکی جذاب باشد .
8- هرچه طول صفحه بلند تر باشد کاربران علاقه کمتری به اسکرول خواهند داشت.
9- کاربران معمولا اسکرول کردن را بیشتر از کلیک کردن می پسندند. به همین دلیل صفحه نباید خیلی کوتاه باشد و کاربران با کلیلک کردن به قسمت های مختلف هدایت شوند.
کنتراست و رنگ بندی
10-وب سایت را برای کابران کور رنگ نیز بهینه کنید. رنگ بندی باید تفاوت نسبتا آشکاری داشته باشد.
11- از رنگ آبی صرفا برای لینک ها استفاده کنید.
12- به کنتراست LCD های تلفن های همراه نیز توجه کنید. با کیفیت پایین برخی از گوشی های ، از زیبایی سایت شما کاسته خواهد شد.
13-یک رنگ یونیک برای دکمه CALL TO ACTION خود داشته باشد.
14- رنگ های روشن در المان های بالا و رنگ های تیره در پس زمینه ها استفاده شوند.
بارگذاری
15 - مطمئن شوید کاربران به آسانی به اهداف مورد نظرشان در خصوص لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید شما برسند .
16- مهمترین چیزی که برای بازدیدکنندگان اهمیت دارد ، در نگاه اول سرعت سایت شماست.
17- مهم ترین مسائل در خصوص بارگزاری ، سرعت بارگذاری سایت ، نحوه بارگذاری المان ها و انیمیشن ها smooth است.
18-قبل از بارگذاری کامل سایت ، بهتر است اسکلت کلی آن بارگذرای شود.
19- متون وب سایت می بایست قبل از عکس ها بارگذاری شوند تا کاربران شروع به خواندن نمایند و بیکار نباشند !
20- تاخیر های بیش از چند ثانیه موجب ترک وب سایت توسط بازدیدکننده خواهد شد.
گوشی و تبلت
21-لمس کردن المان های سایت روی گوشی ، زمانی که عناصر خیلی کوچک یا به هم نزدیک هستند مشکل است.
22-هر المان به طور میانگین باید یک سانتیمتر مربع با سایر المان ها فاصله داشته باشد
23-اگر کسی با انگشت کوچک دست لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید شما را مرور کند ، یعنی المان ها بیش از حد کوچک هستند.
24-گوشه ها و قسمت پایینی وب سایت راحت ترین و سریع ترین مکان برای لمس کردن هستند ( با انگشت شست :| )
25- به هیچ عنوان کاربر را مجبور نکنید برای کامل دیدن وب سایت گوشی یا تبلت را بچرخواند.
26- هیچ عنصری نباید نیاز به دوبار لمس کردن داشته باشد.
27- تعیین کنید که کاربر برای مشاهده وب سایت نیاز به دو دست خود دارد یا با یک دست امکان مشاهده کامل آن وجود دارد.
منو
28- همیشه راهی ساده برای دسترسی به منو قرار دهید.
29- اگر لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید به بیش از 3 یا 4 سرح رسید باید آن را بازطراحی کنید.
30- بهتر است از منو های چسبیده استفاده کنید.
31-منو نباید در مشاهده المان ها تداخل ایجاد کند.
32- منو باید ثابت باشد و در قسمت ها مختلف سایت متفاوت نباشد.
33- عناوین منو ها تا حد امکان کوتاه باشند.
34- حتما از breadcrumbs ها استفاده کنید تا کاربر متوجه شود در حال حاضر کجاست.
35-در گوشی ها و تبلت ها از منو های کوچک استفاده کنید.
36- در صفحات desktop از منو های کوچک استفاده نکنید.
37- در منو های موبایل ، از دسته بندی استفاده کنید.
38- منو بهتر است عمودی باشد تا افقی !
39- اگر از مگا منو استفاده می کنید ، فاصله مناسب بین المان ها را فراموش نکنید.
40- در هنگام استفاده از مگا منو ها ، عناصر قابل کلیک و غیر قابل کلیک را به خوبی تفکیک کنید.
41- ورود ، ثبت نام و جست وجو را داخل منو ها قرار ندهید.
فرم ها
42- هر عنصر فرم را به صورت مجزا در یک سطر کامل قرار دهید.
43- بهتر است عنوانین فرم ها خارج از عناصر فرم باشد.
44- فرم ها را سایر عناصر کاملا مجزا کنید.
45- ارور ها مر بوط به هر سطر را همانجا نشان دهید
46- خطا ها در فرم ها باید مشخص ، ساده و مفید باشند.
47- لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید در گوشی ها خطا ها را در یک محل گردآوری کنید.
لینک ها
48- لینک ها باید با رنگ آبی یا underline از سایر متون جدا شوند.
49- لینک ها باید شکل لینک باشند !
50- از رنگ آبی یا underline برای سایر متون استفاده نکنید.
51- کاربر نباید پس از کلیک روی لینک متوجه شود که به کجاتر رفته است ، مقصد لینک در لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید باید واضح باشد.
52- عکس های وبلاگ یا محصولات همیشه باید قابلیت کلیک داشته باشند.
53- عنواوین تیتر صفحات ویژه باید همیشه ثابت باشند.
54- لینک های بازدید شده را از بقیه لینک ها مجزا کنید.
دکمه ها
55-دکمه ها باید قابلیت کلیک داشته باشند و از باقی المان ها جدا باشند.
56-دکمه های خاص باید از بقیه بزرگتر باشند.
57- پس زمینه ، لبه ها و شکل ظاهری دکمه ها باید برای کاربر قابل تشخیص باشد.
58- در طراحی فلت ، رنگ دکمه ها باید تک باشد.
59- کاربر در 0.1 ثانیه باید متوجه شود پس از کلیک روی دکمه چه اتفاقی افتاده است.
60- در لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید ، دکمه هایی که باعث پاک شدن یا تغییر اطلاعات می شوند باید سخت تر کلیک شوند ، خصوصا روی گوشی ها همراه
جست و جو
61-اگر لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید کوچکی ندارید ، حتما به بخش جست و جو نیاز دارید.
62- شکل بخش جست وجو باید مانند فرم ها باشد.
63- جست و جو را در در قسمتی واضح قرار دهید ، معمولا بالا سمت راست
64- کاربران وقتی دنبال جست و جو می گردند انتظار یک سطر که قابلیت نوشتن دارد می گردند.
65- طول قسمت جست وجو باید به حد کافی بلند باشد که کاربر تمام جمله خود را ببیند.
اسلایدر ها
66-اسلایدر ها را فراموش کنید ! کاربر با هر اسلاید جدید قبلی را فراموش خواهد کرد.
67- دکمه های تغییر عکس خصوصا روی گوشی ها همراه چندان واضح نیستند.
68- به جای فلش ، از متن استفاده کنید تا کاربر بداند که در اسلایدر بعدی چه خبر است.
69-تنها 1% کاربران سایر عکس های اسلایدر را در لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید شما مشاهده می کنند !!
70- اسلایدر هایی که به صورت اتوماتیک تصاویر را تغییر می دهند ، به محض تداخل کاربر نباید به صورت اتوماتیک تغییر کنند.
آکاردئون ها
71-در گوشی های همراه از آکاردئون ها استفاده کنید تا طول صفحه کمتر شود.
72- در آکاردئون ها قابلیت بسته شدن را نیز قرار دهید.
73- آکاردئون به جای لینک ها در گوشی های همراه
74- آکاردئون ها موجب راحتی کاربر می شوند.
نکات و راهنما ها
75- هدف اصلی هر صفحه لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید باید برای کاربر کاملا واضح باشد.
76- کاربران معمولا در صورت بروز مشکل ، به دنبال صفحه راهنما خواهند گشت.
77- صفحه راهنما را در قسمت های لازم جای گذاری کنید ، نه همه جا
78- صفحه راهنما باید کمی از سایر صفحات متفاوت باشد.
79- حدالمقدور راهنما را خلاصه کنید.
آیکون ها
80-آیکون ها باید با معنی باشد و علت وجودشان مشخص باشد.
81- از آیکون ها فقط در مواقعی که لازم است استفاده کنید.
محتوا
82- مهم ترین اطلاعات لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید ، باید در واضح ترین قسمت قرار گیرند.
83- نکات کلیدی محتوا را به صورت خلاصه در چند سطر اول توضح دهید.
84- مطالب را اولویت بندی کنید و به ترتیب اولویت قرار دهید.
85- نکات اصلی را با رنگ یا طرح های خاص مجزا کنید.
86- لوکیشن ، اطلاعات تماس و.. مهمترین اطلاعات برای کاربران گوشی ها هستند.
87- در گوشی ها همراه کاربران صرفا اطلاعات حیاتی شما را می خواهند.
88- اصطلاحات ساده و کامل ، جذاب تر از عبارات قلمبه سلمبه هستند.
خوانایی
89- بیشتر کاربران ، قبل از خواندن یک دور متن را ورانداز می کنند ، از المان های گرافیکی زیبا استفاده کنید.
90- خوانایی صرفا به معنای راحت تر خواندن نیست ، به معنای چه موقع خواندن نیز هست.
لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید
UX به مجموعه نکاتی گفته می شود با رعایت آن ها و بهبود کارایی می توانید رضایت بازدیدکننده از سایت را افزایش دهید. ما در لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید پرنا با بررسی و مطالعه رفتار کاربران بهترین و مهم ترین نکات را برای شما عزیزان جمع آوری کرده ایم. با رعایت 100 نکته زیر شما می توانید تجربه خوبی را برای کاربران سایت خود فراهم کنید.
جریان
1- وب سایت شما باید مانند یک جاده آجر نما باشد . کاربران را با توجه به اهداف خود به آرامی به بخش های مختلف وب سایت هدایت کنید.
2- کاربران ابتدا به المان های قسمت بالایی سایت شما توجه خواهند کرد. مهم ترین قسمت سایت آنجاست.
3- طراحی تمیز و مرتبط به کاربران این اجازه را می دهد که با آرامش به بررسی سایت شما بپردازند.
4- تمامی صفحات شما باید به هم متصل باشند. هیچ صفحه ای نباید "بن بست " باشد تا کاربر برای بازگشت دچار سردرگمی بشود.
5- از طرح ها و الگو های رایج در طراحی سایت استفاده کنید. کاربر را مجبور به یادگیری چیز جدید نکنید.
اسکرول کردن
6-کاربران تا زمانی به اسکرول وب سایت ادامه می دهند که به اطلاعات مورد نیاز خودشان دسرسی پیدا کنند. نکات مهم تر را در قسمت های بالایی قرار دهید.
7-در تمامی قسمت هایی که اسکرول می شوند وب سایت باید از لحاظ گرافیکی جذاب باشد .
8- هرچه طول صفحه بلند تر باشد کاربران علاقه کمتری به اسکرول خواهند داشت.
9- کاربران معمولا اسکرول کردن را بیشتر از کلیک کردن می پسندند. به همین دلیل صفحه نباید خیلی کوتاه باشد و کاربران با کلیلک کردن به قسمت های مختلف هدایت شوند.
کنتراست و رنگ بندی
10-وب سایت را برای کابران کور رنگ نیز بهینه کنید. رنگ بندی باید تفاوت نسبتا آشکاری داشته باشد.
11- از رنگ آبی صرفا برای لینک ها استفاده کنید.
12- به کنتراست LCD های تلفن های همراه نیز توجه کنید. با کیفیت پایین برخی از گوشی های ، از زیبایی سایت شما کاسته خواهد شد.
13-یک رنگ یونیک برای دکمه CALL TO ACTION خود داشته باشد.
14- رنگ های روشن در المان های بالا و رنگ های تیره در پس زمینه ها استفاده شوند.
بارگذاری
15 - مطمئن شوید کاربران به آسانی به اهداف مورد نظرشان در خصوص لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید شما برسند .
16- مهمترین چیزی که برای بازدیدکنندگان اهمیت دارد ، در نگاه اول سرعت سایت شماست.
17- مهم ترین مسائل در خصوص بارگزاری ، سرعت بارگذاری سایت ، نحوه بارگذاری المان ها و انیمیشن ها smooth است.
18-قبل از بارگذاری کامل سایت ، بهتر است اسکلت کلی آن بارگذرای شود.
19- متون وب سایت می بایست قبل از عکس ها بارگذاری شوند تا کاربران شروع به خواندن نمایند و بیکار نباشند !
20- تاخیر های بیش از چند ثانیه موجب ترک وب سایت توسط بازدیدکننده خواهد شد.
گوشی و تبلت
21-لمس کردن المان های سایت روی گوشی ، زمانی که عناصر خیلی کوچک یا به هم نزدیک هستند مشکل است.
22-هر المان به طور میانگین باید یک سانتیمتر مربع با سایر المان ها فاصله داشته باشد
23-اگر کسی با انگشت کوچک دست لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید شما را مرور کند ، یعنی المان ها بیش از حد کوچک هستند.
24-گوشه ها و قسمت پایینی وب سایت راحت ترین و سریع ترین مکان برای لمس کردن هستند ( با انگشت شست :| )
25- به هیچ عنوان کاربر را مجبور نکنید برای کامل دیدن وب سایت گوشی یا تبلت را بچرخواند.
26- هیچ عنصری نباید نیاز به دوبار لمس کردن داشته باشد.
27- تعیین کنید که کاربر برای مشاهده وب سایت نیاز به دو دست خود دارد یا با یک دست امکان مشاهده کامل آن وجود دارد.
منو
28- همیشه راهی ساده برای دسترسی به منو قرار دهید.
29- اگر لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید به بیش از 3 یا 4 سرح رسید باید آن را بازطراحی کنید.
30- بهتر است از منو های چسبیده استفاده کنید.
31-منو نباید در مشاهده المان ها تداخل ایجاد کند.
32- منو باید ثابت باشد و در قسمت ها مختلف سایت متفاوت نباشد.
33- عناوین منو ها تا حد امکان کوتاه باشند.
34- حتما از breadcrumbs ها استفاده کنید تا کاربر متوجه شود در حال حاضر کجاست.
35-در گوشی ها و تبلت ها از منو های کوچک استفاده کنید.
36- در صفحات desktop از منو های کوچک استفاده نکنید.
37- در منو های موبایل ، از دسته بندی استفاده کنید.
38- منو بهتر است عمودی باشد تا افقی !
39- اگر از مگا منو استفاده می کنید ، فاصله مناسب بین المان ها را فراموش نکنید.
40- در هنگام استفاده از مگا منو ها ، عناصر قابل کلیک و غیر قابل کلیک را به خوبی تفکیک کنید.
41- ورود ، ثبت نام و جست وجو را داخل منو ها قرار ندهید.
فرم ها
42- هر عنصر فرم را به صورت مجزا در یک سطر کامل قرار دهید.
43- بهتر است عنوانین فرم ها خارج از عناصر فرم باشد.
44- فرم ها را سایر عناصر کاملا مجزا کنید.
45- ارور ها مر بوط به هر سطر را همانجا نشان دهید
46- خطا ها در فرم ها باید مشخص ، ساده و مفید باشند.
47- لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید در گوشی ها خطا ها را در یک محل گردآوری کنید.
لینک ها
48- لینک ها باید با رنگ آبی یا underline از سایر متون جدا شوند.
49- لینک ها باید شکل لینک باشند !
50- از رنگ آبی یا underline برای سایر متون استفاده نکنید.
51- کاربر نباید پس از کلیک روی لینک متوجه شود که به کجاتر رفته است ، مقصد لینک در لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید باید واضح باشد.
52- عکس های وبلاگ یا محصولات همیشه باید قابلیت کلیک داشته باشند.
53- عنواوین تیتر صفحات ویژه باید همیشه ثابت باشند.
54- لینک های بازدید شده را از بقیه لینک ها مجزا کنید.
دکمه ها
55-دکمه ها باید قابلیت کلیک داشته باشند و از باقی المان ها جدا باشند.
56-دکمه های خاص باید از بقیه بزرگتر باشند.
57- پس زمینه ، لبه ها و شکل ظاهری دکمه ها باید برای کاربر قابل تشخیص باشد.
58- در طراحی فلت ، رنگ دکمه ها باید تک باشد.
59- کاربر در 0.1 ثانیه باید متوجه شود پس از کلیک روی دکمه چه اتفاقی افتاده است.
60- در لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید ، دکمه هایی که باعث پاک شدن یا تغییر اطلاعات می شوند باید سخت تر کلیک شوند ، خصوصا روی گوشی ها همراه
جست و جو
61-اگر لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید کوچکی ندارید ، حتما به بخش جست و جو نیاز دارید.
62- شکل بخش جست وجو باید مانند فرم ها باشد.
63- جست و جو را در در قسمتی واضح قرار دهید ، معمولا بالا سمت راست
64- کاربران وقتی دنبال جست و جو می گردند انتظار یک سطر که قابلیت نوشتن دارد می گردند.
65- طول قسمت جست وجو باید به حد کافی بلند باشد که کاربر تمام جمله خود را ببیند.
اسلایدر ها
66-اسلایدر ها را فراموش کنید ! کاربر با هر اسلاید جدید قبلی را فراموش خواهد کرد.
67- دکمه های تغییر عکس خصوصا روی گوشی ها همراه چندان واضح نیستند.
68- به جای فلش ، از متن استفاده کنید تا کاربر بداند که در اسلایدر بعدی چه خبر است.
69-تنها 1% کاربران سایر عکس های اسلایدر را در لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید شما مشاهده می کنند !!
70- اسلایدر هایی که به صورت اتوماتیک تصاویر را تغییر می دهند ، به محض تداخل کاربر نباید به صورت اتوماتیک تغییر کنند.
آکاردئون ها
71-در گوشی های همراه از آکاردئون ها استفاده کنید تا طول صفحه کمتر شود.
72- در آکاردئون ها قابلیت بسته شدن را نیز قرار دهید.
73- آکاردئون به جای لینک ها در گوشی های همراه
74- آکاردئون ها موجب راحتی کاربر می شوند.
نکات و راهنما ها
75- هدف اصلی هر صفحه لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید باید برای کاربر کاملا واضح باشد.
76- کاربران معمولا در صورت بروز مشکل ، به دنبال صفحه راهنما خواهند گشت.
77- صفحه راهنما را در قسمت های لازم جای گذاری کنید ، نه همه جا
78- صفحه راهنما باید کمی از سایر صفحات متفاوت باشد.
79- حدالمقدور راهنما را خلاصه کنید.
آیکون ها
80-آیکون ها باید با معنی باشد و علت وجودشان مشخص باشد.
81- از آیکون ها فقط در مواقعی که لازم است استفاده کنید.
محتوا
82- مهم ترین اطلاعات لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید ، باید در واضح ترین قسمت قرار گیرند.
83- نکات کلیدی محتوا را به صورت خلاصه در چند سطر اول توضح دهید.
84- مطالب را اولویت بندی کنید و به ترتیب اولویت قرار دهید.
85- نکات اصلی را با رنگ یا طرح های خاص مجزا کنید.
86- لوکیشن ، اطلاعات تماس و.. مهمترین اطلاعات برای کاربران گوشی ها هستند.
87- در گوشی ها همراه کاربران صرفا اطلاعات حیاتی شما را می خواهند.
88- اصطلاحات ساده و کامل ، جذاب تر از عبارات قلمبه سلمبه هستند.
خوانایی
89- بیشتر کاربران ، قبل از خواندن یک دور متن را ورانداز می کنند ، از المان های گرافیکی زیبا استفاده کنید.
90- خوانایی صرفا به معنای راحت تر خواندن نیست ، به معنای چه موقع خواندن نیز هست.
لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید