سلام
سال نومبارک
در مورد طراحی صفحاتی که ارور ها نمایش می دهند براتون صحبت کنم.
خوب من اخیرا روی طرح های 404 که یکی از ارورهای معروف در دنبای دیجیتال هست، نظرسنجی داشتم که آمار اون نظر سنجی به شرح زیر هست و در ادامه هم نمایش صفحات ارور را براتون تحلیل خواهم کرد، لطفا همراه من باشید:)
از نتیجه نظرسنجی اینستاگرامم فیلم گرفتم که شما هم می تونید در زیر ببینیدش و اگر دوست داشتید توی هایلایت های پروفایلم هم هست شما هم در صورت تمایل به صفحات رای بدید
در مورد نفراتی که در نظرسنجی شرکت کردند:
حداکثر مشاهده:287 نفر
حداقل مشاهده:196 نفر
تعداد نفرات رای دهنده: 62 نفر
تعداد طرح های نمونه ها :16 تا
اگر وب سایت و یا اپلیکیشن شما داینامیک باشه و کد های سمت سرور داشته باشه، به دلایل مختلفی که چندتاش پایین براتون می گم، ممکن هست برنامه یا اپلیکیشن دچار خطا بشه و با توجه به اینکه خطاهای سروری برای کاربران ناشناخته است و البته حس و حالشم خوب نیست که با صفحه ی زشت ارور های سمت سرور مواجه بشن، ما به عنوان طراحان رابط و تجربه کاربری وارد عمل میشم :دی
البته خیلی از اوقات پیش می اید که به دلیل دانش پایین طراحان رابط کاربری خود دولوپرها زحمت این صفحات را می کشند اما خوب بد نیست که این روزا که تب تجربه کاربری داغ این مباحث هم باز بشن
طراحان رابط کاربری می ایند تا ظاهر قشنگی بسازند تا حالا که کاربر به اون چیزی که خواسته نرسیده لاقل چشم هاش نترسه :)
طراحان تجربه کاربری میان تا به کاربر کمک کنند انچه را که از دست داده دوباره به دست بیاره و به گونه ای کمکش کنن که سایت یا برنامه مارو ترک نکنه
اما باتوجه به اینکه این اررور ها به دلایل مختلفی و گاها از پیش نامشخص اتفاق می افتد و سایت یا برنامه ما هم هویت بصری یکپارچه خودش را داره، بهتر است هر بار طراحی برنامه و یا وب سایت یکبار معماری اطلاعات برای صفحات ارور ها در نظر گرفته شود، پس ما به عنوان طراح تجربه کاربری باید بهترین پیشنهاد داشته باشیم و همه جوانب ببینیم.
همه صفحات دیجیتال که کاربران با ان تعامل می کنند چه وب سایت و چه اپلیکیشن ، حتی اگر در ظاهر شما به عنوان یک کاربر چیزی نبینید، در واقعیت یک هدر و یک فوتر دارد که در بیشتر صفحات ارث بری می شوند.
فوتر ها عموما برای کمک به سِئو در وب سایت ها حجیم هستند بنابراین من به شما پیشنهاد می کنم در صفحات ارور بیخیال نمایش فوتر ها بشید.
در مورد هدر ، اگر ایتم های منو طولانی یا زیاد هستند باز هم بیخیال هدر بشید اما اگر یک منوی کوچک و یا منوی درون همبرگر دارید، اون را به کاربر نشون بدید .
خوب حالا اگر منو ندارید لطفا منویی برای لینک به صفحه خانه و یا اگر خدمتی دارید که 50درصد ار کاربرانتون ازش استفاده می کنند، اون خدمت هم در این صفحه لینکش کنید.
درسته که کاربران اسم خطاها نمی شناسند اما بعضی از این خطاها با گذشت زمان برای کاربران شناخته شده هست و شما نباید نگران باشید که مثلا کاربر نمی دونه 404 یعنی چی ، اتفاقا بد هم نیست راز الود و معما گونه میشه و البته می فهمه شما در جریان این اتفاق بودید، حتی ارور های 503 یا 403 که کمتر پیش می آیند هم بد نیست عددش در معماری پیشنهادی به طراح رابط کاربری بگذارید تا در بخشی از دیزاین باهاش بازی کنند.
برای جذاب تر شدن موضوع شما در معماری که به طراح رابط کاربری پیشنهاد می دید یا اگر خودتون طراح هم هستید می تونید مواردی که در ادامه پیشنهاد می دهم را در طرح این صفحه لحاظ کنید::
حفظ هویت بصری اصلی سایت ( بودن یا نبودن لوگوی سایت خیلی سلیقه ای هست و ارتباط مستقیم با هویت بصری طراحی انجام شده ندارد اما من پیشنهاد نمی کنم که لوگو را در صفحه اررور نمایش دهید، می دنید یه حالیه که وقتی حالت از دیدن صفحه ارور گرفته اس لوگو اون برند هم ببینی تصورم نگاه منفی هست پس لطفا نگذاریدش)
1- دکمه هدایت به صفحه خانه
2- یک منوی کوچک با حداکثر3 ایتم
3- یک اتفاق بصری متناسب با شخصیت برند که با عدد مرتبط با ارور ترکیب شده باشه
و در نهایت ارورهایی که باید براشون صفحه ای طراحی کنید :
معروفترینشون 404 هست :یعنی صفحه /لینک /فایل و یا هر چیزی که وجود ندارد چه اینکه قبلا بوده و ما از مسیر سرور برش داشتیم و کاربر پیداش نمی کنه و چه اینکه کاربر آدرس اشتباه زده تا به هدفش برسه اما رسیده به 404
اررو 403یعنی : وقتی که دسترسی کاربر به فایل ها محدودیت داره با این ارور مواجه میشه
من یکم از جزییات این اررور هم می گم براتون اما توی طراحی نیازی نیست طرح تفکیک شده برای این ارورها بزنید فقط همان 403 کافیه
403.1 -دسترسی اجرا ندارد.
403.2 - دسترسی خوانندن ندارد.
403.3 - دسترسی نوشتن ندارد.
403.8 - دسترسی به سایت ندارد .
403.10 - وب سرور تنظیم شده تا دسترسی اجرای برنامه را بگیرد.
اررور 500 یعنی: ارور داخلی برای سرور پیش امده
اررور 503 یعنی : سرویس در دسترس نیست
اررور 501 یعنی :خطاهای سروری پیاده سازی نشده اند
ممنون از وقتی که گذاشتید.
https://www.instagram.com/fatemeh.khaani/
https://www.linkedin.com/pulse/error-pages-design-%25D8%25B7%25D8%25B1%25D8%25A7%25D8%25AD%25DB%258C-%25D8%25B5%25D9%2581%25D8%25AD%25D8%25A7%25D8%25AA-%25D8%25A7%25D8%25B1%25D9%2588%25D8%25B1-fatemeh-khani