The document provides an introduction to mobile web development. It discusses current trends in mobile computing and differences between desktop and mobile applications. It introduces various mobile web frameworks like jQuery Mobile and describes HTML5, CSS3, and PHP5 for mobile web development. It covers topics like mobile operating systems, browsers, and device categories. It also discusses jQuery Mobile features, compatibility, and limitations.
Mobile Application Development: Hybrid, Native and Mobile Web AppsPaul Sons
Orion eSolutions offer the best and the most reliable Hybrid, Native, Mobile Application Development services using the latest platform. To know mobile app development stages and usages visit orionesolutions.com
Mobile accessibility testing involves using screen readers and other assistive technologies to evaluate a website or app's accessibility on mobile devices. Key aspects to test include: (1) ensuring all content has text alternatives, (2) testing that the logical structure and reading order is correct, and (3) verifying that any interactive elements like buttons are accessible to screen readers. It is important to test using actual screen readers on target devices to identify any issues.
This document discusses web and mobile app accessibility testing. It covers laws regarding accessibility, how people with disabilities access apps using assistive technologies, and the difference between accessibility compliance and usability. The document provides guidelines for building and testing apps throughout development to ensure accessibility compliance and usability for people with disabilities. It also includes examples of accessibility standards, developer checklists, and ways to test for accessibility.
Mobile Accessibility Best Practices & TrendsAidan Tierney
This document discusses mobile accessibility best practices and trends. It provides an overview of different mobile platforms and development approaches, as well as accessibility features available on Android and iOS. While standards are still emerging, the document recommends following platform-specific guidance and the comprehensive BBC Mobile Accessibility Standards and Guidelines.
This primer on mobile accessibility will give you a solid grounding on standards, guidelines and principles of making websites accessible on mobile devices, and demonstrate some of the accessibility features available on iOS and Android.
This presentation was delivered at Digpen 7:
http://lanyrd.com/2014/digpen7/sdfcth/
This document discusses the mobile browser landscape. It notes there are many browsers, mostly based on WebKit, but they all have their own implementations which impacts performance and capabilities. Global statistics show Safari, Android, and Nokia browsers are most common, though the landscape varies by country. The document recommends building responsive mobile-first websites using progressive enhancement to ensure wide browser compatibility.
Wireless Application Protocol (WAP), WAP Key Points, WAP Push, Fragmentation, Features, Browsers and Web Platforms, Web View, Native Web, Packaged and Hybrids Apps, Tools for Mobile Web Development, Emulator and Simulator.
Mobile apps are programs designed to run on mobile devices like smartphones and tablets. There are three main types - native apps written for a specific platform, web apps that run in a mobile browser, and hybrid apps that are native apps with a web view component. Native apps have direct access to device features but must be developed for each platform separately, while web apps can be used across platforms but have limited features. Popular mobile platforms include Android, iOS, and Windows Phone, each with their own programming languages, SDKs, and IDEs for app development. Mobile UIs are optimized for touchscreens and mobility with gestures, simple designs, and standard interface elements.
Introduction to mobile application developmentChandan Maurya
This document discusses mobile application development. It covers the importance of mobile apps, different development choices like native, hybrid and mobile web apps, and factors to consider from the perspectives of users, developers and businesses. The key platforms are discussed along with their market shares. Native apps can access all device APIs but must be developed for each platform separately. Hybrid apps combine web technologies with native wrappers for a cross-platform experience. Mobile web apps run in browsers but have limited device access.
Creating mobile apps without native codeJoakim Kemeny
The document discusses creating mobile apps without using native code. It describes how mobile apps today are often created natively, but that native apps have disadvantages like being expensive to create and only working on specific platforms. The document then presents alternatives like mobile web apps and hybrid apps. It provides examples of how to build a basic mobile web app using HTML, CSS, and responsive design techniques like viewports and media queries to make the app work well on different devices.
Native mobile apps are best for performance-intensive or offline apps that require access to device hardware and APIs. They provide the best user experience but must be developed for each platform. Hybrid apps offer cross-platform support but have varying performance and limited hardware access. Mobile web apps have low-friction updates and no app store approval needed but lack offline support and native-level performance. Developers must choose between performance, cross-platform support, and development/maintenance costs for each mobile architecture option.
This document discusses key differences between developing applications for mobile versus desktop. It notes that mobile applications have more limited resources like screen size, memory, and bandwidth. As a result, mobile app design must prioritize essential content and navigation over extensive graphics. Interactions also differ as mobile apps are optimized for touchscreens. Developers must consider these constraints and user expectations of mobility when designing mobile applications.
When should you use HTML5 vs native apps for mobile app development? What are the pros and cons of HTML5? What are the advantages of native apps? What is the cost of HTML5 app development?
This presentation contains the facts based on 6+ years of mobile app development and more recently HTML5 experience.
We look forward to your feedback.
Best Mobile App Development Services in IndiaSteve Verma
CURIX INFOTECH - MOBILE APPLICATION DEVELOPMENT SERVICES
With every person having a smart phone in his hand, mobile applications have become great means to approach and convince wider range of audience. Whether you want to convey a social message or promote your business products, you can do this in an effective way through mobile applications. Curix Infotech develops mobile apps tailored to meet the requirements and objectives of different type clients.
We develop apps for following mobile platforms.
iOS app development
Android app development
Windows app development
They have a highly experienced team of mobile app developers who utilizes their expertise to develop innovative and suitable applications.
We offer following kinds of mobile app development services:
Responsive mobile website designing and development
Mobile advertisement
Custom mobile application development
Mobile game development
M-commerce application development
Cross-platform compatible applications
Mobile application testing and maintenance
Our team is capable of developing suitable mobile applications for any kind of business, industry, and organisation. We are ready to develop mobile applications for e-commerce portals, hotel industry, hospitals, banks, educational institutions, social networking sites, retail stores, and other types of businesses. Equipped with latest technologies, we are capable to cater to offshore companies and clients without any hassle. When you consider mobile app development services from Curix, you get following major benefits.
Key Benefits of Curix Mobile Development Services:
Top quality work
Applications with innovative features
Technical support
Most affordable charges
Extremely experienced developers
Use of latest technologies
On time completion of project
Free consultation
The document provides guidelines and best practices for developing mobile web content, including:
- Start with a lowest common denominator approach using simple XHTML and stylesheets to ensure broad compatibility. Then build apps optimized for specific devices.
- Keep pages small by minimizing images, stylesheets, and file sizes. Guide user input and provide defaults to reduce keystrokes.
- Consider content adaptation strategies like redirection to mobile-optimized sites, or serving the same content with reformatting. Unification allowing shared bookmarks is the ideal approach.
- Resources and tools are recommended to test mobile web pages and emulate different devices.
This document discusses designing for mobile devices. It begins by noting that design is shifting from desktop to mobile, with billions of apps now downloaded daily and mobile browsing expected to surpass desktop browsing by 2014. It then provides an overview of different mobile platforms, devices, and types of mobile delivery including native apps, hybrid apps, mobile web apps, mobile websites, and responsive websites. The document concludes by discussing considerations for mobile design such as research, planning, visual design, delivery, and responsive web design.
This document discusses mobile and web interfaces. It describes how mobile interfaces are used on handheld devices for everyday tasks through various apps. It notes challenges of small screens, different operating systems, and usability issues. The document also describes how web interfaces allow interaction through browsers and apps run in browsers across platforms. It mentions challenges of interactivity, languages, blogs competing with websites, and ensuring designs are user-friendly while protecting against attackers.
This document provides information from a seminar on mobile marketing. It discusses:
- Why mobile marketing is important as mobile device usage increases and more searches are done on mobile. Consumers are more likely to take immediate action on mobile-friendly sites.
- The differences between mobile apps and mobile websites. Apps provide additional features but both an app and mobile-optimized website are generally needed.
- Types of mobile websites, including responsive designs that adapt content for all devices and standalone mobile sites optimized specifically for mobile.
- Best practices for mobile sites like keeping content quick to load, simplifying navigation, and designing for usability on mobile devices.
- The seminar concluded with a demonstration
This document provides 10 tips for brands using WeChat official accounts to build audiences. The tips include making headlines count, segmenting audiences, increasing relevance of content, being more compelling, providing incentives and rewards, using more visual storytelling, linking to other social media, inviting guest editors, turning questions into content, and creating content on location. It emphasizes the importance of high-quality, relevant, visual content that engages audiences and drives action. It also recommends tools like CMS/CRM systems to better segment and target audiences with customized content.
It’s not enough that you drink water every day. You have to make sure it’s the adequate amount and it’s absolutely safe and clean. To be guaranteed about your everyday drinking water, it would be a good idea buy water filter here in Singapore or anywhere you might be in the world.
10 Insightful Quotes On Designing A Better Customer ExperienceYuan Wang
In an ever-changing landscape of one digital disruption after another, companies and organisations are looking for new ways to understand their target markets and engage them better. Increasingly they invest in user experience (UX) and customer experience design (CX) capabilities by working with a specialist UX agency or developing their own UX lab. Some UX practitioners are touting leaner and faster ways of developing customer-centric products and services, via methodologies such as guerilla research, rapid prototyping and Agile UX. Others seek innovation and fulfilment by spending more time in research, being more inclusive, and designing for social goods.
Experience is more than just an interface. It is a relationship, as well as a series of touch points between your brand and your customer. Here are our top 10 highlights and takeaways from the recent UX Australia conference to help you transform your customer experience design.
For full article, continue reading at https://yump.com.au/10-ways-supercharge-customer-experience-design/
How to Build a Dynamic Social Media PlanPost Planner
Stop guessing and wasting your time on networks and strategies that don’t work!
Join Rebekah Radice and Katie Lance to learn how to optimize your social networks, the best kept secrets for hot content, top time management tools, and much more!
Watch the replay here: bit.ly/socialmedia-plan
http://inarocket.com
Learn BEM fundamentals as fast as possible. What is BEM (Block, element, modifier), BEM syntax, how it works with a real example, etc.
20 Ideas for your Website Homepage ContentBarry Feldman
Perplexed about what to put on your website home? Every company deals with this tough challenge. The 20 ideas in this presentation should give you a strong starting point.
The document discusses how personalization and dynamic content are becoming increasingly important on websites. It notes that 52% of marketers see content personalization as critical and 75% of consumers like it when brands personalize their content. However, personalization can create issues for search engine optimization as dynamic URLs and content are more difficult for search engines to index than static pages. The document provides tips for SEOs to help address these personalization and SEO challenges, such as using static URLs when possible and submitting accurate sitemaps.
The document discusses techniques for optimizing mobile web performance. It begins by explaining why mobile web performance optimization (MWPO) is important given the slower mobile networks, processors, browsers, and users on mobile devices. It then debunks several myths about mobile web development. The document provides an overview of different mobile browsers and categories them by capabilities. It emphasizes the importance of testing on real devices and networks. The document outlines 14 rules for mobile web performance optimization including making fewer HTTP requests, using content delivery networks, adding expiration headers, gzipping components, putting stylesheets at the top, and lazy loading components. It also provides additional tips for mobile optimization.
HTML5 or Android for Mobile Development?Reto Meier
Android apps or the mobile web? It's often a hard choice when deciding where to invest your mobile development resources. While the mobile web continues to grow, apps and app stores are incredibly popular. We will present both perspectives and offer some suggestions for making the most of each platform.
This document discusses cross-platform mobile app development using HTML frameworks like jQuery Mobile and Sencha Touch, and PhoneGap. It describes the problem of developing for multiple mobile platforms and devices. The solution presented is to use these HTML frameworks to build apps once that scale across devices, and to use PhoneGap to package them as native apps for distribution. Benefits include access to many platforms without native coding, and leveraging HTML and JavaScript skills. Examples are provided of each framework.
Mobile applications Development - Lecture 8
Anatomy of an HTML 5 mobile web app
PhoneGap
This presentation has been developed in the context of the Mobile Applications Development course at the Computer Science Department of the University of L’Aquila (Italy).
http://www.di.univaq.it/malavolta
An overview of difference between Hybrid Mobile Applications, Native Applications and Mobile Web Apps. List of JavaScript frameworks that we used for Hybrid Mobile Apps.
The document discusses cross-platform mobile application development frameworks. It notes that according to a 2013 developer survey, over 5000 developers created apps using HTML5 in 2012 and 90% plan to do so in 2013. It then reviews several cross-platform frameworks like Titanium, PhoneGap, Rhodes, Corona, Marmalade, MonoCross, Sencha Touch and jQuery Mobile. For each it summarizes the main features, programming languages used, supported platforms, and other key details. It concludes by discussing pros and cons of cross-platform development like code reuse across platforms but also potential performance limitations.
Synapse india reviews on cross plateform mobile apps developmentsaritasingh19866
The document discusses various cross-platform mobile application development frameworks including Titanium, PhoneGap, Rhodes, Sencha Touch, jQuery Mobile. It notes that over 5000 developers used HTML5 for app development in 2012 according to a survey. The frameworks allow writing apps using a single codebase that can run on multiple platforms like iOS and Android. However, cross-platform apps may have limited access to device-specific features and slower performance compared to native apps. The document also covers pros and cons of cross-platform app development.
This document discusses RhoMobile, a cross-platform mobile app development tool that allows developers to build native mobile apps using web technologies like HTML5, CSS, and JavaScript. It offers a hybrid approach where web-based apps run inside a native container and use a device's browser to display locally hosted pages. RhoMobile allows building consumer and enterprise apps, offers features like offline data sync and push notifications, and supports platforms including Android, iOS, Windows Mobile. It aims to reduce costs compared to building native apps separately for each platform.
Best practices for delivering quality web experiencesBen Mantooth
The document discusses best practices for delivering quality mobile web experiences across different browsers and devices. It recommends adopting an end-user point of view to understand their objectives and tailor the experience accordingly. Developers should leverage evolving browser capabilities to improve perceived performance and ensure applications work as intended on all customer devices. A "one web" approach applying common performance practices across mobile and desktop can improve efficiencies.
The Mobile Web Revealed For The Java Developerbalunasj
This document summarizes a presentation about developing for the mobile web using Java technologies. It discusses native mobile apps, mobile web apps, and hybrid apps. It recommends using a framework like JSF 2 and RichFaces which provides standard-based mobile support today and advanced features in development, allowing the use of as much or as little of the Java EE stack as needed. It also discusses HTML5, CSS3, device detection, and orientation support to optimize mobile web experiences.
HTML5 is the latest version of HTML that provides native support for multimedia and graphics. It enhances HTML with new elements and APIs to build more robust web applications. While HTML5 offers advantages like cross-platform support and lower development costs, it also faces challenges from browser fragmentation and lack of access to device capabilities. Kony's platform aims to address these challenges by allowing developers to build HTML5 applications that can be optimized for all browsers and integrated with native device features.
This document discusses different options for developing mobile apps including native apps, web apps, and hybrid apps. Native apps are written specifically for a mobile OS and have no hardware limitations but are more time consuming to create. Web apps are coded using HTML, CSS, and JavaScript and are very easy to update but have no device hardware control. Hybrid apps combine a web app with a native wrapper to provide both ease of updates and hardware access. The document compares the advantages and disadvantages of each approach and provides tips on choosing the right option based on audience, time, budget, and resources. It also covers common development tools and languages.
This document discusses Lotus software on mobile devices and developing for mobile. It covers the history of Lotus mobile clients, including Lotus Traveler, Sametime and Connections. It also discusses using geolocation, forms and working offline in mobile development. Resources listed include the WURFL database for device detection, CSS media queries, and HTML5 features like geolocation, forms attributes and the cache manifest for offline work.
- The document provides an introduction to mobile application development and the Android platform. It discusses mobility trends, mobile platforms, and different approaches to developing mobile apps including native, web, and hybrid. It also describes the layered architecture of the Android platform which is based on a Linux kernel and includes native libraries, runtime, framework, and applications. Developing for Android involves using the application framework APIs to build apps that reside in the applications layer.
The document discusses developing mobile web applications. It notes that the mobile market is growing rapidly and that web apps can target many devices without requiring installation. It recommends targeting iOS and Android platforms and considering other platforms like Windows Phone. It outlines technologies like HTML5, CSS3 and JavaScript that are well-supported on mobile. The document also provides resources and tools to help with mobile development and things to consider like lower screen resolution and bandwidth limitations for mobile users.
Web development is evolving at a breakneck speed every passing year. New website technologies are being discovered regularly as developers explore new ways of innovation.
To make it easier for you, I have analyzed the shifts across industries and created an ultimate list of some of the latest web development trends in 2022.
This document discusses trends in mobile application testing. It covers the major mobile operating systems including iOS, Android, Blackberry OS, Windows Phone 7, and others. It also discusses testing methodologies, porting concepts, testing tools, and considerations for battery consumption testing. The trends highlighted include the increasing fragmentation of devices and operating systems requiring more robust testing approaches.
Understanding and Interpreting Teachers’ TPACK for Teaching Multimodalities i...Neny Isharyanti
Presented as a plenary session in iTELL 2024 in Salatiga on 4 July 2024.
The plenary focuses on understanding and intepreting relevant TPACK competence for teachers to be adept in teaching multimodality in the digital age. It juxtaposes the results of research on multimodality with its contextual implementation in the teaching of English subject in the Indonesian Emancipated Curriculum.
How to Store Data on the Odoo 17 WebsiteCeline George
Here we are going to discuss how to store data in Odoo 17 Website.
It includes defining a model with few fields in it. Add demo data into the model using data directory. Also using a controller, pass the values into the template while rendering it and display the values in the website.
Integrated Marketing Communications (IMC)- Concept, Features, Elements, Role of advertising in IMC
Advertising: Concept, Features, Evolution of Advertising, Active Participants, Benefits of advertising to Business firms and consumers.
Classification of advertising: Geographic, Media, Target audience and Functions.
How to Handle the Separate Discount Account on Invoice in Odoo 17Celine George
In Odoo, separate discount account can be set up to accurately track and manage discounts applied on various transaction and ensure precise financial reporting and analysis
Front Desk Management in the Odoo 17 ERPCeline George
Front desk officers are responsible for taking care of guests and customers. Their work mainly involves interacting with customers and business partners, either in person or through phone calls.
Delegation Inheritance in Odoo 17 and Its Use CasesCeline George
There are 3 types of inheritance in odoo Classical, Extension, and Delegation. Delegation inheritance is used to sink other models to our custom model. And there is no change in the views. This slide will discuss delegation inheritance and its use cases in odoo 17.
How to Install Theme in the Odoo 17 ERPCeline George
With Odoo, we can select from a wide selection of attractive themes. Many excellent ones are free to use, while some require payment. Putting an Odoo theme in the Odoo module directory on our server, downloading the theme, and then installing it is a simple process.
Ardra Nakshatra (आर्द्रा): Understanding its Effects and RemediesAstro Pathshala
Ardra Nakshatra, the sixth Nakshatra in Vedic astrology, spans from 6°40' to 20° in the Gemini zodiac sign. Governed by Rahu, the north lunar node, Ardra translates to "the moist one" or "the star of sorrow." Symbolized by a teardrop, it represents the transformational power of storms, bringing both destruction and renewal.
About Astro Pathshala
Astro Pathshala is a renowned astrology institute offering comprehensive astrology courses and personalized astrological consultations for over 20 years. Founded by Gurudev Sunil Vashist ji, Astro Pathshala has been a beacon of knowledge and guidance in the field of Vedic astrology. With a team of experienced astrologers, the institute provides in-depth courses that cover various aspects of astrology, including Nakshatras, planetary influences, and remedies. Whether you are a beginner seeking to learn astrology or someone looking for expert astrological advice, Astro Pathshala is dedicated to helping you navigate life's challenges and unlock your full potential through the ancient wisdom of Vedic astrology.
For more information about their courses and consultations, visit Astro Pathshala.
The membership Module in the Odoo 17 ERPCeline George
Some business organizations give membership to their customers to ensure the long term relationship with those customers. If the customer is a member of the business then they get special offers and other benefits. The membership module in odoo 17 is helpful to manage everything related to the membership of multiple customers.
No, it's not a robot: prompt writing for investigative journalismPaul Bradshaw
How to use generative AI tools like ChatGPT and Gemini to generate story ideas for investigations, identify potential sources, and help with coding and writing.
A talk from the Centre for Investigative Journalism Summer School, July 2024
No, it's not a robot: prompt writing for investigative journalism
chapter2
1. INTRODUCTION TO MOBILE
WEB PLATFORM
• Understand the mobile web development
• Discover the mobile web framework
• Understand the basic HTML5, PHP5 and CSS3
• Understand Webapps Environment
3. Current trends on personal or enterprise computing clearly
show that mobile services and devices will play a large role
on how we as users and businesses will create, consume, and
communicate in the future.
http://tonywoody.hubpages.com/hub/A‐Brief‐Overview‐of‐Mobile‐Computing
5. Differences Desktop and Mobile
Applications
• Mobile and embedded systems must balance
compute power, battery life and cost. This
means mobile platforms are constrained in
terms of available resources such as:
– CPU capabilities
– memory capacity
– memory bandwidth
– power consumption
– physical size.
6. • Some graphically rich applications are initially
developed for desktop platforms and are later
ported to embedded or mobile platforms.
• The reduction in available resources means
that the application is unlikely to work at the
same performance level as it does on the
desktop platform
8. Mobile computing limitations
• Insufficient Bandwidth
• Security Standards
• Power consumption
• Transmission interferences
• Potential health hazards
• Human interface with device
9. Myths of the mobile web
• Read the following:
– http://answers.oreilly.com/topic/1846-7-myths-
of-the-mobile-web/
– http://thenextweb.com/dd/2011/11/07/josh-
clark-debunks-the-7-myths-of-mobile-web-
design/#!psWs4
10. Mobile Web vs Mobile Webapps
• Read on
– http://www.visionmobile.com/blog/2013/07/web
-sites-vs-web-apps-what-the-experts-think/
– http://tripleodeon.com/2011/09/of-sites-and-
apps/
– http://pleth.com/blog/whats-difference-between-
mobile-app-mobile-web-app-mobile-website
– http://www.nngroup.com/articles/mobile-native-
apps/
13. jQuery Framework
• jQuery is a fast, small, and feature-rich
JavaScript library.
• It makes things like HTML document traversal
and manipulation, event handling, animation,
and Ajax much simpler with an easy-to-use
API that works across a multitude of browsers.
• With a combination of versatility and
extensibility, jQuery has changed the way that
millions of people write JavaScript.
14. • Other jQuery Projects
– jQuery user interface
– jQuery mobile
– Qunit js unit testing
– Sizzle css selector engine
15. jQuery Mobile
• A cross – platform UI framework for creating
webapps for touch – enabled smartphones
and tablets, using only HTML5 standard code
16. Advantages
• Easy to learn and Quick to Iterate
• Cross-platform & cross-device
• Slower Than Native
• Limited Capabilities vs Native
Disadvantages
17. What jQuery Mobile Is Not
• jQuery Mobile is not a jQuery alternative for
mobile browsers
– To use jQuery Mobile, you need to include the
typical jQuery framework.
– It is not a replacement; it is a UI layer on top of
jQuery.
18. What jQuery Mobile Is Not
• jQuery Mobile is not a webapp SDK
– You can create the whole mobile experience with
jQuery Mobile but you will need some additional
work to compile it as native apps.
19. What jQuery Mobile Is Not
• jQuery Mobile is not a framework for
JavaScript lovers
– Except in the case of certain advanced topics, you
won’t need any JavaScript code for jQuery Mobile
to work.
20. What jQuery Mobile Is Not
• jQuery Mobile is not the solution for all
mobile applications, websites, or games
– jQuery Mobile is not the solution for all mobile
applications, websites, or games
22. Features
• Non-intrusive semantic html5 code
• Open sourced
• Lightweight
• Multiplatform with progressive enhancement
• Accessibility support
• Customizable
• Includes javascript api
23. You need to know
• Html5
• Css3
• Javascript
• jQuery
26. Mobile phones
• phones with call and SMS support
• don’t have web browsers or connectivity
• don’t have any installation possibilities
• these phones don’t really interest us; we can’t
do anything for them right now.
27. Low-end mobile devices
• have web support
• very basic browser
• do not have touch support
• limited memory
• include only a very basic camera and a basic
music player.
28. Mid-end/high-end mobile devices
• mass-market option for a decent mobile web
experience
• maintain the balance between a good user
experience and moderate cost
• also known as social devices, meaning that the
users access social sites, such as Facebook or
Twitter via the mobile web
• typically offer a medium-sized screen, basic
HTML-browser support, sometimes 3G, a decent
camera, a music player, games, sometimes touch,
and application support.
29. Smartphones
• There are dozens of smartphone devices on the market, including iPhone,
Androidbased devices, webOS, Symbian, BlackBerry, and Windows Phone. This
is the most difficult category to define.
• Why aren’t some mid-end and high-end devices considered “smart” enough to
be in this category? The definition of smart evolves every year. Even the
simplest mobile device on the market today would have been considered very
smart 10 years ago.
• A smartphone, as defined today, has a multitasking identifiable operating
system, a modern HTML5 browser, wireless LAN (WLAN, also known as WiFi)
and 3G connections, a music player, and several of the following features:
– GPS (Global Positioning System) or A-GPS (Assisted Global Positioning System)
– Digital compass
– Video-capable camera
– TV out
– Bluetooth
– Touch support
– 3D video acceleration
– Accelerometer
31. Tablets
• A tablet is a device with a large screen (between 6 and 11 inches), a
full HTML5 browser,
• WLAN connection (WiFi), sometimes 3G, touch support, and all the
other features that we can find on a smartphone.
• In this category, we can find many devices, including the following:
– Apple iPad
– Samsung Galaxy Tab
– BlackBerry PlayBook
– Barnes and Noble Nook Color
– Motorola Xoom
– LG Optimus Pad
– Amazon Fire
– Sony S1 and S2
32. Operating Systems and Browsers
Operating system Creator Browser included Other browsers
iOS Apple Safari Opera Mini and
pseudobrowsers
Android Google Android Browser Firefox, Opera Mini,
Amazon
Silk, Opera Mobile
Symbian Nokia Symbian Browser Opera Mini, Opera
Mobile
webOS / Open
webOS
HP (formerly Palm) webOS Browser
Windows Mobile Microsoft Internet Explorer Opera Mobile
MeeGo Nokia Micro
Browser/Nokia
Browser
Firefox
BlackBerry OS RIM BlackBerry Browser Opera Mini
Bada Samsung Samsung Browser
S40 Nokia Nokia Browser
33. jQuery Mobile Compatibility
The jQuery Mobile 1.0 version is compatible with the
following by-default browsers:
• iOS
– Safari for iPhone, iPod Touch, and iPad from iOS 3.2
• Android OS
– Android Browser phones and tablets
• BlackBerry OS
– BlackBerry Browser for smartphones from 5.0 and for tablets
• Symbian
– Nokia Browser for touch devices
34. • webOS
– webOS Browser from webOS 1.4
• Bada
– Bada Browser
• MeeGo
– Micro Browser and Nokia Browser (included in Nokia N9)
• Windows Phone
– Internet Explorer from Windows Phone/Mobile 6.5 and
Windows Phone 7.0
• Kindle
– Browser from Kindle 3
35. jQuery Mobile is also compatible with the
following third-party browsers:
• Opera Mini, fully supported from 5.0 on most
devices
• Opera Mobile, fully supported from 10.0 on
most devices
• Firefox Mobile
36. • A-grade
– A browser with CSS3 media queries capability. These
browsers will be fully tested by the jQuery team. However,
some features will be automatically disabled if the device
does not support them. The framework provides a full
experience with AJAX-based animations.
• B-grade
– Browser has an enhanced experience but without AJAX
navigation features.
• C-grade
– A browser incompatible with jQuery Mobile. This browser
will not receive any CSS or JavaScript code from the
framework, so the user will see a plain HTML file with the
content
38. HTML5
• evolving standard that includes changes to the
HTML markup and lot of new APIs in JavaScript
(yes, HTML5 is a lot about JavaScript APIs)
• include features inside browsers,including the
W3C’s formal HTML5 standard, other W3C APIs,
CSS3, and nonstandard extensions.
• You can check http://mobilehtml5.org for
compatibility information for HTML5 in mobile
browsers.
46. CSS3
• CSS – Cascading Style Sheets
• web-based markup language used to describe
the look and formatting of a website to the
browser
• CSS3 simply refers to the latest version of CSS,
with additional capabilities far beyond the
scope of the first two generations
47. • Because of its modular structure, CSS3 allows
developers to build content-rich web pages with
relatively lightweight code requirements.
• That means fancier visual effects, better user
interfaces and most importantly, cleaner pages
that load faster than ever before.
• Simply put, CSS3 is the presentation layer of a
web page that leads the charge for all of the
other technologies buried within.
• CSS3 finally brings the promise of desktop-style
layout to web pages, complete with graphic
elements such as drop shadows, gradients,
border effects, multi-column layouts and much
more.
48. CSS3 Modules
• CSS3 has been split into "modules". It contains the "old
CSS specification" (which has been split into smaller
pieces). In addition, new modules are added.
• Some of the most important CSS3 modules are:
– Selectors
– Box Model
– Backgrounds and Borders
– Image Values and Replaced Content
– Text Effects
– 2D/3D Transformations
– Animations
– Multiple Column Layout
– User Interface
50. Multimedia
• New HTML5 media elements
– <audio> and <video>
• Native audio and video (no plugins required)
– Programmable with javascript
– Style with CSS
53. HTML5 Canvas and SVG
• Provide native drawing functionality
– Previously possible only with plugins (Flash,
Silverlight)
• Completely integrated into HTML5 documents
– Can be styled with CSS
– Can be controlled with javascript
• Use for animation, charts, images, pixel
manipulation
• Canvas supports 2D and 3D (WebGL)
55. Device Access Features
• Geolocation
– Allows users to share their location for location
aware services
• Drag and Drop
• Filesystem API
• Speech Input
• Device Orientation (accelerometer)
• Webcam (bar code, QR code scanning)
65. Identify WebApps Environment
• To test the mobile webapp in different
environments, we can use:
– Real devices
– Remote labs
– Emulators
– Simulators
– Lot of friends
66. Emulators
• an emulator is a desktop application that
emulates mobile device hardware and operating
systems, allowing us to test and debug our
applications and see how they are working
• allows us to run an operating system and
applications on another operating system
• created by manufacturers and offered to
developers for free, either standalone or bundled
with the Software Development Kit (SDK) for
native development.
68. Simulators
• less complex application that simulates some
of the behavior of a device, but does not
emulate hardware and does not work over the
real operating system
• Example:
– iOS Simulator provides you with an iPad for free
inside your Mac
70. Remote Labs
• A remote lab is a web service that allows us to
use a real device remotely without being
physically in the same place.
• It is a simple but very powerful solution that
gives us access to thousands of real devices,
connected to real networks all over the world,
with a single click.
• You can think of it as a remote desktop for
mobile phones.
71. • The most useful services on the market are the
following
– Keynote DeviceAnywhere (commercial)
• http://www.deviceanywhere.com
– Perfecto Mobile (commercial)
• http://www.perfectomobile.com
– Nokia Remote Device Access for Symbian and MeeGo
(free)
• http://www.mobilexweb.com/go/rda
– Samsung Lab.Dev for Android (free)
• http://www.mobilexweb.com/go/labdev
Editor's Notes
web-based markup language used to describe the look and formatting of a website to the browser, most commonly used in HTML or XHTML web pages but also applicable to XML documents, including plain XML, SVG and XUL
At its simplest, an offline web application is a list of URLs —��HTML, CSS, JavaScript, images, or any other kind of resource. The home page of the offline web application points to this list, called a manifest file, which is just a text file located elsewhere on the web server. A web browser that implements HTML5 offline applications will read the list of URLs from the manifest file, download the resources, cache them locally, and automatically keep the local copies up to date as they change. When the time comes that you try to access the web application without a network connection, your web browser will automatically switch over to the local copies instead.