نوشته شده توسط : امامی

Flexbox یک روش طرح بندی یک بعدی برای قرار دادن آیتم ها در سطر یا ستون است. آیتم هایی انعطاف پذیر برای پر کردن فضای اضافی و کوچک برای تناسب در فضاهای کوچکتر. این مقاله تمام اصول را توضیح می دهد.

پیش نیازها: مبانی HTML (مطالعه HTML) و چگونگی کار با CSS (مطالعه CSS).

هدف: یادگیری نحوه استفاده از سیستم Flexbox برای ایجاد طرح بندی در طراحی وب سایت.

چرا Flexbox ؟

برای مدت زمان طولانی، تنها ابزار قابل اعتماد و سازگار با مرورگر های موجود CSS بود که شامل چیزهایی مانند floats و positions بود. استفاده از آن ها خوب است اما در بعضی موارد آنها نیز محدود و خسته کننده هستند.

flex سایت 

الزامات طرح بندی زیر ساده است که همیشه راحت و انعطاف پذیر بوده و طراحان با چنین ابزارهایی در طراحی وب سایت دست و پنجه نرم می کنند:

  • یک بلاک به صورت عمودی درون بلاک مادر خود قرار می گیرد.
  • ساختن همه بچه های یک کانتینر به همان اندازه عرض/ ارتفاع، بدون در نظر گرفتن این که چقدر عرض / ارتفاع در دسترس است.
  • ساخت تمام ستون ها در طرح بندی ستون های چندگانه، حتی اگر دارای محتوا متفاوت باشند، همان ارتفاع را می پذیرند.
  • همانطور که در بخش های بعدی مشاهده خواهید کرد، flexbox باعث می شود بسیاری از وظایف طرح بسیار ساده تر شود.

یک مثال ساده از Flexbox

در این مقاله ما قصد داریم شما را از طریق یک سری تمرینات نسبت به درک چگونگی کارکرد flexbox آشنا نماییم. برای شروع، شما باید یک کپی از اولین فایل استارت خود مثلا flexbox0.html در github خود را بسازید. حال آن را در یک مرورگر مدرن (مانند فایرفاکس یا کروم) بارگذاری کنید و نگاهی به کد ها در ویرایشگر خود داشته باشید.

خواهید دید که ما دارای یک عنصر <header> با عنوانی در داخل آن هستیم و عنصر <section> حاوی سه تگ <article> است. ما قصد داریم از این ها برای ایجاد طرح سه ستونه نسبتا استانداردی استفاده کنیم.

flexbox در طراحی وب سایت 

مشخص کردن عناصر Flexbox

برای شروع، ما باید انتخاب کنیم که کدام عناصر باید در Flexbox قرار داده شوند. برای انجام این کار، مقدار خاصی از display را برای عناصر والد عنصری که قصد کار روی آن را دارید، تنظیم کنید. در این مورد ما می خواهیم عناصر <article> را بگذاریم، بنابراین ما آن را در <section> قرار می دهیم (که یک کانتینر انعطاف پذیر می شود):

طراحی سایت نتیجه مانند زیر است:

 

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

نکته: همچنین شما می توانید یک مقدار display را برای inline-flex ها تنظیم کنید تا انعطاف پذیر شوند. 

هنگامی که عناصر در FlexBox قرار می گیرند، آنها در امتداد دو محور خواهند بود:

محور های FlexBox 

محور اصلی محوری در حال حرکت در جهت آیتم های FlexBox است (به عنوان مثال ردیف های در عرض صفحه یا ستون ها در طول صفحه). شروع و پایان این محور، شروع و پایان اصلی است.
محور متقاطع، محوری است که عمود بر مسیر قرار گرفته است که آیتم های FlexBox در آن قرار داده شده است. شروع و پایان این محور، شروع و پایان متقابل است.
عنصر والدی که نمایش داده شده است: Flex آن را تنظیم می کند ( مانند <section> در مثال بالا)، که flex container نامیده می شود.
آیتم هایی که در FlexBox های درون یک flex container قرار می گیرند، flex container (عناصر <article> در مثال ما) هستند.
این اصطلاح را در ذهن داشته باشید که در بخش های بعدی بیشتر از آن می شنوید.

ستون یا ردیف؟

Flexbox یک خاصیت جدیدی به نام flex-direction را فرآهم آورده است که مشخص می کند که کدام مسیر در محور اصلی قرار دارد (فرزندان درون FlexBox در کدام مسیر قرار گرفته اند.) به طور پیش فرض آنها را در یک ردیف در جهت زبان پیش فرض مرورگر شما (در سمت راست به چپ در مرورگر فارسی) کار می کنند.

سعی کنید کد زیر را به قوانین سکشن های خود اضافه کنید:

;flex-direction: column

شما همچنین می توانید با استفاده از مقادیر column-reverse و row-reverse آیتم های FlexBox را در جهات معکوس نیز قرار بدهید.

زمانی رخ که شما مقدار مشخصی از عرض یا ارتفاع را در طرح خود داشته باشید، در نهایت ظرفیت فرزندان flexbox شما سرازیر خواهد شد و طرح را خراب می کند. نگاهی به مثال flexbox-wrap0.html خود بیاندازید و سعی کنید آن را به صورت زنده ببینید:

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

;flex-wrap: wrap

حال نتیجه وب سایت به صورت زیر خواهد شد:

flexbox

سایز آیتم های FlexBox

اکنون به اولین مثال بازخواهیم گشت و نگاهی به چگونگی کنترل فضا برای آیتم های FlexBox می پردازیم. فایل خود را از flexbox0.html کپی کنید یا یک نسخه از flexbox1.html را به عنوان یک نقطه شروع جدید در نظر بگیرید.

ابتدا، کد زیر را به پایین CSS اضافه کنید:

مثال Flex

این مقداری نسبی و بدون واحد است که تعیین می کند که چقدر از فضای موجود در محدوده اصلی هر یک از آیتم های FlexBox را در بر می گیرد. در این مورد، ما هر عنصر <article> را مقدار 1 می دهیم، به این معنی که همه آنها مقدار مساوی از فضای سمت چپ را پس از چیزهایی مانند padding و margin خواهند داشت.

اکنون کد های زیر را اضافه کنید:

 مقدار عناصر وب سایت 

در حال حاضر زمانی که شما به روزرسانی می کنید، خواهید دید که سومین <article> دو برابر بیشتر از عرض در دسترس سایر آیتم ها دارد. دو آیتم اول FlexBox، هر کدام از آنها یک چهارم برابر فضای موجود کل را دارند. سومین آیتم دارای دو واحد است، بنابراین 2/4 فضای موجود را دارد.

شما همچنین می توانید با استفاده از کد زیر مقدار حداقل اندازه در داخل FlexBox  ها را نیز مشخص کنید:

کد ها طراحی 

این اساسا این موضوع را بیان می کند: "هر آیتم  FlexBox در اولین بار 200 پیکسل از فضای موجود به آن داده می شود. بعد از آن، بقیه فضای موجود بر اساس واحد های نسبت به هم تقسیم می شوند. این را امتحان کنید و طراوت و تفاوت در نحوه اشتراک فضا را ببینید.

flex در طراحی وب 

سازگاری با مرورگر ها

پشتیبانی Flexbox در اکثر مرورگرهای جدید مانند Firefox، Chrome، Opera، Microsoft Edge و IE 11، نسخه های جدیدتر Android / iOS و غیره انجام می شود. با این حال، باید بدانید که مرورگرهای قدیمی نیز هنوز هستند که استفاده می شوند و طراحی سایت با Flexbox را پشتیبانی نمی کنند.

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

مشخصات Flexbox کمی پیچیده تر از برخی از ویژگی های CSS است. به عنوان مثال، اگر یک مرورگر یک سایه CSS را از دست بدهد، احتمالا هنوز سایت قابل استفاده است. با این حال ویژگی های flexbox این را پشتیبانی نمی کنند و احتمالا یک طرح را به صورت کامل خراب و آن را غیر قابل استفاده می کنند.

منبع: سایت nopardazco.com

ترجمه از سایت developer.mozilla.org

 



:: برچسب‌ها: FLEXBOX در طراحی وب,FLEXBOX در طراحی سایت,FLEXBOX ,
:: بازدید از این مطلب : 181
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
تاریخ انتشار : سه شنبه 26 تير 1397 | نظرات ()
نوشته شده توسط : امامی

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

طراحی اپلیکیشن Native و Hybrid چیست؟

در این مقاله قصد داریم مطالبی را درباره ی انواع مختلف اپلیکیشن موبایل، بیان کنیم.

تقسیم بندی اپلیکیشن های موبایل 

بطور کلی اپلیکیشن های موبایل به سه دسته تقسیم می‌شوند :

۱ – اپلیکیشن های Native    ( Native App )

۲ – اپلیکیشن های Web       ( Web App )

۳ – اپلیکیشن  هایHybrid   (Hybrid App  )

۱ – اپلیکیشن های Native  چیست؟

در ساخت نرم افزارهای Native برای برنامه نویسی، از زبان اصلی سیستم عامل استفاده می شود. برای ساخت نرم افزار های اندروید، از زبان برنامه نویسی Java و برای ساخت نرم افزارهای آیفون از زبان برنامه نویسی Objective-C استفاده می شود. بازدهی بالای نرم افزارهای Native بزرگ ترین مزیت آن هاست که شامل افکت‌های انیمیشن، روان کار کردن بخش‌ های مختلف برنامه، امکان استفاده از multi touch و خیلی موارد دیگر است. همه ی این موارد به دلیل دسترسی مستقیم به موقعیت‌ های حافظه و سخت‌افزار گوشی است.

اما ساخت این نرم افزار ها دشوار است و نیاز به این دارد که برای هر پلت فرم مختلف همانند اندروید، ios و ویندوز، برنامه نویسی و کد نویسی جداگانه ای انجام شود که این مورد نیاز به آشنایی کامل به برنامه نویسی دارد و همچنین بسیار زمان بر است. چرا که هر چند امکان دارد منطق و الگوریتم همگی یکی باشند اما مسلما SDK  و  APIهایی که برای هرکدام استفاده می‌ شود، متفاوت خواهند بود.

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

مزایا و معایب طراحی اپلیکیشن Native

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

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

طراحی اپلیکیشن Native و Hybrid چیست؟

۲ – اپلیکیشن های Web چیست ؟

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

دسترسی نداشتن به سخت افزار موبایل و تبلت، وابستگی به مرورگر و عدم امکان انتشار نرم‌افزار در مارکت‌ ها و app store ، از جمله معایب اپلیکیشن های Web است.

۳ – اپلیکیشن های Hybrid چیست ؟

طراحی این دسته از نرم افزار ها، ترکیبی از طراحی اپلیکیشن های Web و native است. اپلیکیشن های هیبرید همانند اپلیکیشن های Web‌ باید در مرورگر مشاهده شوند اما برای مشاهده برنامه، نیازی به مرورگر گوشی نیست و محتوای برنامه در قالب یک نرم افزار Native توسط WebView در اندروید و یا UIWebView  در  iOS، نمایش داده می شود. طراحی نرم افزار های هیبرید توسط HTML و CSS و JavaScript صورت می گیرد و پس از آن با استفاده از برخی از نرم افزار ها مانند Cordova به نرم‌افزار Native  تبدیل می‌شوند.

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

با نرم افزار Cordova می توان اپلیکیشن های هیبرید را بدون کد نویسی دوباره، در بستر های مختلف منتشر کرد.

همانند اپلیکیشن های Native، با استفاده از اپلیکیشن های هیبرید، به تمامی امکانات سخت‌افزاری دستگاه امکان دسترسی وجود دارد اما به دلیل این که کد های برنامه های هیبرید، باید با مرورگر پردازش شوند، بازدهی این اپلیکیشن ها از بازدهی اپلیکیشن های Native کمتر است.

همانطور که گفته شد، اپلیکیشن های هیبرید را می توان با یکبار کد نویسی، در بستر های مختلف منتشر کرد و هم چنین امکان دسترسی به تمامی امکاناتی که سیستم ‌عامل به برنامه نویس می‌دهد، وجود دارد. به علاوه اپلیکیشن های هیبرید، دارای  Pluginهای متعددی هستند.

طراحی اپلیکیشن Native و Hybrid چیست؟

اپلیکیشن های  Native یا  Hybrid

امروزه بیشتر اپلیکیشن های طراحی شده یا به صورت Native طراحی شده اند یا به صورت Hybrid. به همین دلیل، در این قسمت به مقایسه ی اپلیکیشن های  Native و  Hybrid می پردازیم.

در هر دو نوع اپلیکیشن های  Native و  Hybrid، امکانات و قابلیت ها شبیه به هم هستند اما در ​سرعت و بازدهی و نحوه ی کد نویسی با هم تفاوت دارند.

بازدهی نرم افزار های هیبرید کمتر از نرم افزار های Native است زیرا کد ها در مرورگر نرم افزار Native اجرا می شوند. اما سرعت کدنویسی در نرم افزار های هیبرید، بسیار بالاتر از نرم افزار های Native است.

 Hybrid یا Native  کدام یک بهتر است؟

چنانچه به زبان برنامه نویسی آشنایی کامل دارید، به سمت برنامه های Native بروید اما بدانید طراحی این اپلیکیشن ها بسیار زمان بر و سخت است ولی بازدهی این اپلیکیشن ها بسیار بالا تر است.

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

طراحی اپلیکیشن Native و Hybrid چیست؟

برای تولید نرم‌افزارهای Hybrid می‌توانید از ابزارهای زیر استفاده کنید :

  • Cordova
  • Phonegap
  • Xamarin
  • Appcelerator
  • RhoMobile
  • MoSync
  • Corona SDK
  • Ludei

نتیجه گیری

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

 


:: برچسب‌ها: طراحی اپلیکیشن Native و Hybrid,طراحی اپلیکیشن Native,طراحی اپلیکیشن Hybrid ,
:: بازدید از این مطلب : 132
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
تاریخ انتشار : چهار شنبه 20 تير 1397 | نظرات ()
نوشته شده توسط : امامی

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

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

اهمیت طراحی اپلیکیشن رزرو بلیط

یکی از کسب و کارهای مهم که داشتن یک اپلیکیشن موبایل، در روند رشد و توسعه آن کسب و کار، تأثیر زیادی دارد و به راحتی کاربران در استفاده از خدمات آن کسب و کار می افزاید، کسب و کار در زمینه فروش و یا رزرو بلیط است.

اما ویژگی های یک اپلیکیشن رزرو بلیط چیست؟ طراحی اپلیکیشن رزرو بلیط چگونه است؟ این ها سوالاتی هستند که صاحبان این نوع کسب وکار با آن ها روبرو هستند.

در این مقاله در رابطه با اهمیت طراحی اپلیکیشن رزرو بلیط و ویژگی هایی که باید داشته باشد، بحث خواهیم کرد و به سوالات بالا پاسخ خواهیم داد. اگر به دنبال رونق کسب و کار خود هستید، این مطالب را از دست ندهید.

طراحی اپلیکیشن رزرو بلیط

مزایای داشتن اپلیکیشن موبایل برای رزرو بلیط

داشتن یک اپلیکیشن برای رزرو بلیط، به طور کلی مزایای زیر را به دنبال خواهد داشت :

۱ – سبقت از رقبا در جهت فروش بیشتر بلیط. ۲ – ارتباط مداوم با مشتری. ۳ – به روز رسانی و مشاهده آنلاین و لحظه به لحظه ی بلیط های رفت و برگشت شهر های مختلف. ۴ – ارتباط دو طرفه با کاربر. ۵ – رضایت مندی بیشتر کاربران. ۶ – دستیابی به مشتریان بیشتر.

امکانات اپلیکیشن های رزرو بلیط

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

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

بخش های مختلف اپلیکیشن های رزرو بلیط

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

۱ – بخش معرفی : در این بخش که یکی از اولین بخش ها در طراحی یک اپلیکیشن رزرو بلیط است، باید به طور کامل به معرفی شرکت فروشنده بلیط پرداخته شود. گواهی نامه های کسب شده و استاندارد های لازم نیز در این بخش قرار داده می شود.

۲ – بخش ثبت نام : این بخش جهت ثبت نام کاربران در سایت ایجاد می شود که کاربران با وارد کردن مشخصات خود در اپلیکیشن، به راحتی یک پروفایل شخصی برای خود ایجاد می کنند و با نام خود وارد اپلیکیشن می شوند. وارد کردن شماره همراه کاربران در این بخش برای اطلاع کاربران از اطلاعات بعدی در هنگام رزرو و یا پیگیری رزرو بلیط و … بسیار اهمیت دارد.

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

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

۵ – بخش جستجو : بخش بسیار مهمی که در یک اپلیکیشن رزرو بلیط باید وجود داشته باشد، بخش جستجو آن هم از نوع پیشرفته است که کاربران بتوانند به راحتی با فیلتر کردن بلیط ها بر اساس شهرها و حتی قیمت ها و یا بلیط های زمینی و هوایی، بلیط مورد نظر خود را پیدا کنند.

۶ – بخش اطلاعات جاده ها و یا هواشناسی : در این بخش از اپلیکیشن رزرو بلیط، باید اطلاعاتی از وضعیت جاده ها و همچنین آب و هوای شهرهای مختلف در اختیار کاربران قرار گیرد.

طراحی اپلیکیشن رزرو بلیط

بخش های دیگر اپلیکیشن رزرو بلیط

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

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

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

تبلیغات در اپلیکیشن رزرو بلیط

برای افزایش درامد و رونق کسب و کار نیز می توان در اپلیکیشن رزرو بلیط، قسمتی را برای تبلیغات در نظر گرفت. در این بخش می توان با پذیرش آگهی از آگهی دهندگان مختلف، درامد اپلیکیشن را افزایش داد.

سخن آخر

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

 


:: برچسب‌ها: طراحی اپلیکیشن رزرو بلیط , طراحی اپلیکیشن رزرو , طراحی اپلیکیشن بلیط ,
:: بازدید از این مطلب : 147
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
تاریخ انتشار : پنج شنبه 14 تير 1397 | نظرات ()
نوشته شده توسط : امامی

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

اهمیت ناوبری در طراحی وب سایت چیست؟

چرا ناوبری بسیار مهم است:

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

اهمیت ناوبری در طراحی وب سایت

 بررسی وب سایت ها از طریق ناوبری

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

 

نکاتی درباره ناوبری در طراحی وب سایت

برخی نکات برای ناوبری وب سایت خوب عبارتند از:

  • ناوبری در سراسر وب سایت باید سازگار باشد.
  • آرم را به صفحه اصلی پیوند دهید.
  • سیستم ناوبری را در بالای صفحه و سمت چپ صفحه قرار دهید که شامل زبانه هایی مانند “درباره ما”، “تماس با ما”، “نقشه سایت” و سایر اطلاعات می باشد.
  • برای رساندن کاربرانتان به اطلاعات مقصدشان، تعداد کلیک ها را محدود کنید. سعی کنید طراحی به گونه ای باشد که کاربران بعد از حداکثر ۳ بار کلیک کردن بتوانند به اطلاعات لازم شان دست یابند.

     

    اهمیت ناوبری در طراحی وب سایت

    اهمیت ناوبری در طراحی وب سایت

  • در هنگام حرکت از یک صفحه وب به صفحه دیگر، ابزارها و نوارهای ناوبری باید در همه صفحات باقی بمانند. که معمولا این موارد در سمت چپ یا بالای صفحه قرار دارند.
  • ناوبری باید روشن، ساختار یافته و بصری باشد.
  • پیشنهاد می شود که بین ۴ تا ۱۵ لینک در نوارهای ناوبری داشته باشید.
  • در سایتتان پیوند به مقالات دیگر داشته باشید. این پیوندها شما را به سایر مقالات مرتبط در سایت هدایت می کند، و بازدیدکنندگان را تشویق به خواندن بیشتر می کند.
  • همیشه باید روی صفحه اصلی، برای هر صفحه پیوندی وجود داشته باشد. صفحه اصلی به طور کلی ایستگاه مرکزی است که در آن به تمام مناطق و صفحات دیگر وب سایت لینک و پیوند وجود دارد.
  • نقشه های سایت نیز بسیار مهم هستند، زیرا از آنها برای ارتباط با تمام صفحات موجود در وب سایت استفاده می شود.
  • امکانات جستجو همچنین یک راه عالی برای کشف وب سایت است. این موجب می شود خوانندگان شما دقیقا همان چیزی را که می خواهند جستجو کنند.
  • ابزارهای ناوبری یا نوارهای خود را در رنگ ها، متون و آیکون های مختلف تزئین کنید.  ضمن اینکه این موضوع را هم باید مد نظر قرار بگیرید که وب سایت شما ساده باشد.
  • ناوبری وب سایت شما باید ساده و واضح باشد. کاربر به راحتی باید بفهمد که آن ها چگونه کار می کند و او چگونه باید از آن استفاده کند.
  • طراحی ناوبری باید به گونه ای آشنا باشد این باعث می شود که کاربر هنگام بررسی وب سایت احساس اعتماد به نفس بیشتری داشته باشد.
  • از ساختارهای مشترک استفاده کنید. به این معنی که باید در صفحات مختلف، نوارها و ابزارهای ناوبری در سمت چپ یا بالای صفحه همانند هم باشند.
  • طراحی ناوبری را پیوسته، ساده و بدون تغییر نگه دارید.
  • تا جایی که می توانید پیش فرض ها را تغییر ندهید تا موجب سردرگمی کاربران نشود.
  • متنی را که لینک نیست برجسته نکنید.
  • آرایش ناوبری در طراحی وب سایت حاوی منوها، لینک های  hypertext، آیکون ها، دکمه ها و امکانات جستجو است.
  • ناوبری خوب استفاده عالی را به همراه دارد به این معنی که شما می توانید کمترین کلیک از وب سایت لذت ببرید و با آن ارتباط برقرار کنید.  کاربران باید بدون بازگشت به صفحه اصلی قادر به رفتن از یک صفحه به صفحه دیگر باشند.
  • دو نوع ناوبری وجود دارد:  ناوبری اصلی شامل پیوندهای مهم است. ناوبری ثانویه شامل زیر شاخه ها است.
  • به یاد داشته باشید، هر چه کلیک کمتر باشد بهتر است، بنابراین مطمئن شوید که سیستم ناوبری شما جامع، روشن و آسان برای استفاده است.

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

برگرفته از optimus01

 


:: برچسب‌ها: اهمیت ناوبری در طراحی وب سایت , ناوبری در طراحی وب سایت , ناوبری در طراحی سایت , ناوبری طراحی وب سایت ,
:: بازدید از این مطلب : 140
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
تاریخ انتشار : سه شنبه 12 تير 1397 | نظرات ()
نوشته شده توسط : امامی

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

در این مقاله اطلاعاتی را در همین رابطه در اختیار شما قرار خواهیم داد.

مشخصات یک سایت استارت آپ حرفه ای

چند مورد از مشخصات یک وب سایت استارت آپ حرفه ای به قرار زیر است :

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

استارت آپ 

چند نکته در طراحی یک سایت استارت آپ حرفه ای

برای این که شما یک سایت استارت آپ حرفه ای را طراحی کنید که به نحو احسن بتوانید خدمات خود را برای مشتریان معرفی کرده و مشتری بیشتری جذب کنید، نکاتی را در طراحی باید رعایت کنید که عبارتند از :

1 - ساده سازی : یک قانون در طراحی سایت استارت آپ هست به نام " هر چه کمتر، بهتر" . به این معنی که در طراحی سایت استارت آپ، باید المان های غیر ضروری را حذف کرد و یک محیط کاربری بسیار ساده را برای مشتری طراحی کرد.

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

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

3 - روند کار : روند کار برای کاربران در سایت های استارت آپ، باید ساده باشد. کلیک ها را کم کنید و کادر ها و گزینه هایی که کاربران برای ثبت نام باید تکمیل کنند را نیز کاهش دهید.

4 - کنتراست : متن های اصلی باید از پس زمینه ها یا سایر موارد، تیره تر باشد. طراحی باید به گونه ای باشد که فضای داخل سایت، زیاد شلوغ به نظر نرسد و حتی فاصله ی بین خطوط هم، باید بین 1.5 تا 1.75 تنظیم شود.

5 - تصاویر : برای جلب بیشتر مخاطبان، استفاده از عکس، بسیار ارزشمند تر از متن است. البته در انتخاب نوع تصاویر، باید مخاطبان سایت را به خوبی بشناسید و متناسب با سلیقه ی آن ها، تصاویری را در سایت قرار دهید. برای این کار باید گروه سنی، جنس، شغل و ... مخاطبان سایت را به خوبی بشناسید.

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

7 - برای تشویق کاربران جهت کلیک کردن روی یک باتن، پیشنهاد یک هدیه ویژه را بدهید. البته قبل از آن باید برای نوشتن باتن، از حروف بزرگ و تیره استفاده کنید.

8 - به کاربران نهایی ( مخاطبان هدف ) فکر کنید. برای این  کار شما باید کاربران هدف و نهایی خود را  کاملا بشناسید و برای این شناخت زمان بگذارید. شما سایتی که طراحی می کنید، برای مشتریان نهایی است نه برای خودتان. چرا که این مشتریان و مخاطبان هدف شما هستند که قرار است با سایت شما در ارتباط باشند و کار کنند. پس باید در طراحی سایت استارت آپ حرفه ای، تمام ذهن خود را روی مخاطبان هدف متمرکز کنید. برای موفق شدن در آینده، این نکته بسیار ضروری است.

9 - در طراحی سایت استارت آپ حرفه ای باید به این نکته دقت داشته باشید که مشتریان شما بیشتر به دنبال مزایا هستند تا ویژگی ها. همان طور که از جمله ی بی نظیر  Simon  Sinek TED " چطور رهبران بزرگ انجام عملی را به مردم القا می کنند " این مطلب کاملا برداشت می شود، شما باید کاری کنید که مردم بدانند چرا یک کاری انجام می دهید نه این که چه کاری را انجام می دهید. به عبارت دیگر شما باید در طراحی سایت استارت آپ حرفه ای خود، این گونه به مردم نشان دهید که خدمات شما مزایای فراوانی را برای مشتریان به دنبال خواهد داشت نه این که از ویژگی های کار خود و نحوه کار خود بگویید. آن ها هرگز به ویژگی ها اهمیت نمی دهند و به دنبال مزایا هستند.

10 - در آخرین نکته یک جمله مشهور از زبان Maya Angelou را بیان می کنیم :

" من آموخته ام که مردم آنچه شما می گویید را فراموش می کنند، آنها آنچه شما انجام می دهید را نیز فراموش می کنند اما آنها هرگز احساسی که داشته اند را فراموش نمی کنند " .

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

 سایت استارت آپ 

موارد ضروری در طراحی سایت استارت آپ

 

در این قسمت به طور مختصر آن چه که یک سایت استارت آپ حرفه ای باید داشته باشد را بیان می کنیم :

1 - همان طور که اشاره شد، باید استفاده از سایت استارت آپ و بهره مندی از خدمات، ساده و آسان باشد.

2 - در سایت های استارت آپ حرفه ای، امکان نظر سنجی از کاربران باید وجود داشته باشد و نظرات آن ها بررسی شود.

3 - پیشتیبانی لازم و کامل از خدمات به مشتریان ارائه داده شود.

نتیجه گیری

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

 



:: برچسب‌ها: طراحی سایت استارت آپ حرفه ای , طراحی سایت استارت آپ , سایت استارت آپ حرفه ای,استارت آپ حرفه ای ,
:: بازدید از این مطلب : 132
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
تاریخ انتشار : شنبه 9 تير 1397 | نظرات ()