Web Directions North: The Mobile Web Landscape

Slide 1: The Mobile Web Landscape In Canada and Beyond Brian Fling, Principal & Director of Strategy Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 4: Who is Brian? * Co-founder & Principal of Blue Flavor. * Mobile Designer since 2000. * Has worked directly with all Tier 1 carriers in North America and most of Tier 2. * Helped brands like Rolling Stone, Napster & ESPN with mobile web strategy & design. * Runs mobiledesign.org, the largest network of mobile designers. * Author of dotMobi Developers Guide. * Co-creator of Leaflets for the iPhone. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 6: Jargon Alert Mobile Portable personal communication devices able to connect voice calls or data requests wirelessly. Not to be confused with “cellular” or “cell.” Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 7: Jargon Alert Mobile Web The collective term for websites designed for viewing on a mobile device. Websites are published and accessed via the Internet just like a regular desktop website. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 12: 20 Million Canada (33m) England (50m) Population of the Earth Source: Wikipedia Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 13: 20 Million Canada (33m) England (50m) United States of America (303m) Population of the Earth Source: Wikipedia Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 14: 20 Million Canada (33m) England (50m) United States of America (303m) Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. European Union (495m) Source: Wikipedia Population of the Earth

Slide 15: 20 Million Canada (33m) England (50m) United States of America (303m) Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. European Union (495m) China (1.3 billion) Source: Wikipedia Population of the Earth

Slide 19: Mobile Users (2.9b) Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. Mobile Web Access (1.3b) Desktop Web Access (1.1b) Sources: GSM Association, T-Mobile, Credit Suisse, Pyramid Research Mobile Web of Today

Slide 22: by 2010 Mobile Web Subscribers Mobile Web of Tomorrow Source: Informa Telecoms & Media 2006 Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 23: Mobile will revolutionize the way we gather and interact with information in the next two years. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 24: Mobile will revolutionize the way we gather and interact with information in the next two years. ( Maybe 5 in Canada) Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 25: Vote Vote Down load Notify WAP Discuss IVR SMS Buy SMS IVR Notify Send to Friend WAP Bluetooth Radio TV Send to Friend Notify SMS Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. SMS Live Billboard Send to Buy Friend WAP ry Vi to MMS su di al Au Join WAP Site QR Code Word of Print Ad Mouth SMS Notify Kinesthetic Notify SMS WAP Mobile Events Buy Device Send to Friend QR Code Website MMS Join Notify SMS SMS Email WAP Site MMS WAP Site SMS Send to Friend Send to Friend Notify Notify

Slide 27: Jargon Alert LBS Location-based Services The ability for a mobile device to provide information that is relevant to it’s physical location via a Global Positioning System (GPS). Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 30: Jargon Alert Context The circumstances that form the setting for an event, statement, or idea, and in terms of which it can be fully understood and assessed. Considered together with the surroundings or circumstances. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 31: Designing for Context * Address the inherent benefits of the media. * Look at your content in multiple facets of distribution. * Create solutions based on goals. * Balance the constraints of the technology. * Remember physical context. * Adapt content for multiple contexts. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 36: The 3Cs of the Mobile Web * Cost If you don't develop your mobile website responsibly, the user could get stuck with a big bill in order to view your content. * Content Issues like navigation, image sizes, page weight and scripts all need to be considered when thinking about your website on mobile devices. * Context What does your website add to the users mobility? How do you add value to the their physical context? What is the context in which they will use your site? On a bus or train? Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 37: Jargon Alert One Web The principle of making the same information and services to users regardless of the device used. This is a very misunderstood, misused and commonly debated concept. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 44: 7 th Mass Media 1. Printing Press 2. Recordings 3. Cinema 4. Radio 5. Television Copyright © 2007 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 45: 7 th Mass Media 1. Printing Press 2. Recordings 3. Cinema 4. Radio 5. Television 6. The Internet Copyright © 2007 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 46: 7 th Mass Media 1. Printing Press 2. Recordings 3. Cinema 4. Radio 5. Television 6. The Internet 7. Mobile Copyright © 2007 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 47: 5 unique benefits 1. First truly personal mass media e.g. We don’t share our phones with our spouses. 2. First always-on mass media Information is always available 24/7, even when idle. 3. First always-carried mass media 7 out of 10 people sleep with their phone within reach. 4. Only mass media with a built in payment channel Universal click to buy. Twice as many people have phones than credit cards. 5. Offers point of thought Ability to create or consume content whenever the mood strikes. Copyright © 2007 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 57: Canada’s Slow Growth * Canada has relatively inexpensive fixed line telecommunications. * 67% of all Canadian home have at least one mobile phone. * Growth is only 9% per year. * Based on past and present growth rates, it could take Canada 5 more years to reach the market penetration of other countries. * Canadian policy restricts foreign (namely US-based) interests. * Industry Canada has been remarkably slow and laborious in auctioning off wireless spectrum. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 59: “ Change occurs because there is a gap between what is and what should be. ” — Craig McCaw Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 61: Unless something happens, the Canadian Wireless market will continue to be behind the rest of the world. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 64: Understanding and patience of the Mobile Ecosystem is one of the most crucial skills of the Mobile Web. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 65: Layers of Mobile Services Applications The mobile ecosystem Application Frameworks has many layers. Operating Systems Each with their own Platforms complexities and obstacles. Handsets Networks Operators Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 66: Layers of Mobile Services Applications A mobile network operator (MNO) also known as... Application Frameworks • a wireless service provider Operating Systems • a wireless carrier • a mobile phone operator Platforms • a cellular company Handsets ...is a telephone company Networks that provides services for Operators Operators mobile phone subscribers. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 67: Jargon Alert Mobile Service Provider A broad term to describe the mobile network provider that provides subscribers wireless access to voice and data services. Also known as a mobile network operator, or MNO in the telecommunications industry, though usually referred to as carriers in North America and operators elsewhere in the world. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 68: Rank Company Primary Markets Network Subscribers* 1 China Mobile China (including Hong Kong) GSM, GPRS, EDGE 337.9 mil Europe, Australia, New Zealand, GSM, GPRS, EDGE, 2 Vodafone 206 mil Africa UMTS, HSDPA GSM, GPRS, EDGE, 3 Telefonica Europe, Latin America 154.8 mil UMTS, HSDPA Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. 4 China Unicom China GSM, GPRS, CDMA 153.1 mil GSM, GPRS, EDGE, 5 America Movil Mexico, Latin America 137.2 mil UMTS, CDMA GSM, GPRS, EDGE, 6 T-Mobile Europe, USA 111.8 mil UMTS, HSDPA GSM, GPRS, EDGE, 7 MTS Russia 74.67 mil UMTS GSM, GPRS, EDGE, 8 Orange Europe, Netherlands, Africa 73.2 mil UMTS, HSDPA GSM, GPRS, EDGE, 9 Telenor Netherlands, Eastern Europe 68 mil UMTS GSM, GPRS, EDGE, 10 AT&T USA 63.7 mil UMTS, HSDPA * Proportionate subscribers in millions as of June 2007. Sources: Companies Annual Reports Top Network Operators

Slide 69: Rank Company Primary Markets Network Subscribers* 1 Roger Wireless Canada GSM, GPRS, EDGE, UMTS, HSDPA 7,155,200 Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. 2 Bell Mobility Canada CDMA, CDMA2000 1x, EVDO 6,021,000 3 TELUS Mobility Canada CDMA, CDMA2000 1x, EVDO 5,406,500 * Proportionate subscribers in millions as of June 2007 Canadian Operators

Slide 70: Jargon Alert MVNO Mobile Virtual Network Operator A branded wireless provider that does not own or operate a wireless network. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 71: Jargon Alert ARPU Average Revenue Per User A term used to describe the financial value of a program, application or service. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 72: Layers of Mobile Services Applications Mobile networks communicate through Application Frameworks electromagnetic radio waves Operating Systems with a cell site base station, the antennas of which are Platforms usually mounted on a tower, pole or building. Handsets They are often referred to by Networks Networks their generation and/or standard. Operators Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 73: Jargon Alert G as in 2G, 2.5G and 3G. The generations of mobile networks. Officially there are only 1G, 2G & 3G, but several midpoints have been defined as 2.5G, 2.75G, etc. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 74: 2G Second generation of mobile phone standards and technology Speeds GSM Global System for Mobile communications 12.2 kbits/s GPRS General Packet Radio Service max 60 kbits/s EDGE Enhanced Data rates for GSM Evolution 59.2 kbits/s HSCSD High-Speed Circuit-Switched Data 57.6 kbits/s Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. 3G Third generation of mobile phone standards and technology Speeds W-CDMA Wideband Code Division Multiple Access 14.4 Mbits/s UMTS Universal Mobile Telecommunications System 3.6 Mbits/s UMTS-TDD Time Division Duplexing 16 Mbits/s TD-CDMA Time Divided Code Division Multiple Access 16 Mbits/s HSPA High-Speed Packet Access 14.4 Mbits/s HSDPA High-Speed Downlink Packet Access 14.4 Mbits/s HSUPA High-Speed Uplink Packet Access 5.76 Mbit/s GSM Mobile Networks

Slide 75: Other Network Technologies * CDMA & EVDO * iDEN & WiDEN * WiMAX Worldwide Interoperability for Microwave Access, is a telecommunications technology aimed at providing wireless data over long distances in a variety of ways, from point-to-point links to full mobile cellular type access. WiMAX allows a user, for example, to browse the Internet on a laptop computer without physically connecting the laptop to a router or switch port via an ethernet port. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 76: Layers of Mobile Services Applications Application Frameworks Operating Systems A mobile handset or “mobile Platforms phone” is a long-range, portable electronic device Handsets Handsets used for mobile Networks communication. Operators Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 78: Other Applications Smart Phones Phone, Web, SMS Feature Phones Comparing Mobile Devices Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 79: Layers of Mobile Services Applications Application Frameworks Operating Systems The core mobile development platform in which all Platforms Platforms software is written. Handsets Networks Operators Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 80: Licensed Java ME (previously known as Java 2 Platform, Micro Edition or J2ME) is a specification of a subset of the Java platform aimed at providing a certified Java ME collection of Java APIs for the development of software for small, resource- constrained devices such as cell phones, PDAs and set-top boxes. BREW is an application development platform created by Qualcomm for mobile BREW phones. It is air-interface independent, i.e. it can support GSM/GPRS, UMTS, and CDMA Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. Windows Mobile is a compact operating system combined with a suite of basic Windows Mobile applications for mobile devices based on the Microsoft Win32 API Proprietary Palm C/C++ based RIM’s BlackBerry Java-based Danger’s Hiptop Java-based Apple’s iPhone Objective-C Mobile Platforms

Slide 81: Layers of Mobile Services Applications Application Frameworks Operating systems are common in Smart Phones, Operating Systems Operating Systems but rare in Feature phones. Platforms Handsets Networks Operators Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 82: Symbian OS is a proprietary operating system, designed for mobile devices, with Symbian associated libraries, user interface frameworks and reference implementations of common tools. Windows Mobile is a compact operating system combined with a suite of basic Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. Windows Mobile 6 applications for mobile devices based on the Microsoft Win32 API Used by Palm’s TREO line of mobile phones, though gradually being replaced by Palm OS Windows Mobile. Increasingly used in mobile phones. Motorola announced the next RAZR will use Linux Linux as its Operating System. OS X Used by Apple’s iPhone. Mobile Operating Systems

Slide 83: Layers of Mobile Services A software framework that is Applications used to implement the standard structure of an Application Frameworks Application Frameworks application for a specific operating system. Operating Systems Platforms Handsets Networks Operators Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 84: Applications written in the Java ME framework can often be deployed across the Java majority of Java-based devices. Applications written in the BREW framework can often be deployed across the Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. BREW majority of BREW-based devices. Applications written using the Flash Lite 2.0 and Action Script 2.0 frameworks can Flash Lite run using the Flash Lite Player. Applications written using the Win32 API can be deployed across the majority of Windows Mobile 6 Windows Mobile-based devices. Web Applications can be deployed across the majority of devices that support the Web WAP 2.0 specifications and run using a mobile web browser. Application Frameworks

Slide 85: Layers of Mobile Mobile applications often are Services designed to serve a particular function or purpose. Applications Applications Example applications may Application Frameworks include Games, Web Browser, Camera or Media Operating Systems Player. Platforms Handsets Networks Operators Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 86: Layers of Mobile Network-based services are Services Services often available at the Application, Framework, or Applications OS level to enhance the relevance of information. Application Frameworks Example services may Operating Systems include The Internet, Messaging or Location. Platforms Handsets Networks Operators Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 90: Jargon Alert XHTML-MP Extensible HyperText Markup Language: Mobile Profile A subset of XHTML Basic and HTML. Used as a primary markup language for the WAP 2.0 protocol. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 91: XHTML-MP * XHTML Basic and XHTML-MP are virtually indistinguishable * XHTML-MP is the predominant language for the mobile web. * It’s possible to use standard tools to create mobile web pages. * Since XHTML-MP is similar to XHTML, the transition to the mobile web need not be complicated to developers. * XHTML-MP is the default industry-supported language for mobile web development. * Unless a mobile service provider requires providing WML to support older devices, XHTML-MP is the only needed language in mobile web design. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 92: <? <?xmlversion=”1.0” encoding="UTF-8"?> ?> xml version="1.0" encoding=”UTF-8” <!DOCTYPE html PUBLIC “-//WAPFORUM//DTD XHTML Mobile 1.0//EN" <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN” "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> “http://www.wapforum.org/DTD/xhtml-mobile10.dtd”> <html xmlns=”http://www.w3.org/1999/xhtml”> <head> xmlns="http://www.w3.org/1999/xhtml"> <html <head> <title>Hello World!</title> Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. <title>Hello World!</title> <meta http-equiv=”content-type” content=”application/vnd. <meta http-equiv="content-type" content="application/vnd.wap.xhtml+xml"/> wap.xhtml+xml” /> </head> </head> <body> <body> <div id="intro"> <div id=”intro”> <h1>Hello<h1>Hello World!</h1> World!</h1> </div> </div> <div id="content"> <div id=”content”> <p>This is a simplea XHTML-MP Page</p> <p>This is simple XHTML-MP Page</p> </div> </div> </body> </body> </html> </html> Example XHTML-MP

Slide 94: Wireless CSS * Wireless CSS supports most 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. * Try to use document styles versus stylesheets. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 95: body { body { ! border-top: 10px solid #439213; border-top: 10px solid #439213; ! font: 10px Arial, Helvetica, sans-serif; font: 10px Arial, Helvetica, sans-serif; ! vertical-align: top; padding: 0 8px; ! padding: 0 8px; margin: 0px; ! margin: 0px; } } Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners. p { p { margin: 10px 0; ! margin: 10px 0; } } a { a { color: #439213; ! color: #439213; } } img { img { vertical-align: middle; ! vertical-align: middle; } } Example Wireless CSS

Slide 100: The Device Detection Problem * Simple Device Detection Publish only one mobile specific site, designed for the lowest supported browser, routing all mobile browsers to it. * Advanced Device Detection Programmatically render the best possible mobile specific site to the requesting device. * Mobile Stylesheets Code XHTML pages with the mobile context in mind and use the media type attribute to render a mobile stylesheet to mobile devices. * No device detection Rely on an alternate domain or subdirectory forcing the user to manually enter or navigate to the mobile specific site. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 103: Jargon Alert Adaptation The process of dynamically optimizing content to the restrictions of the requesting device. The adaptation model relies on the mobile device’s user agent profile to tell the server to deliver markup or images based on the browser, screen size and device capabilities. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 105: Supporting Devices & Browsers * There are over 500 devices being sold each year. * There are over 50 mobile browsers to contend with. * Crowding stems from mobile service provider provisioning. * Mobile service provider linked sites must support all provisioned devices and browsers. * Dealing with each Mobile Service Provider can be a full time job. Copyright © 2008 Blue Flavor. All trademarks and copyrights remain the property of their respective owners.

Slide 106: The reality is that a good mobile web strategy is only for those with lo

Slideshare.net (beta)