” are examples of this. These the reasons for this adoption is the shift to the examples highlight the ability of HTML5 to Web and supporting applications. This means afford the developer a more efficient way of that the use of proprietary technologies to cre- designing the web content. Furthermore, the ate applications for the web is being subsumed efficiency of the standard is helped because it into the HTML5 standard, allowing developers allows the developer conform to DRY principles to create rich, platform-agnostic applications. (Don’t Repeat Yourself). Specifying HTML5 HTML (Hypertext Mark-up Language) is the is providing developers the opportunity of authoring language used to create documents on creating a standard which conforms to their the World Wide Web. HTML is used to define specific needs. With the specification being the structure and layout of a web page, how it is constructed by “people on the ground” who supposed to look and other special functions to are working with the technology all the time, be displayed. HTML achieves this by the use of the structure and content of HTML5 is being adding tags which have attributes. For example: suited to exactly what the industry is requir- would be used in HTML to create a para- ing. For example, anyone who wishes to can graph break. When a user views a web page, have their say on what the important issues they would not see the HTML as it is hidden surrounding the HTML5 standard are; through from view, but they do see the results. HTML5 open forums and submission forms built right is the newest edition of this Mark-up Language into the specification (Hickson, 2011). which is widely used today and is supported by Approaching with this standardisation is many browsers in both PC and Mobile Devices. the ability for developers to create rich web Because of the rise in the quantity of mobile sites and applications which can be viewed devices users, more and more internet activity is many platforms – including mobile. HTML5 is on these devices. HTML5 offers many new and allowing the web to be uniform; offering similar improved features and is looking set to become and custom user experiences across platforms. the standard mark-up language in the very near It is overcoming obstacles set by hardware future. HTML5 is still a work in progress and manufacturers: different screen resolutions, has its compatibility issues that are being solved capabilities, sensor options, etc. By innovat- and supported as time goes on. HTML5 works ing and restructuring how content is created well on supported mobile browsers and offers for the web, the impact of these restrictions is many new features and advantages, so it is a minimised. When it comes to mobile web de- good choice in creating web sites, web pages velopment “our objective will be to make only and mobile applications. one product” (Firtman, 2010). This sentiment is In specifying the technology behind reflected in many publications and essentially HTML5, the specification is absorbing tech- boils down to the fact that the development of nologies like XHTML and by extension, XML any web content should consist of one develop- (as well as specifying important elements of ment period, with the content itself deciding how JavaScript). HTML5 is being specified because it should be presented to the user depending on the old standards of HTML have become laden viewing platform - an objective greatly assisted with convoluted functions and utilities which by the development of HTML5. are unnecessary and inefficient; HTML’s vo- cabulary has not kept up with the times (Lerner, 2011). HTML5 offers developers new methods 2. HTML5 of producing semantically expressive elements Vannevar Bush first proposed the basics of on web pages; such as replacing “div” tags Hypertext in 1945. Tim Berners-Lee popular- (commonly used to divide up a page into header, ised the World Wide Web, HTML (Hypertext navigation, footer, etc.) with tags which express
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. 42 International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012
Markup Language), HTTP (Hypertext Transfer while allowing humans, computers and devices Protocol) and URLs (Universal Resource Loca- to easily read and understand it. HTML5 is not ters) in 1990. HTML is basically the building only intended to succeed HTML 4 but XHTML, blocks of web pages. HTML was created origi- DOM2HTML and JavaScript as well. HTML5 nally so web browsers could read and compose attempts to define a single markup language to text, images and other materials into viewable avoid syntax errors that occur in existing web and readable web pages. The first version of documents and avoid the need to use various HTML was compatible with and worked well specifications to achieve complex web applica- in the NCSAs Mosaic Browser. As time went tions. HTML5 improves the markup available on new versions of HTML were published for documents and introduces markup and by a group which was set up and called the Application Programming Interfaces (API) s HTML Working Group. They went on to cre- for complex web applications. HTML5 has ate newer versions of HTML with HTML 2.0 a number of new elements and attributes that created in 1995 which was intended to be the have been developed with modern websites and first HTML specification to be a standard for there features in mind. With the rise of internet future implementation to be based on. In Janu- users accessing the web via mobile devices, ary 1997 HTML 3.0 was published as a W3C HTML5 has become the prime candidate for Recommendation which had dropped its maths cross-platform mobile applications. Many key formulas completely and did not succeed due to features of HTML5 have been created with a the draft being too large at 150 pages and due big consideration of being able to run on low to the pace of the browser development at the powered devices such as smart phones and time. Companies like Microsoft and Netscape tablet devices. chose to implement different subsets of HTML 3’s draft features as well as to introduce their own 2.1. HTML5 Features extensions to it. In December of 1997 HTML 4.0 was published which offered three new HTML5 provides users of mobile devices im- variations or rules which were Strict – in which proved usability and richer web applications. depreciated elements were forbidden for use, HTML5 adds many new syntactical features Transitional – in which depreciated elements which include , , were allowed for use and Framesets – where and elements. Another new feature is only frame related elements were allowed for the integration of SVG content which replaces use. In addition to the text, multimedia, and the use of generic tags. HTML5s new hyperlink features of the previous versions of features were designed to make it easy for han- HTML, HTML 4.0 supported more multimedia dling and including multimedia and graphical options, scripting languages, style sheets, better content on the web without the need to resort printing facilities, and documents that are more to installation and usage of plugins and APIs . accessible to users with disabilities. Work on Enrichment of the semantic content of docu- HTML5 Commenced in 2004 and is still under ments is now done with new elements such development by both the W3C HTML WG as , , and . and the WHATWG. Representatives from four Some new attributes have been introduced for of the major browser vendors such as Apple, the same purpose, some have been removed Mozilla, Opera and Microsoft as well as other completely and some have been changed, rede- organisations and individuals are onboard and fined or standardised like (Pash, 2011). participating in the W3C effort in making 2.1.1. Semantic Elements HTML5 the best it can be. HTML5 is still under development at HTML5 gives long awaited structure to web present with the aim to improve the language pages and makes them easier to process. and offer support for all the latest multimedia New
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 43
Figure 1. HTML5 new semantic elements
, and elements like element which allows the mobile browsers mean the less time download- creator to include the video directly into their ing JavaScript code and less server trips made if web pages without the need to use any plugin the validation can be found before the forms are based solution. Opera proposed the standard posted. HTML5 aims to standardise some of the element for HTML5 in 2007 and it most common rich form controls making them made its official Opera debut in Opera 10.50 render natively in mobile browsers and cutting browser. With less markup code needed HT- out the need to use script heavy workarounds ML5s element is simple to implement such as JavaScript libraries. Forms are the main into web pages and for web browsers that do data collection tool within web applications and not support the element of HTML5 because the data to be collected has become more it is possible to include alternative content complex it has been a necessity for HTML5 to which could include some text and a link to create input elements with more capabilities the video file itself so the users can download to collect this data a lot easier and effectively. and play in a compatible media application. Some of the new form attributes include: color, An example of markup code might be search, datalist, tel, email, URL, placeholder,
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. 44 International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012
Figure 2. Input number type
YouTube skipping Flash entirely and bring into all major browsers at the minute. This API streaming audio and video with timed playback identifies the user’s location when they access a and other neat features of HTML5. is particular website when using a mobile device. the new HTML5 element for adding audio to The latitude and longitude are available to Ja- a web page. These two features make it easier vaScript on the page, which in turn can send it to add video and audio to a page without wor- back to the remote web server that can display rying about plugins. things on your location like finding local busi- nesses or displaying your location on a map. The 2.1.4. Drawing APIs geolocation API specification was created by the W3C to enable websites the ability to get the The Drawing APIs or Canvas element which geolocation information from the browsers. The is a new part of HTML5 allows for dynamic, location information comes from Wi-Fi towers scriptable rendering of 2D shapes and bitmap and GPS. Most mobile devices such as smart images. It is a low level procedural model that phones are equipped with GPS functionality updates a bitmap and does not have a built in and laptops have built in Wi-Fi capabilities so scene graph. This feature is also designed to it is not difficult to get the location from these make it a lot easier to add graphics to a page devices via the devices browser. The geolacation without worrying about plugins. When sup- API provides the geolocation interface with a ported by the phones hardware, as in the case getcurrentposition() function which will return with the iPhone, it can provide a powerful the latitude and longitude information to the way to add graphics to a web page. The can- website or caller. The then invoked function vas element provides scripts with a resolution will provide the location information retrieved dependant bitmap canvas, which can be used from the location provider which in turn will for rendering charts and graphs, game graphics be passed on to the call back function, which and other visual images on the fly without the the website can make use of. This is not part of need for plug-ins (HTML, 2011). Canvas was HTML5, but is a separate specification. With originally introduced by Apple for use inside that said, it is often bundled together because their own Mac OS X web kit component and the mobile phones that are including HTML5 later went on to be used for powering dashboard are generally supporting the Geolocation API. widgets and the Safari browser which ran on The searchTwitter() function is a good example their range of mobile devices and tablets. Canvas of a geolocation API as it searches to find the was used in version 1.8 of Gecko browsers in latest tweets within a 50 miles radius of the 2005 and in Opera browser in 2006. It has since identified location with a given search keyword. been standardised by the WHATWG on new Once a user enters this search keyword, it checks proposed specifications for the next generation whether the geolocation functionality is avail- web technologies (Devlin, 2011). able for the device if the call back is successful then getcurrentposition() is used to find the 2.1.5. Geolocation APIs position. The searchTwitter() function is once The Geolocation API is an interesting feature again called upon with position as a parameter. that is currently being tested and incorporated Using position, latitude and longitude is then added to the Twitter search query.
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 45
2.1.6. Storage devices it is easier to access your data and your apps where veer you go. HTML5 and related At the present Cloud Computing is gearing specifications has a number of features that up to be the next big thing, offering storage make offline web applications a reality such as for all our files and documents and the ability the application cache, local storage, webSQL to easily access them from any location. This & indexed database and online/offline events will mean less and less data will be stored on (HTML5 Rocks, 2011). For example if a user user’s devices and storage drives. However at went out of coverage and had no signal on his/ the minute a lot of data is being stored on the her mobile device they still can access and use client side of browsers with reasons being to a lot of the applications on the device offline, help the browsers responsiveness, reduced load like games, photo applications and editing ap- on server and increased accessibility to users. plications and more. The best example of this type of storage to date has always being the HTTP cookies along with a few other browser specific or plugin methods. 3. HTML5 TOOLS In an attempt to resolve some of the chaos the There are many mobile web development tools WHATWG set out to standardise client side and frameworks available to the developers storage and come up with a well structured of HTML5 web applications. These tools and client side storage solution which is part of frameworks help provide a more consistent and HTML5s specifications approved by the W3C. comprehensive HTML5 support across mobile At present HTML5 is still a work in progress browsers. Below are some of the HTML5 tools and is currently being implemented into brows- and frameworks that are available at present to ers in phases, but with the client side storage help create HTML5 web applications. feature it has already been implemented into most popular browsers like Safari, Firefox and 3.1. jQuery Mobile Internet Explorer . Being one of the most talked about features of HTML5, client side storage jQuery Mobile is a unified user interface system has received a lot of criticism about security across all popular mobile device platforms. issues but has always been a very interesting jQuery Mobile has many features that help users/ innovation (Dhandhania, 2011). Offline storage developers to design high quality customised is about capturing specific data generated by web applications that will work on all popular the user, or resources the user has expressed Smartphone and tablet platforms. jQuery has interest in. HTML5 markup driven configuration of pages and behaviour for fast development and minimal 2.1.7. Offline required scripting. jQuery offers support to al- most all mobile browsers. All pages are built on There are two primary offline capabilities in a foundation of clean semantic HTML to ensure HTML5, offline storage (client side storage) compatibility with any web enabled device which has been mentioned above and applica- (http://jquerymobile.com/). The jQTouch is a tion storage. The AppCache and database make jQuery plugin for mobile development on the it possible for mobile developers to store things iPhone, iPad Touch, Android and others. This locally on the mobile device and interruptions framework is heavy on the CSS, while light on in connectivity will not affect the ability for the JavaScript. someone to use an app offline or get their work done. This offline support helps browsers cache 3.2. Sencha Touch static pages. With the significant increase in the ability to access the web on mobile devices Sencha Touch is the first HTML5 framework like laptops, mobile phones and now tablet created for mobile devices and is a cross
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. 46 International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 platform framework that is aimed at the next Flash player, which is traditionally used for generation touch enabled devices. Sencha Touch more interactive content on the web. These is compatible at present with Apple, Android SproutCore based applications can run on any and Blackberry devices which make up about modern web browser without any additional 95% of the US mobile traffic. Sencha Touch plugins (Kim, 2008). allows users to develop web applications that looks and feels native on iPhone, Android and 3.5. M-Project blackberry touch screen devices. Sencha Touch makes specific use of HTML5 to deliver high The M-Project is a HTML5/JavaScript Frame- quality audio and video as well as a local storage work that targets iOS, Android, webOS and proxy for saving data online. Sencha Touch’s Blackberry mobile platforms. It contains all UI key features include a comprehensive UI widget and core files with features like internationalisa- library, enhanced touch events management, tion, offline support and more. M-Project makes CSS transitions and an extensive data package use of jQuery on the JavaScript side of things and works hand in hand with PhoneGap to when creating compatible web applications for embed web applications into a native shell and mobile browsers. enables developers to utilise native device APIs such as the device camera or contact list (http:// 3.6. DHTMLX Touch www.sencha.com/products/touch/). DHTMLX Touch is a free to use HTML5 based JavaScript library for building cross platform 3.3. Jo mobile web applications. DHTMLX Touch Jo is a JavaScript framework for creating mobile offers a complete framework for creating high applications for HTML5 capable browsers and quality web applications for mobile and touch devices. It is fully compatible with PhoneGap, devices and also offers a set of UI widgets at which it relies on for creating native applica- the user’s disposal. DHTMLX Touch has a tions. Jo was created originally to work mobile unique online visual designer tool which pro- platforms as a GUI and light data layer on top of vides a codeless, drag and drop environment to PhoneGap. Since then Jo has been successfully build touch interfaces. The DHTMLX Touch tested as a lightweight framework for creating framework is highly compatible with most of applications for mobile browsers as well as the major mobile web browsers that support modern desktop browsers. In addition to mobile HTML5 web applications. Web applications web applications and native applications, Jo can created by DHTMLX Touch will run smoothly be used to create dashboard widgets. Jo is open on iPad, iPhone, Android based Smartphone’s source and is compatible with iOS, Android OS, and other popular mobile devices. DHTMLX web OS, Blackberry, Chrome OS, and anything Touch has many new improvements and features else with HTML5 widgets (http://joapp.com/). in the works at present including supporting Blackberry OS devices (DHTMLX, 2011). 3.4. SproutCore 3.7. WorkLight SproutCore like Jo is another open source HTML5/JavaScript for building web and mo- WorkLight is a mobile web application platform bile applications. SproutCore is also highly that supports the development of HTML5, hy- dependent on PhoneGap which it uses to brid and native mobile applications for iPhone, create applications that can be wrapped into Android, Blackberry and Windows operating native applications that run on iOS, Android systems. WorkLight offers support for all mod- and Blackberry mobile platforms. Apple has ern mobile devices. The user can choose from also had a lot of interest in SproutCore in a bid a variety of frameworks and tools to achieve to help reduce their dependence on Adobe’s an optimal user experience for each supported
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 47
Figure 3. MobileNationHQ browser interface
device and a highly portability of source code line services to access the internet is starting to from one environment to another. WorkLight has be taken over by portable and wireless devices third party library integration with frameworks which make up the mobile web. such as PhoneGap, Sencha Touch jQuery and Mobile device technology has advanced more (Mims, 2011). to the point that they have become more pow- erful than a desktop PC’s running Windows 3.8. MobileNationHQ XP a couple of years back. These new mobile devices such as Smartphone’s and Tablets have MobileNationHQ (Figure 3) is a web based tool powerful new processors, customised full blown that allows users from the novice to the expert operating systems and browsers which create an to use a powerful drag and drop environment always on, instant update web experience twenty to create HTML5 mobile applications with ease four hours a day, seven days a week and it all fits for both Apple and Android operating systems. in the user’s pocket. So with technology advanc- The creation of these applications is all done on ing as quickly as it has, it would be no surprise the user’s browser on an easy to use interface to anyone that the revolution of the mobile that provides a simple step by step process and web as far as internet use goes has taken place guide for designing, building and publishing so fast and silently. The proportion of mobile the user’s mobile applications. The tool also device owners who use their phone to access supports the integration of custom JavaScript. the internet on a regular basis has quadrupled Standard users can use it for free while enter- in the US and tripled in West Europe over the prises have to fork the bill (Roberts, 2011). past few years according to studies done. This is manly down to the owners of Smartphone’s 4. THE MOBILE WEB increasing habits of browsing the internet on a daily basis. The number of mobile web users The mobile web refers to the use of browser is looking set to overtake PC internet users based access to the internet via a mobile device in the not too distant future. Users can access such as a Smartphone or a tablet device con- content such as websites, applications, videos nected to a wireless network. Traditional fixed and games through the mobile web via mobile
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. 48 International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 phone or tablet devices. Mobile web has become (i.e., different resolutions, colour depths). This big business and has opened up a whole new involves creating the same content (or what is playground for advertising towards consumers. applicable) and structuring it differently depend- This increased mobile internet usage can only ing on target audience, i.e., having a mobile increase more as the price for these mobile site, one which is structured better for tablets devices will continue to drop allowing more and a separate site for desktop users. This af- and more users access to the devices. fords the developer the option of defining the Finding information is a large aspect of presentation of the content very specifically, mobile web use. One study shows that of 270 as well as minimising the “content-overload” participants questioned, almost half (128) had that is possible when viewing a lot of content used their device to access a search engine, with on a small screen. This reduces the amount a similar number (132) using the device to access of scrolling and resizing the user is forced to news or weather content (Kaikkonen, 2008). do in order to view the content and find what In this regard, one issue that arises is the com- they are looking for. In a scenario like this it promise between presenting a tailored mobile would also usually mean that the amount of web site or allowing full access to the standard information transferred to the user’s device is desktop version of the web site. If the content is reduced; potentially limiting data-service costs to be delivered as a separate, tailored web site, for the user. However, this solution has its own it is likely to be a more utilitarian version of the restrictions. If a separate website were to be main web content, cutting down on things like created, any content to be delivered to users images and other media and restructuring the would have to be duplicated and distributed content to present the most relevant information among the individual versions of the website. (Hinz et al., 2004). Resulting from this could In this instance, more content would mean be that the user may not be able to access the more of it would have to be duplicated and the information they are searching for – due to amount of work required to keep the website presentation issues or even the information up to date would increase exponentially over not being contained within at all. A lot of web time. Also, while this solution would succeed content which is not formatted for individual in presenting a site well to each medium being devices and does not restructure depending used, should new devices come into use the on display medium. This means accessing or structures used would have to be changed and browsing the site tends to become trouble- rebuilt once more. As mentioned previously; the some when viewed on a mobile device. This main advantage of this would also present its is one of the main issues web developers must main weakness. To be displayed effectively over confront when developing content today. With a range of devices it could not present much of problems like screen resolution hindering font the multimedia content like images or videos. presentation, colour depth affecting readability Therefore, in order to remain an efficient and in displays or different interface options affect- stream-lined version of the content, it must ing the flow of information (i.e., finger-touch omit content that would usually attract people screen versus stylus or optical track pad), many to a full web site. While recurring users of a are seeking solutions to help improve interac- web site will note the difference, and see the tions with the mobile web. Without knowing lighter version of the web site as functional, exactly what method the user will attempt to new users may not feel drawn to the site. The access the web content with, it is very difficult reasoning for this solution is that “traditionally, to know in what way to display the information mobile phones have small displays and con- to them. In this regard there are several main nection is slow” (Kaikkonen, 2008). However, solutions which are widely used. while this is cumbersome, studies show that One such solution is to recreate the content having a website tailored to the use of mobile and definitely structure it for separate devices web content can increase usability; one study
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 49 shows that users were typically 30% - 40% tent which is being presented would be fully faster when using the tailored site compared accessible to the user in a way in which would to attempting to view the full site on a mobile be more beneficial than to display the full site device (Schmiedl et al., 2009). Additionally, or a cut down version of it. This method does mobile devices have become larger, with touch- suffer a disadvantage in that it would require screens becoming the standard and allowing the site to be constructed over again for each the device to have a screen that is the size of medium the developer intends the audience to the whole unit. Similarly, connection speed is view it on. This would be time consuming and improving at a great rate, with 3G available on would mean a new site be constructed when most (if not all) smartphones and 4G sometimes new devices become available. Since creating (Dahlman et al., 2011) becoming available in a new version of the web-content each time the future to allow even higher data rates on would increase development time and general mobile devices. It can be concluded that the maintenance, there has been a lot of research measures and precautions taken in order to limit and development in other solutions which the amount of data presented to the user on a can be used when approaching this problem. mobile device can be relaxed (perhaps even Different aspects of the HTML5 standard in removed) with the technology on the medium particular aim to circumvent this problem. Part in general improving. Another mainstream op- of the specification is to separate the different tion for the presentation of mobile content is elements which make up web content, i.e., the allowing the device to access the “full” version display portion is being structured in CSS3, of the web site. This would consist of scaling dynamic elements are being implemented using the web site in order to display on the device. It JavaScript, content is defined within the pages. would show a version of the site which would This is due to the focus for web design on require the user to zoom in and move around modular components becoming more and more on the page in order to find the content they are prevalent; allowing the developer to create each browsing for. While this is a viable option, it is element separately and maintain each separately. important to note screen size again. Zooming This means that when updating or implementing in and out while scrolling can cause the user to any of the different elements in the structure, miss important information, making the use of the affect it has on the underlying architecture the page cumbersome, thus unproductive and of the web content will be minimised. The possibly frustrating. This would counteract mobile web suffers several criticisms like the the purposes of developing a new site at all need to restructure information for the user considering the objective would be usability. depending on the media they decide to use or Studies have shown that the web as view- the lack of hardware controls available to a able on a mobile device does not allow the website that would be available to an installed same level of detail when displayed in this application. Applications which are installed format. Due to the size and scale of the content, are able to use hardware sensors built into the it becomes more difficult to access the parts of mobile devices in order to create a better user the page the user desires. Users rate tasks more experience such as monitoring the orientation difficult on this platform when presented in this of the device to present content in landscape manner than the task would be when performed form (which most mobile browsers do) which on a full desktop screen (Roto & Kaikkonen, would allow the developer to create separate 2003). One other solution is to present the site content for different screen orientations. One in a format tailored to the displays it will be of the main advantages of HTML5 is that it is viewed on. In doing this the developer could being standardised alongside the development construct the layout in a strict manner which of CSS3: a style sheet language to format web would ensure that the user experience is always pages (Harris, 2011). CSS3 brings with it many consistent. This would also mean that the con- solutions to common problems in presenting
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. 50 International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 the content to the user through conditional or device which would support the HTML5 tags. This will allow the developer to create standard and the service could provide a rich their own content and leave the content intact, set of information and utilities. With a plethora using CSS to determine how each device will of applications … ranging from tracking and see the information. One solution to the problem navigation systems, directory services, enter- of not being able to establish device orientation tainment and emergency services, and various through a web site is the ability of the content mobile commerce applications (Dhar et al., to monitor screen widths. In this way, the web 2011) geolocation presents a large segment of content can assess the media it’s being viewed the mobile applications market and with the on and establish whether the device is presented introduction of the Geolocation API giving web portrait or landscape; allowing the developer applications the same abilities as native applica- pseudo-access to hardware controls usually only tions, more web sites and services are utilising accessible to installed applications. these controls to give a richer user experience The method for doing this is using CSS3 (e.g., Geo-tagging photos or posts in Twitter or media-queries and even the increasingly sup- Facebook web applications). ported orientation” media query. Commonly, this is used to set up web-content to be acces- sible from all platforms and adjust accordingly. 5. HTML5 ON MOBILE Depending on the screen type, color-depth, WEB BROWSERS orientation and many other criteria, the devel- HTML5 needs to be compatible on all platforms oper has a lot of control over what presentation in order to succeed, so it needs to be compatible options should be used per-device (Godwin- on both desktop browsers and all mobile device Jones, 2011). Another aspect of HTML5 which browsers. HTML5 is the best hope of building is attempting to overcome the hardware bar- a cross device mobile ecosystem. HTML5 is rier fundamental in mobile web design is the critical in the evolution of the mobile web but introduction of the Geolocation API (Hickson, at present it is still a work in progress and a 2011). The Geolocation API allows the web long way from completing all of its features, content access to utilities which will return support and compatibility issues are a main the user’s geographical location (if they allow concern at the minute but a lot of work is being it); commonly using methods like IP address, done to close that gap as far as compatibility MAC address and Wi-Fi location among others. is concerned. These methods of location are complex and Webkit is a layout engine designed to allow usually difficult to implement for any service. web browsers to render web pages and would be However, the service is run beneath an API one of the top one used by companies at pres- layer which allows a simplified set of access ent. It was in Nov 2007 that Webkit announced rules and presents a common interface for the that it had accomplished support for HTML5s developer to access the location without having media features allowing for embedding video knowledge of the specific location procedures. natively rendered and script control in Webkit. Where before, any geolocation-based services Webkit powers browsers like Apple’s Safari written for a mobile platform would have to be and Google ’s Chrome. The iPhone, Google developed as a native application in order to ac- Android, Nokia and the Palm Pre are all based cess the GPS sensors or Wi-Fi location services; on the open source Webkit browser engine. now a mobile web application can access the These mobile devices represent somewhere geolocation API and have the advantage of the around 65% of the Smartphone’s sold. Just to “write-once, deploy everywhere” application note that because a device uses Webkit does model (Holdener, 2011). In effect; a developer not mean that it has the latest version of Webkit would have the option of constructing a web and can use HTML5. So these mobile operating service that would be available on any platform
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 51 system vendors upgrading to the latest versions users accessing sites on the mobile web. It also of Webkit is also a big factor for the success came to light that 60% of users use the mobile of HTML5 as more support and access will be web for social networking. There is more than granted for HTML5 and not to forget Webkit 150 million active users currently accessing creates a significant portion of Smartphone’s. Facebook through their mobile devices and The two major platforms not using Webkit are that people who use Facebook on their mobile Windows Mobile and Blackberry. A Google devices are twice more active than non-mobile Gears plugin is required to avail of HTML5 fea- users. It has been discovered that there is over tures capabilities for users of Windows Mobile 200 mobile operators in 60 countries working devices. At present it is not looking that good to deploy Facebook mobile products. for Windows Mobile as HTC (who makes up Another major issue of HTML5’s compat- 80% of Windows Mobile sales) is rumoured to ibility on the mobile web is that the promise expect 50% of their sales to be Android based. of HTML5 is only realised on modern mobile Another barrier to the HTML5 adoption would devices with updatable web browsers basically have to be Rim’s Blackberry platform. Black- leaving older mobile device users in the dark. berry’s unique to itself browser was not created Smartphone’s like the iPhone and Android may on any of the major browser engines and only implement portions of HTML5’s specifications until recently it started handling HTML, CSS and are excellent platforms for generating rich and JavaScript reasonably but it is still very HTML5 applications to users browsers but these buggy and insufficient in comparison to the Smartphone’s do not make up all the mobile other main browsers in handling these mark- phone users in the world, as the majority of ups and features. On the upside for Blackberry mobile phone users still use non-Smartphone and Windows Mobile is the availability of the devices with no ability to update the phone’s very popular Opera Browser. Opera is the top web browser or operating system . Developers download for a mobile browser and because it of HTML5 applications and features must try is one of the leading developers of HTML5, it and find a way around these limitations on is obviously fully compatible with it (Grigsby, such devices, but that is not going to happen 2009). overnight. One answer is that developers must HTML5 is not the answer to all the ques- use a content adaption principle to make sure tions facing mobile web application developers, advanced HTML5 elements only targets the proving it is still a work in progress (Mobile mobile browsers known to support HTML5. Metric, 2011). The report checked the support Content adaption can ensure a satisfactory that the top 15 mobile devices had for HTML5 mobile web experience for all mobile web users. features and found that the top 5 HTML5 sup- Some of these issues include: ported features were Geolocation API, offline web support, web storage , CSS3 selectors and • Fragmentation: Too many vendors 2D animators, partially supported features were implementing mobile browsers, creating misc element types & attributes, extended user a divided/fragmented marketplace and interaction concept, CSS3 in general, extended forcing developers to adopt web content to form concept and extended video/audio support. play browser strengths and avoid browser It also revealed that the top 5 HTML5 features weaknesses. not supported were microdata, 3D animation • Browser Bugs: As with any web stan- rendering, filereader API, indexed DB and dardisation HTML5’s features may be local file support. Therefore HTML5 has still incorrect or incomplete when it has been a distance to go before it is completely cross implemented into a mobile browser. platform/browser compatible with 100% sup- • Rushing to market: Some mobile browsers port for all its features. The report also showed may try to rush support for HTML5’s fea- that Android had taken over from Apple from tures, implementing them and then having
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. 52 International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012
to change or cut these features from the elements on a web page. A few alternatives to final standard. HTML5 are briefly discussed below. • Forgetting the mass market: A lot of popular mobile web sites just use simple mark-up 6.1. JavaScript to quickly display the relevant information and data on user’s mobile browsers. Up- JavaScript is a prototype based scripting grading these sites to HTML5 would mean language which is a trademark of the mighty cutting off access to millions of users of Oracle Corporation and is officially managed older mobile web browsers to these sites. by the Mozilla foundation that implements new Only by implementing content adaption language features periodically. JavaScript is can this be achieved. dynamic and offers first class functions in cre- ating web pages. JavaScript is also supported by the likes of Webkit, Opera, Actionscript HTML5 also has the need for more features and Rhino. JavaScript code can run locally in to be added as people are clamouring to develop a user’s browser which can respond to user’s mobile applications that take full advantage of actions quickly making web applications more the technology of modern day mobile devices. responsive. JavaScript can detect user actions So the more technology is advancing and added that HTML alone cannot such as individual to these devices new and improved HTML5 keystrokes. JavaScript is the only language that features should be created and updated in the more popular web browsers share complete time to cope with the change in technology. support for, making it a target language for An example would be Palm Pre Web OS had many frameworks in other languages such as to forge forward in defining its own API’s for HTML5. Prototype and jQuery are two of the accessing things like address book and camera more popular JavaScript libraries designed to because HTML5 was not supported at the simplify DOM-orientated client side HTML time. HTML5 is indeed a giant leap forward scripting. JavaScript can be seen as more of to try and standardise the advanced features an ally to HTML5 rather than an adversary as of modern day web browsers. Because of new HTML5 has much love and use for JavaScript. and improved elements and API’s HTML5’s HTML5 makes it easier for JavaScript-type compatibility and consistent implementations code to point at, and pull from each piece of of rich web applications are getting better and the web page. A disadvantage to JavaScript improving every day and becoming more and would be that a lot of programming languages more noticeable. The main advantage of course and applications do not understand Java’s na- is the goal and path HTML5 is set on to become tive data format. the standard mark-up language in the future. 6.2. Silverlight
6. ALTERNATIVES Silverlight is a Microsoft application frame- There has always been an alternative to HTML5 work for creating and running rich internet which has become the successor of HTML4 and applications with similar features and purposes fifth edition of the HTML mark-up language. as Adobe’s Flash. Microsoft’s Silverlight is Some of the alternatives to HTML5 would be available as a free web browser plug-in that the likes of JavaScript, Microsoft’s Silverlight enables interactive media experiences, rich and Adobes Flash. Browser Plugins such as business applications and immersive mobile Flash and Silverlight are artificial solutions applications. Silverlight at present works on for a natural problem that HTML5 is trying to all major operating systems and all major web fix such as placing and managing interactive browsers including Internet Explorer, Firefox, Google Chrome and Safari. A good example of the use and power of Silverlight would be that
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 53 it powers Netflix’s ability to stream TV shows are now concentrating on the use of HTML5 and movies to the PC and Mac in both standard in implementing its features and applications. and HD. Features and benefits include tools for Steve Jobs said that “Flash was created developers and designers, client support, server during the PC era – for PCs and mice. Flash is side support, digital rights management capa- a successful business for Adobe, and we can bilities, live streaming and online games. The understand why they want to push it beyond PCs. only problem is that it does not offer support But the mobile era is about low power devices, for mobile web browsers bar that of Windows touch interfaces and open web standards – all 7 Phones and Symbian OS (Borck, 2010). areas where Flash falls short. The avalanche of media outlets offering their content for Apple’s 6.3. Flash mobile devices demonstrates that Flash is no longer necessary to watch video or consume Adobe Flash (Formally known as Macromedia any kind of web content. And the 250,000 apps Flash) is a multimedia platform used to pro- on Apple’s App Store proves that Flash is not vide animation of text drawing and animation, necessary for tens of thousands of developers streaming of audio and video and interactivity to create graphically rich applications, includ- by capturing the users input via mouse, keyboard ing games. New open standards created in the microphone and camera. Flash is highly used mobile era, such as HTML5, will win on mobile for games and flash animations. Flash is also devices (Claburn, 2011). used for advertisements which to a lot of people found intrusive and annoying with pop-up and advertisements which lead to flash blocking 7. CONCLUSION features implemented in web browsers so that users would have an option to turn them on or off. Surfing the web is becoming increasingly popu- Adobes Flash as mentioned above is an applica- lar and accessible from mobile devices. With tion framework a lot like Silverlight, used in the service providers offering “transparent” costs creation and running of rich web applications. for data charges on mobile (Garwood, 2011), Flash is a lot more popular than Silverlight and users are becoming aware that using the web more compatible in mobile web browsers with from their mobile will not result in a large bill support for Android, Pocket PC, Blackberry, and thus are becoming more likely to access the Playback, Symbian OS, Palm OS AND Web web from their device (Kaikkonen, 2008). This OS. Flash content can also be bundled inside is significant because when combined with the an Adobe AIR application which can then be availability of areas where internet access is free downloaded and run on Apple mobile devices. through a Wi-Fi Hotspot, the concept of “always Flash is still a big key player and the likes of on” mobile internet access is becoming more YouTube depends highly on it, so you cannot prevalent (Simpson, 2009). Where in the past see flash disappearing anytime soon. HTML5 is mobile web content was designed to be smaller, a huge threat to the online dominance that Flash more direct selections of a web site (allowing has as Flash’s cumbersome customisations may for faster downloads/minimum data costs and be no longer necessary when creating interactive also optimal presentation on mobile devices), media experiences. (Borck, 2010) There are the web in general is moving away from the still some web applications that rely entirely on concept of a web site and moving towards a Flash to power their interactive interfaces. The concept more like a web service ; particularly on flash adoption was so widespread in 2007 that mobile devices. These web services are taking upon the release of the iPhone, many consum- advantage of what the mobile web means to a ers were upset to hear that its operating system consumer: mobility and instant-connectivity. Apple iOS did not support flash. It comes as Services like Twitter; where the application no shock several years down the line that apple on a mobile device is constantly searching for
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. 54 International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 new “tweets” that are updated and presented 2008). Due to the extended period of time the to the user. Another example of this is Face- project is being worked on, the specification book. On each of the main mobile platforms can go through many changes and iterations. (iOS, Android, Symbian) these services have With something as dynamic as web design; this installable applications which will connect to could be problematic. As adoption rates for the web content and allow functionality that aspects of the standard differ, browsers may is comparable to the desktop versions of both; implement different features but the experience and in the case of Twitter – an arguably more may not be uniform - especially in the mobile intuitive experience. space. Competing companies will have different However, web content like Twitter or visions of what aspects of the specification will Facebook is approachable in another manner; appeal most to consumers. Therefore they may these sites have also produced fully functioning have different priorities as to which aspects to mobile web sites which look, feel and act like support. HTML5 and the specifications which a native application. The line between a native are being produced in conjunction with it (i.e., application and mobile web content is blurring the Geolocation API, CSS3), have all got a (Rowinski, 2011) with the use of HTML5 on lot in common. These specifications are part mobile devices. Using this allows developers of a new mentality in web design of keeping to create web content that performs as well as the standards and environments simple, sleek native mobile applications; some going as far and efficient. With this new mentality, web as to find methods of integrating aspects of content is becoming more approachable and the devices own hardware sensors. “From a ubiquitous. HTML5 is facilitating developers business perspective, it makes a lot of sense to working to make the content accessible from adopt HTML5 as early as possible. Industry anywhere on any platform while ensuring the heavyweights have pointed to HTML as the experience remains as rich on mobile as it is on only viable cross-platform technology” (Perry, desktops. When web applications are as diverse 2011). With advocates like this pointing towards and capable as native applications, the necessity HTML5 becoming a cross-platform standard to distinguish one from the other disappears. allowing developers to “write-once, deploy HTML5’s development opens the opportunity everywhere” (Holdener, 2011). Developing to create a feature-rich application that runs web applications that take advantage of this natively on the systems browser, therefore, ubiquity makes sense. Developing a system allowing for the content to be viewed on any which users can access from any device, on platform. Thus the content is universal and the any software platform is the biggest advantage audience is everyone. HTML5 is opening up HTML5 is affording developers. It is overcom- the web to everyone. ing proprietary and logistical obstacles like be- In conclusion, HTML5 is looking set to ing required to develop software for a particular become the bedrock language and high standard platform in specific, proprietary environments; on which the future web is built. HTML5 has or having to develop new, custom software for got major technology players in the mobile each individual device available to a particular, device industry behind it like Apple and Google projected audience. so there is too much at stake for it to fail its With options like the Geocoding API and goals. HTML5 offers new standards and fea- using the new standards like CSS 3 in innova- tures that were long overdue like allowing the tive ways to utilise the abilities and advantages display of multimedia content without the need of mobile platforms “it almost becomes just a for a plugin. (Video/audio) Support on mobile question of ‘when’ companies will adopt HTML devices is good and rapidly improving all the for app development rather than ‘if’” (Perry, time for HTML5 as it is progressing into the 2011). However, the specification for HTML5 future. Sure there are issues, but these issues becoming standardised is a slow process (James, can be resolved through time. But on that note,
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012 55 time will not be against HTML5 in implement- Grigsby, J. (2009, July 22). HTML5 from a mobile ing these new features to meet the needs of a perspective. Retrieved from http://www.cloudfour. fast evolving web. Companies like Adobe and com/HTML5-from-a-mobile-perspective/ Microsoft can enhance their plug-in features Harris, A. (2011). HTML5 for dummies quick refer- far more quickly than any standards group can ence. Indianapolis, IN: Wiley. push out new specifications through boards Hickson, I. (Ed.). (2011). HTML5 - A vocabulary and and committees. Hopefully all of the technical associated APIs for HTML and XHTML. Retrieved limitations that HTML5 has at the minute can from http://www.w3.org/TR/HTML5/ be overcome and help make HTML5 achieve Hinz, M., Fiala, Z., & Wehner, F. (2004, September). all of its goals. As the mobile web and mobile Personalization-based optimization of web interfaces device technology grows so will HTML5. for mobile devices. In Proceedings of the MobileHCI Conference, Glasgow, Scotland. Holdener, A. T. (2011). HTML5 geolocation. Sebas- REFERENCES topol, CA: O’Reilly Media.
Borck, J. (2010, August 18). Silverlight vs. Adobe HTML5 Rocks. (2011). Offline, HTML5 Rocks. Flash. Retrieved from http://www.infoworld.com/d/ Retrieved from http://www.HTML5rocks.com/en/ developer-world/infoworld-review-microsoft-silver- features/offline light-4-vs-adobe-flash-101-260?page=0,0 HTML. (2011). Living standard. Retrieved from Claburn, T. (2011, November 9). Adobe Axes Flash http://whatwg.org/html for Mobile and 750 jobs. Information Week. Retrieved James, J. (2008, August 27). HTML5 Editor Ian from http://www.informationweek.com/news/devel- Hickson discusses features, pain points, adoption opment/mobility/231902688 rate, and more, Tech Republic. Retrieved from http:// Dahlman, E., Parkvall, S., & Sköld, J. (2011). 4G: www.techrepublic.com/blog/programming-and- LTE/LTE-advanced for mobile broadband. Oxford, development/html -5-editor-ian-hickson-discusses- UK: Elsevier. features-pain-points-adoption-rate-and-more/718 Devlin, I. (2011, June 14). Finding your position with Kaikkonen, A. (2008). Full or tailored Web - Where Geolocation. Retrieved from http://HTML5doctor. and how do people browse on their mobiles? In Pro- com/finding-your-position-with-geolocation ceedings of the International Conference on Mobile Technology, Applications, and Systems (p. 28). Dhandhania, A. (2011). HTML5: Client-side stor- age. Retrieved from http://www.webreference.com/ Kim, A. (2008, June 16). Apple adopting Sprout- authoring/languages/html/HTML5-Client-Side/ Core for Web applications. Retrieved from http:// index.html www.macrumors.com/2008/06/16/apple-adopting- sproutcore -for-web-applications/ Dhar, S., & Varshney, U. (2011). Challenges and business models for mobile location-based services Lauke, P. (2010, December 16). New form features and advertising. Communications of the ACM, 54(5). in HTML5. Retrieved from http://dev.opera.com/ doi:10.1145/1941487.1941515 articles/view/new-form-features-in-HTML5/ DHTMLX. (2011). DHTMLX Touch. Retrieved from Lenhart, A., Purcell, K., Smith, A., & Zickuhr, K. http://dhtmlx.com/touch/ (2010). Social media & mobile Internet use among teens and young adults. Washington, DC: Pew In- Firtman, M. (2010). Programming the Mobile Web. ternet and American Life Project. Sebastopol, CA: O’Reilly Media. Lerner, R. M. (2011). At the forge: Communication Garwood, M. (2011, February 15). T-Mobile in HTML5. Linux Journal. Retrieved from http:// launches transparent data roaming plans. Retrieved www.linuxjournal.com/article/10945 from http://www.mobilenewscwp.co.uk/2011/02/t- mobile-launches-transparent-data-roaming-plans/ Maine, K. (2011, September 30). Percentage of web sites using HTML5. Retrieved from http://www. Godwin-Jones, R. (2011). Emerging technologies: binvisions.com/articles/how-many-percentage-web- Mobile apps for language learning. Language Learn- sites-using-HTML5 ing & Technology, 15(2), 2–11.
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited. 56 International Journal of Innovation in the Digital Economy, 3(2), 40-56, April-June 2012
Mims, C. (2011, June 7). Rise of the “hybrid” mo- Roto, V., & Kaikkonen, A. (2003, December 1-4). bile app. MIT Technology Review. Retrieved from Perception of narrow Web pages on a mobile phone. http://m.technologyreview.com/computing/37831/ In Proceedings of the 19th International Symposium on Human Factors in Telecommunications, Berlin, Mobile Metrics. (2011). Mobile Metrics Report. Germany. Retrieved from http://www.netbiscuits.com/mobile- metrics-report-2011 Rowinski, D. (2011, May 3). Web vs. native mobile app? Forrester says do both. ReadWriteWeb. Re- Ozks, B. (2011). Mobile Web V Desktop Web. The trieved from http://readwriteweb.com/archives/web_ Tech Journal. Retrieved from http://thetechjournal. vs_native_mobile_app_forrester_says_do_both.php com/internet/mobile-web-vs-desktop-web.xhtml Schmiedl, G., Seidl, M., & Temper, K. (2009). Mobile Pash, A. (2011, May 15). How HTML5 will change phone Web browsing – A study on usage and usability the way you use the Web. Retrieved from http:// of the mobile Web. St. Pölten, Austria: Institute of lifehacker.com/5416100/how-HTML5-will-change- Media Informatics. the-way-you-use-the-web Simpson, B. (2009, September 2). The Mobile Perry, R. (2011, July 8). Hybrid mobile apps take off Internet is always on and always active. CNN as HTML5 vs. native debate continues. Venture Beat. Money. Retrieved from http://tech.fortune.cnn. Retrieved from http://venturebeat.com/2011/07/08/ com/2009/09/02/the-mobile-internet-is-always-on- hybrid-mobile-apps-take-off-as-HTML5-vs-native- and-always-active/ debate-continues/ Roberts, A. (2011, March 7). Mobile nation HQ enables everyday people to build powerful mobile apps, and revolutionizes the way you publish them to your phone for free. Consumer Electronics Net. Retrieved from http://www.consumerelectronicsnet. com/articles/viewarticle.jsp?id=1388893
Kevin Curran, BSc (Hons), PhD, SMIEEE, FBCS CITP, SMACM, FHEA is a Reader in Com- puter Science at the University of Ulster. His achievements include winning and managing UK & European Framework projects and Technology Transfer Schemes. He has published over 700 published works to date. He is the Editor-in-Chief of the International Journal of Ambient Computing and Intelligence (IJACI). Dr. Curran is a Fellow of the Higher Education Academy, a Fellow of the British Computer Society and is listed by Marquis in their prestigious Who’s Who in Science and Engineering. He is also listed in the Dictionary of International Biography and by Who’s Who in the World.
Aaron Bond is a BSc student with the University of Ulster. His research interests include Internet Technologies, distributed systems and image processing.
Gavin Fisher is a BSc student with the University of Ulster. His research interests include HTML5 and programming.
Copyright © 2012, IGI Global. Copying or distributing in print or electronic forms without written permission of IGI Global is prohibited.
