Kaptain Kitty
انتشار :۱۷ اسفند ۱۳۹۳
بازدید :1123 بار

فریم ورک های موبایل Html5

فریم ورک های موبایل Html5

در پاسخ به بازار رو به رشد موبایل اپلیکیشن ها، چند فریم ورک HTML5 برای UI موبایل اکنون در دسترس برنامه نویسان قرار دارد، تا در خلق اپلیکیشن های جذاب و واکنش گرا (responsive) بهتر عمل کنند و در نهایت موبایل وب اپلیکیشن های حرفه ای تری را ایجاد نمایند.

این فریم ورک ها این امکان را به برنامه نویسان وب می دهند تا با استفاده از تکنولوژی و مهارت هایی که کاربران با آنها آشنایی دارند، تجربه ی کاربری فوق العاده ای را برای اپلیکیشن های خود ایجاد کنند.

بهترین فریم ورک های UI/UX در این زمینه شامل App Framework، Twitter Bootstrap 3، jQuery Mobile، Sencha Touch، Kendu UI و TopCoat می باشد که هر کدام از این فریم ورک ها مجموعه ای منحصر به فرد از ویژگی های فوق العاده را در اختیار برنامه نویسان جهت ایجاد اپلیکیشن های فوق العاده قرار می دهند.

فریم ورک UI چیست؟

فریم ورک های HTML5 برای UI موبایل، کتابخانه هایی هستند که برنامه نویسان را قادر می سازند تا به راحتی تجارب کاربری حرفه ای را برای اپلیکیشن های HTML5 خود ایجاد کنند. این کتابخانه ها شامل یک یا چند فایل هستند و با استفاده از جاوا اسکریپت و CSS نوشته شده اند. هدف از ایجاد آنها استفاده در فایل های HTML می باشد. آنها برای کاربرد های مختلفی مناسب هستند.

تمام این پلتفرم ها برای ایجاد موبایل وب اپلیکیشن ها و همچنین اپلیکیشن های هایبریدی native مناسب هستند که در آنها یک ابزار تبدیل کننده ی native این امکان را ایجاد می کند که کل ساختار برنامه با استفاده از HTML5 هدایت شود.

این اپلیکیشن های هایبرید (چند پلت فرمی) با استفاده از یک تکنولوژی واسط مانند Cordova ساخته می شوند تا امکان دسترسی اپلیکیشن های HTML5 را به ویژگی های native هر دستگاه مانند دوربین، از طریق API و رابط جاوا اسکریپتی فراهم کنند.

 

رابط کاربری جذاب ionic

نمایی از فریم ورک های حرفه ای موبایل HTML5 که قابلیت هایبرید دارند

 

علت استفاده از فریم ورک های HTML5 برای UI موبایل اپلیکیشن

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

فریم ورک های HTML5 Mobile UI می توانند به اپلیکیشن ها، ظاهری یکپارچه و احساسی حرفه ای ببخشند که این موارد در روش های غیر فریم ورکی به ندرت دیده می شود.

برخی از فریم ورک های HTML5 Mobile UI حتی با توجه به پلتفرمی که بر روی آن اجرا می شوند، می توانند سازگار شوند تا حسی را به کاربر القا کنند که برای سیستم عامل مورد استفاده ی کاربر customize شده باشد.

شباهت این فریم ورک ها به یکدیگر

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

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

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

 

فریم ورک ionic

نمایی از فریم ورک قدرتمند موبایل Html5 به نام ionic

 

اکثر این فریم ورک ها بر اساس jQuery یا یک موتور جاوا اسکریپتی کوئری سلکتور با استایل jQuery کار می کنند. کوئری سلکتور یک کتابخانه ی جاوا اسکریپتی است که به فریم ورک اجازه ی انتخاب المان ها و تغییر در DOM را می دهد. بدون وجود کوئری سلکتور، فریم ورک هایی که نیاز به کوئری سلکتور دارند عملکردی مناسبی نداشته و یا اصلا کار نمی کنند.

این فریم ورک های با کمی استثناء، پشتیبانی جاوا اسکریپت را برای scroll کردن در المان های HTML و همچنین متحرک ساختن جا به جایی بین صفحات فراهم می کند. علاوه بر این، هریک از این فریم ورک ها راهی را برای نمایش المان های اصلی راهبری (navigation) و امکاناتی برای ایجاد یک اپلیکیشن با استفاده از مهارت های برنامه نویسی وب مانند HTML5، CSS3 و JavaScript، در اختیار برنامه نویسان قرار می دهد.

این فریم ورک ها همگی شامل متد هایی برای بارگذاری داده از وب به صورت داینامیک و با استفاده از تکنیک های غیر همزمان برای دریافت داده با فرمت XML یا JSON هستند. با ایجاد دسترسی به منابع موجود بر روی اینترنت، این فریم ورک ها برنامه نویسی را سرعت بخشیده و قابلیت های ممکن برای موبایل اپلیکیشن های HTML5 را توسعه می دهند.

 

فریم ورک سنچا تاچ

فریم ورک قدرتمند Sencha Touch

 

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

تمام این فریم ورک ها از رویداد های touch و همچنین رویداد های click بهره می برند که امکان استفاده ی آنها را در دستگاه های موبایل و همچنین دستگاه هایی که با ماوس کار می کنند، میسر می سازد. بسیاری از فریم ورک ها دقت بالایی در اندازه های مناسب المان های HTML برای فعال سازی لمسی دارند.

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

تفاوت این فریم ورک های با یکدیگر

اگرچه مثال هایی که از فریم ورک های HTML5 Mobile UI در بالا گفته شد از جهات مختلفی بسیار شبیه به یکدیگر هستند اما هنوز هم تفاوت های چشمگیری با یکدیگر دارند. در این جا مقایسه ی کوتاهی از قدرت App Framework، Twitter Bootstrap 3، jQuery Mobile، Sencha Touch، Kendo UI و TopCoat را ارائه می دهیم.

قسمت دوم این مقاله را در لینک زیر دنبال کنید:

مقایسه ی فریم ورک های موبایل HTML5 از دید UI  – قسمت دوم

 

آموزش برنامه نویسی موبایل وب آموزش جی کوئری موبایل انواع فریم ورک موبایل html5 طراحی responsive طراحی برای موبایل وب اپلیکیشن طراحی ریسپانسیو فریم ورک sencha touch فریم ورک سنچا تاچ فریم ورک موبایل مقایسه فریم ورک های موبایل ویژگی های فریم ورک های موبایل برتر
مطالب مرتبط

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

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

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

ایجاد و حفظ ارتباط همیشه یکی از دغدغه‌های بشر بوده است. امروزه دنیا به گونه‌ای شده است که وقتی شما در محل کارتان حاضرید، عده‌ی دیگری از همکارانتان در منزل مشغول کار هستند. ما ابزار‌های مختلفی را برای حفظ ارتباط میان اعضای تیم امتحان کردیم که اولین ابزار AOL Instant Messenger بود. بعد از آن […]

نظراتتان را برایمان بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

مطالب ما تو این شبکه های اجتماعی هم پخش میشه