آموزش سئو

طراحی سایت | سئو | بهینه سازی سایت | طراحی فروشگاه اینترنتی | طراحی سایت شرکتی | شرکت طراحی سایت |

آموزش سئو

طراحی سایت | سئو | بهینه سازی سایت | طراحی فروشگاه اینترنتی | طراحی سایت شرکتی | شرکت طراحی سایت |

تجربه کاربری (UX) و کاربردپذیری (Usability)

تجربه کاربری (UX) و کاربردپذیری (Usability)

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

تجربه کاربری و کاربردپذیری به مثابه جاده

در سال های اولیه عصر اینترنت، تفاوت کاربردپذیری و تجربه کاربری (UX) به کمک مفهوم آنالوژی (قیاس) جاده مطرح می شد. اگر جاده ای پهن و مستقیم باشد و کاربر را از نقطه ی A به B برساند، این جاده کاربرد پذیر است.

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

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

 

نمونه هایی از کاربرد پذیری صفحه یک تبلت

 

کاربردپذیری و تجربه کاربری به مثابه هرم مازلو

برای بررسی رابطه ی بین کاربردپذیری و تجربه کاربری بهتر است نگاهی به هرم سلسله مراتب نیازهای آبراهام مازلو داشته باشیم. بیایید فرض کنیم که تمام وب سایت ها متناسب با این سلسله مراتب هستند.

اولین نیازی که باید سایت شما بر طرف کند این است که درست کار کند و باگی در طراحی سایت شما وجود نداشته باشد.

دومین نیاز، پس از نیاز سایت شما به درست کار کردن مسئله کاربردپذیری است. سایت شما باید کاربردپذیر باشد و کار کردن با آن راحت باشد. باید به کاربران کمک کند که به راحتی به هدفشان در سایت برسند و یا محتوای مورد نظرشان را بیابند.

در پایان نیز عامل جذابیت و لذت بخش بودن نقش گیلاس روی کیک را بازی می کند. آیا کار کردن با وبسایت شما سرگرم کننده است؟ آیا کار کردن با سایت شما برای کاربر لذت بخش است؟

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

تفاوت تجربه کاربری و کاربرد پذیری در طراحی

جمع بندی

همانطور که گفته شد، تجربه کاربری و کاربردپذیری دو مفهوم متفاوت با یکدیگر هستند اما تعامل این دو با یکدیگر می تواند سایت هایی عالی به وجود بیاورد. استیو جابز یکی از کسانی بود که به این موضوع پی برده بود و زودتر از بسیاری دیگر این مسئله را درک کرده بود.

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

استفاده از تکنولوژی HD در طراحی سایت

استفاده از تکنولوژی HD در طراحی سایت

با توجه به پیشرفت دنیای تحت وب تکنیک های طراحی سایت و طراحی فروشگاه اینترنتی با سرعت بالا در حال رشد می باشند و روز به روز از روش های نوینی در طراحی سایت رونمایی می شود. تصاویر و ویدئوهای HD جزو جدیدترین ها در این زمینه هستند.

با توجه به این که استفاده از صفحات نمایشی HD گسترش یافته است، یکی از تکنیک هایی که در چند سال آینده در طراحی فروشگاه اینترنتی رواج بیشتری خواهد یافت استفاده از تصاویر، ویدیو و انیمشن هایی با کیفیت بالا در هدر سایت می باشد. صفحات نمایشی High Definition که HD نامیده می شوند، به سیستم تصویری گفته می شود که از وضوح و کیفیت بسیار بالایی برخوردار است و تصاویر را با جزئیات بالا نشان می دهد.

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

استفاده از تصاویر HD در هدر سایت

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

استفاده از تصاویر HD در طراحی سایت سبب می شود کاربران درک بهتری از تصاویر داشته باشند و تجربه کاربری خوبی را از صفحات سایت شما کسب کنند. استفاده از این نوع تصاویر فرصت مناسبی را برای کاربران فراهم می کند تا با جزئیات بیشتری تصاویر را ببینند و دید بصری مناسبی را کسب کنند.

با رعایت نکات کلیدی زیر همواره می توانید تصاویری با کیفیت بالا تولید کنید.

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

تصویر زیر یک نمونه بکارگیری تصاویر HD در هدر صفحه اصلی سایت است که عامل نقطه کانونی و تمرکز را به خوبی رعایت کرده است.

تصاویر HD در طراحی سایت

 

استفاده از ویدیو HD در طراحی سایت

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

ویدیو HD در وب سایت یک تجربه کامل چند رسانه ای با بار اطلاعاتی بالا می باشد که اطلاعات مفیدی را در اختیار کاربران قرار می دهد.

وبسایت Life of Pi که برای فیلمی با همین عنوان ساخته شده است یک نمونه بسیار موفق و زیبا از بکارگیری ویدئوی HD در طراحی سایت محسوب میشود.

ویدئوی hd در طراحی سایت

مشکلی که در استفاده از ویدیو در طراحی سایت وجود دارد این است که ویدیو هایی که در طراحی فروشگاه اینترنتی استفاده می شوند باید دارای کیفیت بالایی باشند ولی از آنجا که مردم کشور های مختلف از سرعت اینترنت یکسانی برخوردار نمی باشند استفاده از ویدیو Hd با محدودیت مواجه است.

  • ساخت ویدیو HD باید با مهارت بالا و توسط متخصصان این رشته انجام شود تاجلوه ای متناسب در سایت ایجاد کند.
  • ویدیو HD باید دارای زمان مشخصی باشد که این زمان معمولا بینی 10 تا 30 ثانیه در نظر گرفته می شود.
  • در صورتی ویدیو شما دارای صوت می باشد بهتر است به طور پیشفرض بدون صدا در نظر گرفته شود.
  • توجه به فاکتور لود ویدیو نیز از اهمیت ویژه ای برخوردار می باشد. ویدیو شما باید دارای سرعت لود مناسبی باشد.
  • بعضی از صفحات نمایشی قابلیت نمایش HD را ندارند در نتیجه شما باید روش هایی برای این نوع کار بران نیز در نظر بگیرید.

طراحی سایت با استفاده از انیمیشن HD

یکی از تکنیک هایی که ممکن است در آینده در طراحی سایت و طراحی فروشگاه اینترنتی رواج بیشتری پیدا کند استفاده از انیمیشن HD در هدر سایت می باشد. استفاده از انیمشن ها در گذشته رواج داشته است ولی درآینده استفاده از انیمیشن هایی که بر مبنای تصاویر HD ساخته شده است رواج خواهد یافت.

انیمیشن ها باید دارای طراحی ظریف و روان باشند و ساختاری یکپارچه داشته باشند. توجه به نوع کاربران سایت می تواند در طراحی انیمیشن مهم باشد. بکارگیری تکنولوژی SVG در ساخت المان های مختلف موجب کیفیت گرافیکی بسیار بالا در انیمیشن های امروز گشته است.

  • سعی کنید در حد امکان از انیمیشن های ساده استفاده کنید تا کاربران درک درستی از تصویر پس زمینه داشته باشند.
  • استفاده از رنگ های روشن و افکت های خاص در تصاویر می تواند کاربران بسیاری را تحت تاثیر قرار دهد.
  • استفاده از تصاویر با فرمت های با کیفیت بالا در ساخت انیمیشن ها مفید می باشد مانند vectors
  • از آنجایی که وجود صدا در بسیاری از انیمیشن ها موجب ناراحتی کاربران می شود در حد امکان برای انیمیشن خود صدا قرار ندهید.

وبسایت madebyfieldwork.com نمونه بسیار موفقی از بکارگیری انیمیشن با کیفیت HD در طراحی سایت است.