تالار گفتمان اسکریپت دات کام

نسخه‌ی کامل: 90 نکته در خصوص طراحی UX از طرف یک متخصص !
شما در حال مشاهده‌ی نسخه‌ی متنی این صفحه می‌باشید. مشاهده‌ی نسخه‌ی کامل با قالب بندی مناسب.
90 نکته در خصوص طراحی UX
 
UX به مجموعه نکاتی گفته می شود با رعایت آن ها و بهبود کارایی می توانید رضایت بازدیدکننده از سایت را افزایش دهید. ما در لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید پرنا با بررسی و مطالعه رفتار کاربران بهترین و مهم ترین نکات را برای شما عزیزان جمع آوری کرده ایم. با رعایت 100 نکته زیر شما می توانید تجربه خوبی را برای کاربران سایت خود فراهم کنید.
 
جریان
 
1- وب سایت شما باید مانند یک جاده آجر نما باشد . کاربران را با توجه به اهداف خود به آرامی به بخش های مختلف وب سایت هدایت کنید.
2- کاربران ابتدا به المان های قسمت بالایی سایت شما توجه خواهند کرد. مهم ترین قسمت سایت آنجاست.
3- طراحی تمیز و مرتبط به کاربران این اجازه را می دهد که با آرامش به بررسی سایت شما بپردازند.
4- تمامی صفحات شما باید به هم متصل باشند. هیچ صفحه ای نباید "بن بست " باشد تا کاربر برای بازگشت دچار سردرگمی بشود.
5- از طرح ها و الگو های رایج در طراحی سایت استفاده کنید. کاربر را مجبور به یادگیری چیز جدید نکنید.
 
[تصویر:  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- خوانایی صرفا به معنای راحت تر خواندن نیست ، به معنای چه موقع خواندن نیز هست.
 
لینک قابل نمایش نیست . لطفا ثبت نام کنید و یا وارد سایت شوید