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

فریم ورک های موبایل 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 فریم ورک سنچا تاچ فریم ورک موبایل مقایسه فریم ورک های موبایل ویژگی های فریم ورک های موبایل برتر
مطالب مرتبط

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

مایکروسافت سخت در تلاش است برای مرورگر اج جایی در میان سایر رقبای خود پیدا کند. تبلیغاتی که در ویندوز ۱۰ نمایش داده می شوند، ادعا می کنند که مرورگر اج از مرورگرهای کروم و فایرفاکس امن تر است.

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

ابزارهایی که به صورت پیش‌فرض بر روی سی‌پنل نصب هستند، شامل وب‌سرور آپاچی، پی‌اچ‌پی، مای‌اس‌کیوال، پرل، پایتون و بایند (دی‌ان‌اس) می‌شود، همجنین ایمیل‌هایی که به صورت پیش‌فرض پشتیبانی می‌شوند شامل پاپ۳، اس‌ام‌تی‌پی، آی‌ام‌ای‌پی (قرارداد پیام‌گزینی) هستند. سی‌پنل بطور معمول به روی درگاه ۲۰۸۲ و به صورت اس‌اس‌ال بر روی ۲۰۸۳ قابل دسترسی است.

فعالیت استارتاپ پوشه بدین صورت می باشد که اگر شما برای کسب و کار خود اپلیکشینی راه اندازی نمودید و تمایل به ارسال اعلان (پوش نوتیفیکیشن – Push Notification) های مختلف و همچنین دریافت آمار دقیقی از اپلیکیشن خود داشته باشید می توانید از این سرویس استفاده نمایید.

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

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

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