توسعه وب فرانت‌اِند (Front-end web development) روشی است برای تبدیل داده‌ها به یک رابط کاربر گرافیکی، از طریق استفاده از HTMl , css , Javascipt به طوری که کاربران بتوانند آن داده‌ها را مشاهده و تعامل کنند. چالش مرتبط با توسعه قسمت فرانت اند این است که ابزارها و تکنیک‌های استفاده شده برای ایجاد فرانت اند یک وب سایت به‌طور مداوم تغییر می‌کنند و بنابراین برنامه‌نویس باید به‌طور مداوم از نحوه توسعه این زمینه آگاه باشد. هدف از طراحی سایت این است که اطمینان حاصل شود وقتی کاربران سایت را باز می‌کنند، اطلاعات را در قالبی که خواندن آن آسان و مرتبط باشد می‌بینند. این مسئله با این واقعیت که کاربران اکنون از طیف وسیعی از دستگاه‌ها با اندازه صفحه نمایش و وضوح متفاوت استفاده می‌کنند، باعث می‌شود طراح مجبور شود هنگام طراحی سایت این جنبه‌ها را در نظر بگیرد. آنها باید اطمینان حاصل کنند که سایت آنها در مرورگرهای مختلف (مرورگر متقابل)، سیستم عامل‌های مختلف (کراس پلتفرم) و دستگاه‌های مختلف (کراس دستگاه) به درستی ظاهر می‌شود، که این امر نیاز به برنامه‌ریزی دقیق از طرف توسعه دهنده دارد.

ابزاری که برای توسعه فرانت‌اند استفاده می‌شود

چندین ابزار و سیستم عامل مانند وردپرس جوملا در دسترس هستند که می‌توانند برای توسعه سمت فرانت‌اند وب‌سایت مورد استفاده قرار گیرند.

اچ‌تی‌ام‌ال

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

سی‌اس‌اس

سی‌اس‌اس یا شیوه‌نامه آبشاری (نگارش سند)، جنبه ارائه سایت را کنترل می‌کند و به سایت شما اجازه می‌دهد ظاهر منحصر به فرد خود را داشته باشد.

جاوا اسکریپت

جاوا اسکریپت یک زبان برنامه نویسی مبتنی بر رویداد است (برخلاف مدل برنامه نویسی اعلانی اچ‌تی‌ام‌ال) که برای تبدیل یک صفحه اچ‌تی‌ام‌ال ثابت به یک رابط پویا استفاده می‌شود. کد جاوا اسکریپت می‌تواند با استفاده از مدل شی ءگرایی سند (DOM)، ارائه شده توسط استاندارد اچ‌تی‌ام‌ال، یک صفحه وب را در پاسخ به رویدادها (مانند تایپ در اینپوت توسط کاربر) تغییر دهد.

 

UI یا رابط کاربری چیست و به چه معناست؟

همانطور که پیشتر گفتیم، واژه‌ی UI خلاصه شده‌ی عبارت User Interface می‌باشد که در زبان فارسی آن را با عنوان رابط، واسط یا نمای کاربری می‌شناسیم.

رابط کاربری شامل المان‌های دیداری یک محصول می‌شود، به عنوان مثال در یک وبسایت یا اپلیکیشن، تمام تصاویر به کار رفته، رنگ‌بندی‌ها، طراحی ظاهری دکمه‌ها و… می‌توانند در بردارنده‌ی مفهوم UI باشند.

طراحان رابط کاربری یا UI Designer‌‌ها وظیفه‌ی ایجاد یکپارچگی و زیباسازی ظاهری یک محصول، برنامه یا وبسایت را بر عهده دارند.

UX یا تجربه‌ی کاربری چیست و به چه معناست؟

اصطلاح UX مختصر شده‌ی عبارت User eXperience می‌باشد که می‌توان آن را تجربه‌ی کاربری معنا کرد، این مورد را می‌توان تمام عواطف، احساسات و تجربه‌ی کاربر از کارکردن با یک محصول دانست، باید بدانیم طراحی تجربه‌ی کاربری بسیار گسترده بوده و خود می‌تواند در بردارنده‌ی UI نیز باشد.

 UI و UX چه تفاوتی با هم دارند؟

حتما تا به حال با تفاوت‌های UI و UX آشنا شده‌اید، در ادامه به طور خلاصه به بررسی این مورد می‌پردازیم:

  • UI و UX دو مفهومی هستند که معمولا توسط افراد تازه‌کار با هم اشتباه گرفته می‌شوند، همانطور که پیش‌تر گفتیم واژه‌ی UI مخفف User Interface و به معنای رابط کاربری و واژه‌ی UX مختصر شده‌ی عبارت User Experience و به معنای تجربه‌ی کاربری می‌باشد.
  • UI به مطالعه‌ی طراحی ظاهری محصول می‌پردازد، در حال UX جنبه‌های عاطفی و احساسات کاربر را نیز در بر می‌گیرد، بنابراین UI یکی از زیر مجموعه‌های UX است.
  • UI و UX به طور قابل توجهی مکمل یکدیگر هستند و برای ایجاد یک تجربه‌ی کاربری دلنشین و لذت‌بخش وجود هر دوی آن‌ها لازم و ضروری بوده و نمی‌توان یکی را بر دیگری ارجح دانست.
  • طراحی UI یک محصول بیشتر به سلیقه‌ی طراح بستگی دارد، در حالی که در طراحی UX باید سلیقه، عواطف و فرهنگ کاربران را در نظر گرفت.

کاربر پسند بودن رابط کاربری به چه معناست؟

یک طراحی کاربر پسند (User Friendly) یعنی تمام اجزا و المان‌های سایت یا برنامه به خوبی کار کرده، در جای صحیح خود قرار داشته باشند و همچنین کاربر بتواند به راحتی با طرح ارتباط برقرار کرده و نیاز او هنگام کار با سیستم فراهم شود.

به عنوان مثال اگر بخواهیم یک سایت را باهم بررسی کنیم، مواردی مانند واکنش‌گرا (ریسپانسیو) بودن سایت، محتوای با کیفیت، طراحی زیبا و چشم‌نواز، سرعت بارگذاری بالا، سادگی و شلوغ نبودن طرح از جمله مواردی هستند که می‌توانند از ویژگی‌های یک سایت کاربر پسند به شمار بیایند.

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

با مفاهیم UI و UX و تفاوت آن‌ها به خوبی آشنا شوید (با مثال‌های ساده)

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

منبع:همیارآیتی

ویکی پدیا