Mobile Internet Standards

40
Strathmore Mobile Boot Camp November 2010 Mobile Website Development Mobile Internet Standards Facilitated by: Michael Wakahe Shujaa Solutions Ltd

description

This is part of the course given at the Strathmore University Mobile Boot Camp in Nov 2010.Facilitator: Michael Wakahe, Director, Shujaa Solutions LtdDate: Nov 18th - 20th, 2010Venue: Strathmore University Mobile Boot Camp

Transcript of Mobile Internet Standards

Page 1: Mobile Internet Standards

Strathmore Mobile Boot CampNovember 2010

Mobile Website DevelopmentMobile Internet Standards

Facilitated by:Michael WakaheShujaa Solutions Ltd

Page 2: Mobile Internet Standards

Table of Contents

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Introduction to Mobile Web Standards

Structure

Presentation

Client Side Scripting

MIME Types

Standardization Bodies

Page 3: Mobile Internet Standards

Introduction to Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 4: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Fundamentally, there is one Web.

Its content is standardized markup, styles, scripts,

and multimedia viewable using web browsers.

Page 5: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

A standards-based approach to Mobile Web

development ensures compliance and usability

across mobile browsers & platforms.

Knowing all the rules & knowing when to ignore the

rules is necessary for success on the Mobile Web.

Page 6: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Various standards involved in:

Structure

Presentation

Client Side Scripting

Page 7: Mobile Internet Standards

Structure

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 8: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

XML-formatted markup defines the document

structure

Handsets may support WML, XHTML, HTML4, HTML5

in varying degrees

These XML standards have various versions &

derivations

Page 9: Mobile Internet Standards

Mobile Web Standards

Previously WML was dominant, now best results with XHTML MP

Specifically XHTML MP 1.0

Most modern phones support WAP 2.0, which uses XHTML MP as the primary markup language while WAP 1.0 used WML.

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 10: Mobile Internet Standards

Mobile Web Standards

XHTML-MP (Extensible Hypertext Markup Language - Mobile Profile) is a specialization XHTML designed to incorporate features useful to mobile devices.

XHTML-MP 1.0 was defined by the OMA and is an extension of the original W3C-inspired XHTML Basic 1.0.

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 11: Mobile Internet Standards

Mobile Web Standards

Over time, OMA has developed XHTML-MP and now has a proposed 1.2 version of its specification.

XHTML-MP comes with a mobile-friendly means of using CSS to separate presentation from the markup, just like on the desktop.

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 12: Mobile Internet Standards

Mobile Web Standards

XHTML-MP 1.0 sets the base tags for mobile markup.

XHTML-MP 1.1 adds the <script> tag and support for mobile JavaScript.

XHTML-MP 1.2 adds more form tags and text input modes.

Currently many mobile browsers do not support XHTML-MP 1.2.

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 13: Mobile Internet Standards

Mobile Web Standards

Mobile Web sites targeting only smartphones can use the full feature set of HTML 4 & in the near future, HTML 5.

Using desktop markup also invites transcoders - network appliances designed to optimize the Desktop Web for mobile devices by reformatting markup

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 14: Mobile Internet Standards

Mobile Web Standards

HTML 5 is the next major release of the foundational

language of the Web.

It is currently a draft recommendation undergoing

active revision at the W3C (

http://www.w3.org/TR/html5/)

HTML 5 will be the next standard for markup and

APIs supported in Web browsers.Copyright © Shujaa Solutions Ltd. 2010. All

Rights Reserved.

Page 15: Mobile Internet Standards

Presentation

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 16: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Cascading Style Sheets (CSS) control the

presentation.

Most XHTML-MP mobile browsers support Wireless

CSS, CSS Mobile Profile, and/or CSS 2.

CSS 3 is new, coming along with HTML5

Page 17: Mobile Internet Standards

Mobile Web Standards

The OMA-managed Wireless CSS standard is a subset of CSS and is also part of the WAP 2.0 specification.

Note that Wireless CSS is not backwards compatible with WML.

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 18: Mobile Internet Standards

Mobile Web Standards

Wireless CSS and CSS Mobile Profile are tightly

related, but independent mobile subsets of

CSS2 used to style XHTML-MP documents.

Wireless CSS is a CSS2 subset standardized by

the Open Mobile Alliance.Copyright © Shujaa Solutions Ltd. 2010. All

Rights Reserved.

Page 19: Mobile Internet Standards

Mobile Web Standards

CSS Mobile Profile is a CSS2 subset—with

some features borrowed from CSS3—that is

standardized by the W3C.

The W3C’s goal is to align CSS Mobile Profile

with Wireless CSS as much as possible.

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 20: Mobile Internet Standards

Mobile Web Standards

Overall, Wireless CSS is a more restricted subset and

an older standard targeted at Web browsers on

resource-limited mobile devices.

CSS Mobile Profile adds in much more of the CSS2

standard to enable richer web documents but risks

full support on mass market mobile browsers.

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 21: Mobile Internet Standards

Mobile Web Standards You can add Wireless CSS to your document the same way as

you would for a normal HTML document.

Link to an external global stylesheet using the following line: <link href="external.css" rel="stylesheet" type="text/css" />

Insert styles at the document head the following example shows:

<style> p {

font-size: small; }

</style>

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 22: Mobile Internet Standards

Mobile Web Standards

Wireless CSS supports a lot CSS attributes, but not all of them.

More advanced styling techniques won’t likely work across multiple mobile browsers.

The best advice is to keep your CSS as simple as possible.

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 23: Mobile Internet Standards

Client Side Scripting

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 24: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Client-side scripting mainly through Javascript

ECMAScript-MP or mobile JavaScript targets mobile

phones

WMLScript is a scripting language which

complements WML.

Page 25: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Client-side scripting in mobile browsers used to be

the exclusive domain of smartphones, but this is

rapidly changing.

Many mass-market mobile devices beginning to

support mobile JavaScript.

Page 26: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

As with any client-side mobile technology, testing

JavaScript on actual mobile devices is critical for

effective development

Testing on emulators and in Firefox might not

uncover syntax problems and performance issues

that can occur on the target mobile device.

Page 27: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Mobile and desktop JavaScript have virtually

identical syntax.

The mobile version is stringent about ending

lines with semicolons.

Page 28: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Mobile JavaScript reduces the supported

character sets and excludes computationally

intensive language elements.

It differs from its desktop counterpart in the

extent of its DOM and event support in the

mobile browser.

Page 29: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

DOM and event support can vary from one

browser vendor and version to another.

On-device testing is critical for success with

mobile JavaScript.

Page 30: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

You can use device awareness and content

adaptation techniques that enable conditional

inclusion of scripting to target only mobile

browsers with support for JavaScript.

Page 31: Mobile Internet Standards

MIME Types

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 32: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Mobile MIME types (or content types) identify

the format of Mobile Web content.

Formats are differentiated by web servers and

browser clients in an HTTP transaction using

MIME types

Page 33: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Text documents containing mobile markup

Binary files include viewable or playable

content like ringtones, wallpaper and videos,

and binary executable mobile applications

Page 34: Mobile Internet Standards

Standardization Bodies

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Page 35: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Mobile Industry Groups and Standards Bodies

adherence to Mobile Web industry standards and

best practices is important for flexible and cross-

platform development.

Several Internet and mobile industry bodies govern

Mobile Web standards and recommended best

practices

Page 36: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

W3C: This body standardizes mobile markup

languages and publishes best practices documents

for Mobile Web development and testing.

Page 37: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Open Mobile Alliance (formerly WAP Forum): This

body standardizes mobile markup and style

languages and other mobile technologies designed to

be interoperable across devices, geographies, and

mobile networks.

Page 38: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

dotMobi (http://mtld.mobi): This body controls

the .mobi top-level domain, the content of which

must be device-adaptive and compatible with mobile

devices.

This body also publishes best practices for Mobile

Web development and nurtures mobile developers,

marketers, and operators with online communities.

Page 39: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Mobile Marketing Association: This body

centralizes technology recommendations and

best practices for marketing and advertising

on mobile devices.

Page 40: Mobile Internet Standards

Mobile Web Standards

Copyright © Shujaa Solutions Ltd. 2010. All Rights Reserved.

Open Mobile Terminal Platform (OMTP)

(www.omtp.org/): This operator-sponsored

mobile industry group standardizing mobile

device access from Web applications.