Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Mobile Website Development

337 views

Published on

Mobile Website Development

Published in: Education
  • Be the first to comment

  • Be the first to like this

Mobile Website Development

  1. 1. MOBILE WEBSITE DEVELOPMENT Mobile Boot Camp Presented by: Michael Wakahe Tawi Commercial Services Ltd Nov 18th 2010
  2. 2. Table of Contents Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  The Need for Mobile Web  Mobile Web History  Mobile Web Standards  Comparison with Desktop & Mobile Apps  Best Practices
  3. 3. The Need for Mobile Web Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  Limitations of mobile phones  Limited Processor Power and Memory  Limited Battery Life  Limited Input and Output Facilities  Low Bandwidth  Unpredictable Availability and Stability
  4. 4. The Need for Mobile Web Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  TCP/IP protocol suite was not designed for a wireless environment  Bandwidth resource is expensive  HTML pages are not suitable for use in mobile devices with limited processor power and screen.
  5. 5. Mobile Web History Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  Wireless Application Protocol (WAP) Forum was founded in 1997 by Ericsson, Motorola, Nokia, and Phone.com.  WAP 1.1 was published in 1999  WAP 2.0 was published in 2001
  6. 6. Mobile Web History Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  In 2002, the WAP Forum consolidated into the Open Mobile Alliance (OMA) and the specification work from WAP continues within OMA
  7. 7. Mobile Web History Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  WAP is designed with two main goals  to minimize bandwidth requirement  to maximize the number of supported network types (e.g., 9.6 Kbps in GSM).
  8. 8. Mobile Web History Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  WAP protocol stack is a lightweight protocol stack that is designed to address the limitations of wireless devices and the wireless network.  To access ordinary web servers, WAP-enabled mobile devices can rely on a WAP gateway to provide protocol conversion between WWW protocol stack and WAP protocol stack.
  9. 9. Mobile Web History Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  WAP tries to utilize existing Internet protocols and standards as much as possible  For example XML, HTML, HTTP & TLS
  10. 10. Mobile Web History Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  To reduce transmission time, WAP uses binary-coded WML (wireless markup language) pages.  Also WAP specifies a caching model and user agent profile (UAProf) for efficient delivery of device- specific content.
  11. 11. Mobile Web History Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved. <wml> <card id=“Card1" title="First Card"> <p> Hello World! </p> </card> <card id="Card2" title="Second Card"> <p> WAP is fun! </p > </card> </wml>
  12. 12. Mobile Web Standards Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  Various standards involved in:  Structure  Presentation  Client Side Scripting
  13. 13. Mobile Web Standards Copyright © Tawi Commercial Services Ltd. 2015. 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
  14. 14. Mobile Web Standards Copyright © Tawi Commercial Services Ltd. 2015. 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
  15. 15. Mobile Web Standards Copyright © Tawi Commercial Services Ltd. 2015. 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.
  16. 16. Mobile Web Standards Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  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 currently (2010) the best markup choice for HTML- capable mobile browsers.
  17. 17. Mobile Web Standards Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  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.
  18. 18. Comparison with Desktop & Mobile Apps Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  Client side scripting (like Javascript, Java applets) & AJAX usually not possible  Does not require installation unlike apps; many feature phones & smart phones have in-built browsers  Minimal or no client side caching
  19. 19. Comparison with Desktop & Mobile Apps Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  Mobile websites require much greater developer understanding & attention to detail than Desktop  Also may require use of proprietary technologies e.g. for Content Adaptation
  20. 20. Best Practices Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  While building the mobile information architecture, think about users’ “click investment”  You might also want to have condensed versions of the stories.  When presenting the information on a mobile device you will probably want to change the navigation structure
  21. 21. Best Practices Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved. Figure: Desktop Browser Website
  22. 22. Best Practices Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved. Figure: Mobile Browser Website
  23. 23. Best Practices Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved. Figure: Desktop Web Page Navigation
  24. 24. Best Practices Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved. Figure: Mobile Web Page Navigation
  25. 25. Best Practices Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  Content Adaptation – changing content to suit mobiles  A .mobi domain is recommended as a clear way to indicate to the user that a site is mobile-friendly  .mobi.ke is controlled by Kenic – in charge of country code top-level domain (ccTLD) for Kenya
  26. 26. References Copyright © Tawi Commercial Services Ltd. 2015. All Rights Reserved.  Cremin R., Rabin, J., Fling B., Robinson D. K. (2007). DotMobi Mobile Web Developer Guide. Dublin 1, Ireland: mobile Top Level Domain.  Mehta N., (2008). Mobile Web Development: Building mobile websites, SMS and MMS messaging, mobile payments, and automated voice call systems with XHTML MP, WCSS, and mobile AJAX. Birmingham, B27 6PA, UK: Packt Publishing  Frederick G.R., Lal R., (2009). Beginning Smartphone Web Development: Building JavaScript, CSS, HTML and Ajax-based Applications for iPhone, Android, Palm Pre, BlackBerry, Windows Mobile, and Nokia S60. United States of America: Paul Manning
  27. 27. The End Michael Wakahe michael@tawi.mobi +254 (0) 20 239 3052 www.tawi.mobi

×