طراحی وب سایت با رابط کاربری مناسب
توسط مجید احدی
رابط کاربری جدا از بحث وب سایت در کل رابطی است بین انسان و ماشین (در اینجا منظورم از ماشین همان کامپیوتر است) حتی در ماشین‌های لباس‌شویی هوشمند که یک صفحه نمایشگر کوچک دارند و قابل برنامه ریزی نیز هستند یک رابط کاربری وجود دارد که شامل همان اجزای قابل مشاهده در صفحه نمایشگر آن و دکمه‌های روی ماشین است.
در وب سایت‌ها هم تقریباً به همین صورت است. شما با کمک اجزای گرافیکی، دکمه‌ها و آلمان‌های موجود در وب سایت یک سری کارها را انجام می‌دهید مثلاً یک دیدگاه در پایین همین مطلب ارسال می‌کنید. آن بخش‌هایی که شما نام و ایمیل خودتان را وارد می‌کنید، آن دکمه‌ای که فشار می‌دهید، آن قسمتی که دیدگاه شما و دیگر خوانندگان به نمایش گذاشته می‌شود، لینک‌های بالای سایت و هر بخشی که گرافیکی و قابل روئیت باشد و موجب تعامل و برقراری ارتباط بین شما و پایگاه داده یا سرور وب سایت بشود را رابط یا واسط کاربری می گوییم.
چرا رابط کاربری مهم است؟
از دید مدیران و طراحان وب سایت رابط کاربری واسطی است بین مدیر وب سایت و اهداف آن وب سایت؛ یعنی اگر هدف آن سایت فروش محصولات دیجیتال است بنابراین رابط کاربری واسطی می‌شود بین کاربران آن سایت و فروش محصولات دیجیتال.
حال اگر آن رابط کاربری ضعیف باشد و نقش واسطه گری اش، نقش میانجی گری اش را میان کاربر و هدف به خوبی ایفا نکند آنگاه در رسیدن به هدفمان شکست خواهیم خورد.
مشخصه های رابط کاربری ضعیف؟
یعنی کاربر برای انجام یک کار ساده، برای خرید یک محصول زیادی پیچ و تاب بخورد و نتواند به خوبی با وب سایت تعامل داشته باشد یا به خوبی فرایند مورد نظرش را انجام دهد مثلاً فونت دکمه‌ها ریز باشد و او نتواند ببیند چه نوشته یا فرم‌های تکمیل مشخصات در مرورگر کاربر به هم بریزد و نظم و ساختار مشخصی نداشته باشد.
در کل اگر رابط کاربری سایت نظر کاربر را جلب نکند و آن‌قدر مشکل داشته باشد که کاربر سریع سایت را ببندد آنگاه خواهیم گفت رابط کاربری ضعیف است.
ویژگی‌های رابط کاربری خوب چیست؟
- رابط کاربری باید به گونه‌ای باشد که هر کاربری با هر سنی که داشته باشد بتواند با وب سایت کار کند. چه یک نوجوان چه یک سالمند.
- طراحی باید به گونه‌ای باشد که فرایندهای ارائه خدمات به کاربر با کمترین پیچیدگی باشد.
- رابط کاربری باید به گونه‌ای باشد که وب سایت در هر دستگاهی با هر اندازه‌ای که باز می‌شود به خوبی نمایش داده شود و کاربر بتواند به راحتی با آن کار کند (طراحی ریسپانسیو)
- رابط کاربری باید به گونه‌ای باشد که هر کاربری با هر سطح سوادی بتواند بدون مشکل با وب سایت کار کند. چه یک نفر با تحصیلات زیر دیپلم و چه یک نفر با تحصیلات تکمیلی.
- رابط کاربری باید به گونه‌ای باشد که اگر کاربری با یک کامپیوتر و مرورگر قدیمی هم وارد سایت شد بتواند فرایند مورد نظرش را به خوبی انجام دهد.
- رابط کاربری باید نه زیاد شلوغ باشد و نه زیاد ساده. بلکه در عین سادگی زیبا باشد.
- در طراحی رابط کاربری از قواعد روانشناسی استفاده شده باشد.
- رنگ بندی‌ها باید به گونه‌ای باشد که چشمان بازدید کننده اذیت نشود.
- و دیگر مواردی که یک طراح وب سایت طی تجربه با آنها آشنا خواهد شد.
از رنگ ها و تضادها استفاده کنید
یکی دیگر از فاکتورهای طراحی (UI) انتخاب صحیح رنگ می باشد. هرچند که روانشناسی رنگ ها یک علم بسیار گسترده است که شرح آن در حوصله این بحث نمی گنجد اما ما در نظر داریم تا توضیحی پیرامون کاربرد رنگ ها و تاثیر آن ها در طراحی یک رابط فوق العاده ارائه دهیم:
رنگ ها می توانند در رساندن یک سلسله مراتب دیداری، ایجاد رابطه بین عناصر و به طور کلی بالابردن کیفیت طراحی وب سایت شما و نگه داشتن توجه مخاطب بر آن تاثیر به سزایی داشته باشند.
یک قانون کلی که شما می توانید در طراحی رابط خود در نظر بگیرید، این است که رنگ های تیره تر وزن بصری بیشتری را با خود حمل می کنند بنابراین اگر برای المانی از رنگ های تیره استفاده می کنید، باید برای جزئیات آن رنگ های روشن به کار برید تا این تضاد باعث ایجاد تعادل بین آنها شود.
فرایند مسیریابی را ساده‌سازی کنید
هنگام طراحی سایت سعی کنید آن را تا حد امکان ساده و کاربردی نگه دارید. هر صفحه را با اسم مناسب نام‌گذاری کنید و مطمئن شوید که زیرشاخه‌ها تحت سرشاخه‌های مناسب قرار گرفته‌‌اند. یکی از بهترین ابزارها برای بهبود روند مسیریابی، استفاده از نوارهای مسیریابی است. نوارهایی در بالا و یا طرفین صفحه سایت که سرشاخه‌ها و زیرشاخه‌های آنها را به صورت یک‌جا در اختیار کاربر قرار می‌دهند و امکان دسترسی به صفحات اصلی را برای کاربر فراهم می‌کنند. با این وجود، اگر صفحات متعددی دارید، بهتر است نوار مسیریابی را زیاد شلوغ نکنید. یادتان باشد:«سایت را ساده و کاربردی نگاه دارید».
لوگوی سایت را در جای مناسب قرار دهید
در استاندارد جهانی معمولاً رایج است که لوگو را در بالا و سمت چپ قرار می‌دهند. البته در سایت‌های فارسی گاهی لوگو را بالا و سمت راست قرار می‌دهند. دلیل این تفاوت تا حدی به شیوه متفاوت نگارش در زبانی فارسی نسبت به لاتین بازمی‌گردد(راست به چپ و چپ به راست). با این وجود، سعی کنید همیشه لوگوی شما قابل مشاهده باشد؛ این‌گونه، شما مدام درحال یادآوری خودتان به کاربر هستید و او محتوایی را که مطالعه می‌کند به شما نسبت می‌دهد. هم‌چنین لوگوی شما باید به صفحه اصلی لینک شده باشد تا کاربر هرکجای سایت که بود با یک کلیک بتواند به صفحه اصلی بازگردد.
اضافه کردن قابلیت جستجو به وب سایت
مطمئن شوید که کاربرانتان راه سریعی برای دست یافتن به اطلاعات مورد نیازشان دارند. نوار جستجو هم به سایتتان اضافه کنید. نوار جستجو معمولاً در بالای سایت و در سمت مقابل لوگو قرار می‌گیرد.
کاربران را از جایی که در آن هستند و جایی که لازم است بروند مطلع کنید
روی نوار مسیریابی صفحه‌ای را که کاربر در آن است مشخص کنید، طوری که از باقی صفحاتی از سایتتان که از طریق نوار مسیریابی قابل دست‌یابی است متمایز باشد. هم‌چنین می‌توانید از مسیرهایی استفاده کنید که کاربران را به صفحه‌ای خاص راهنمایی کنند. این کار با استفاده از لینک‌های «دعوت به عمل» امکان‌پذیر است. این لینک‌ها به کاربر پیشنهاد می‌دهند که از صفحه فعلی به کجا برود. لینک‌هایی نظیر «سفارش دهید»، «دانلود»، «با ما تماس بگیرید» و… چنین کاربردهایی دارند.
از محتوای دقیق و ساده استفاده کنید
به کار بردن ادبیات تخصصی به نحوی که نشان دهد در زمینه فعالیتتان تخصص دارید خوب است، اما زیاده‌روی در آن تا حدی که خواننده را گیج و مبهوت نماید احتمالاً یک ضرر بزرگ برای کسب‌وکارتان خواهد بود. هنگامی که محتوا تولید می‌کنید، در نظر داشته باشید که استفاده از کلمات کلیدی به نحوی که باعث شود مراجعه‌کنندگانتان نسبت به موضوع مورد بحث احساس راحتی کنند، باعث ایجاد اعتماد نسبت به برند شما می‌شود.
از عکس‌ها و ویدیوها طوری استفاده کنید که بر اثرگذازی متن بیافزایند
عکس‌ها و ویدیوهایی را که در سایتتان به کار می‌برید با دقت انتخاب کنید. اطمینان حاصل کنید که از کیفیت مناسب برخوردارند و سعی کنید از به کار بردن تصاویر عمومی که ممکن است در سایت‌های دیگر هم پیدا شود خودداری کنید. هم‌چنین وجود تصاویر و عناصر بصری بیش از حد، مخاطب را گیج می‌کند و تمرکز او را از بین می‌برد. و در نهایت، وقتی می‌خواهید از انیمیشن استفاده کنید، مجدداً در نظر داشته باشید که تعداد زیادی از اجزای متحرک نیز کاربر را گیج می‌سازد.
بازخوردهای مخاطبین خود را در نظر بگیرید
یک نکته بسیار مهم دیگر که نباید از نظر دور شود، کاربردی بودن رابط ها است. و یکی از بزرگترین مزایای پروژه های طراحی وب سایت این است که شما با طراحی پیام های بازخوردی ، اطلاعات بسیار ضروری را هنگامی که کاربر عملی روی سایت انجام می دهد به او منتقل کنید.
به عنوان مثال:
اگر موردی در سایت در حال بارگزاری است، با استفاده از یک انیمیشن ساده به کاربر خود اطلاع دهید که چه میزان از بارگزاری باقی مانده است، و یا اینکه اگر کاربر احساس کرد مشکلی در سایت پیش آمده و یا مساله ای اشتباه رخ داده است با نمایش یک پیغام به او نشان دهید که اشکال دقیقا از کجاست.
در دسترس قرار دادن اطلاعات تماس با شرکت
شما می‌خواهید که مراجعینتان با شما تماس بگیرند، پس انجام این کار را برایشان راحت کنید. آدرس پست الکترونیک و یا شماره تماستان را در تمام صفحه‌ها(ترجیحاً در فوتر یا نوار پایینی سایت) قرار دهید. یک فرم «تماس با ما» طراحی کنید، تا مراجعین بتوانند به راحتی و بدون زحمت فراوان از طریق پر کردن آن با شما تماس بگیرند.
کلمات کلیدی یا لینک‌ها را متمایز سازید
پررنگ‌تر کردن برخی کلمات یا عبارات از طریق بزرگتر نوشتن آنها، با القای این حس که آنچه می‌خوانند مهم است، باعث می‌شود توجه و تمرکز خواننده متوجه آن کلمه یا عبارت گردد. لینک‌ها باید متفاوت باشند تا بتوانند توجه خواننده را جلب کنند؛ هم‌چنین بهتر است مقصد لینک‌ها در صفحه‌ای مجزا باز شود تا مراجعینتان سایتتان را با دنبال کردن یک لینک ترک نکنند.
و در نهایت همیشه در نظر بگیرید که سایت شما باید در تمام دستگاه‌ها قابل مشاهده باشد.
اگر قرار باشد در ساختمانی از مخاطبان، مشتریان و طرفدارانتان پذیرایی کنید، قطعاً تلاش می‌کنید ساختمان را طوری آماده کنید که آنها بعد از مراجعه، نه تنها خودشان تمایل به تکرار مجدد تجربه بازدید از ساختمان شما را داشته باشند، بلکه اطرافیانشان را نیز به بازدید تشویق کنند.
حکایت سایت شما هم تفاوتی با چنین ساختمانی ندارد. در دنیای امروز که اینترنت راهش را تا عمق زندگی اکثریت مردم باز کرده، سایت شما ویترین شماست و ویترین شما باید تصویری مناسب از شما ارائه کند. پس طراحی وب‌سایت را سرسری نگیرید. طراحی وب‌سایت یک فرایند مهم، تأثیرگذار و نیازمند تخصص است.
برای طراحی سایت همیشه به این موضوع فکر کنید که سایت شما باید براحتی قابل استفاده و قابل مسیر یابی باشد، برای مخاطبان از رنگ های صحیح در طراحی آن استفاده شده باشد، از فونت های مناسب بهره بگیرد، از پیام های بازخوردی مفید استفاده کند و در مجموع ثابت و پایدار باقی بماند.
مجید احدی
مجید احدی هستم، تولید کننده محتوا برای سایت، قبلا در زمینه تعمیرات موبایل و مدتی هم در زمینه دوربین های مداربسته فعالیت داشتم. در حال حاضر مدتی هست که به حوضه فناوری اطلاعات علاقه مند شدم در حال حاضر به عنوان تولید کننده محتوا و ویرایشگر سایت فعالیت می کنم.
مطالب پیشنهادی
روش هایی جهت حفظ رتبه در موتورهای جستجو
25 مهر 1396