WebPlatform.org: A Resource for Web Development

WebPlatform.org is a new organization and collection of websites that will provide open source resources for web development. It will cover topics such as HTML5, Canvas, SVG, Video, Animations, IndexedDB, CSS, WebGL, Transforms, Audio, Media Queries and FileAPI.

HTML5 Status

HTML5 Logo.png

The World Wide Web Consortium (W3C) has announced that a final recommendation for HTML 5.0 will be released in the 4th quarter of 2014. In spite of the "recommendation" terminology that W3C uses, this is official release of HTML5. This is a big deal and great news. Browser developers will have a firm definition of HTML5 they can use to bring their products up to a complete level of support for this latest version of HTML.

W3C has also defined the follow-on version, HTML 5.1, to be released in the 4th quarter of 2016. This release will include features that have been pushed out in order to get release 5.0 completed in 2014. Without this stragegy, W3C was looking at an indefinite specification development timeframe. 

Browser developers are not waiting for 2014 to begin implementation of HTML5. You can use www.html5test.com to check the status of your browser to see which features are supported and www.caniuse.com for a summary of the status of support by all the major browsers.

Software Application Re-use

Software re-use has gained popularity and success due to technologies like Object Oriented Programming. Software classes and methods can be re-used based on their documented parameters and functionality.

The emergence of mobile apps over the last few years offers another level of re-use, that of whole applications. Instead of re-developing the functionality of an app (e.g. Google Maps) the app can be invoked by passing control to the app, providing it with a valid input (e.g. an address.)

Marketimpacts.com developed a series of Android apps based on applicaiton re-use. The Quickclick Locale series of apps uses the Google Maps API to map the locations of various types of places such as ATMs, Restaurants and Shops. The value added by Quickclick is an easy to use front end and app icons for different types of places.

To our surprise, there seems to be some resistance from other developers to app re-use. The only negative comments the Quickclick apps have received complain that the app is passing control to Google Maps to do the mapping.  Certainly, we could have created our own maps. But why? Are we really smart enough to out-develop Google? Would we really want to scramble to update our apps with new mapping capabilities to match Google? We think not. Google themselves promotes the idea of app re-use.

App re-use has some powerful advantages:

Lowered development costs: App functionality can be had for the cost of implementing a siimple interface to the app to be re-used.

Automatic upgrades: When the app you're re-using is upgraded, your app automatically benefits.

Higher quality: It's unlikely you'll be able to duplicate all the functionality of an existing app focused on a specific niche.

Leverage of user knowledge: If the app you're re-using is popular, many users will already know how to use it. This is certainly the case with Google Maps.

Access to complete app functionality: Some apps, including Google Maps, provide only limited functionality via an API (Application Programming Interface). By passing control to and re-using the entire app, your users gain access to full functionality.

What is HTML5 Canvas?

The Canvas feature of HTML5 is one of the most exciting new developments in web based capabilities in many years. Here are some key aspects:

HTML5 - Canvas is a part of the latest revision and improvement of the previous version (HTML4, released in the late 1990's) markup language for displaying web pages on the Internet.

Canvas Tag - The <canvas> tag joins the other HTML tags (there are around 100 now) as a way to include single or multiple Canvas areas on a web  page. 

Bit Map DisplayThe Canvas area you define with a <canvas> tag is a bit map display. You can manipulate individual pixels to draw objects, images, animations and video.

JavaScript ControlThe JavaScript language is used to control what is seen on the Canvas. The JavaScript application code is placed between the <head></head> and <script></script> tags of the web page.

Browser Based - The computing needed to create a Canvas display is done within the browser. In other words, it's client based, not server based. The means that creating a Canvas application is simpler than one requiring server based programming. It also means that the computing power needed to generate the Canvas display is not concentrated in single servers. Each user's browser handles its own work.

Animation - Canvas applications can generate animations. This is accomplished using callbacks from the browser. The Canvas application designates one of its functions to be called from the browser at specified time intervals. During each of these callbacks, the application draws a new Canvas display, moving objects slightly. When viewed as a continuous flow of Canvas displays, an animation is generated.

Audio/Video - Audio and video can be incorporated into your Canvas applications. Moving objects can create sounds and video images can be melded into other application objects. This is done without the use of any audio or video plugins.

Gaming - Game developers have all to tools necessary to create compelling HTML5 Canvas games.

Fun - Putting aside the technical aspects of Canvas ... it can be described as just plain fun. An HTML5 Canvas is a place where as a developer you can express your creative energies and as a user you can have expanded and enjoyable experiences.

For a more details look at HTML5 Canvas, watch for my upcoming book: HTML5 Canvas for Dummies.

Integrating Audio with HTML5 Canvas

One of the useful features of HTML5 Canvas is the ability to integrate audio, either with or without an audio player. Click here or on the image to see if it works on your browser ... click on my dog Daisy and/or the pelican to test simultaneous sounds.

When the new browser window opens, you can view the page source to see the code that generates the Canvas display.

This is one of the sample applications from HTML5 Canvas for Dummies.

HTML5 Canvas Performance Test

Browser support for HTML5 Canvas is constantly improving. More features are being supported and performance is improving. Click here or on the image below to see how your browser performs. The app rotates a ten layer gradient and displays the Frame Rate.

HTML5 Canvas on a Smartphone

HTML5 Canvas is a highly anticipated feature that allows web developers to create sophisticated graphics on their website pages. Most desktop and laptop browsers now support the Canvas feature. Mobile browsers are catching up. To see if your browser supports Canvas, you can access www.html5test.com for an analysis and rating of your browser.  Also, give this Canvas app a try:

Smartphone Installations Will Soon Outnumber PCs

According to a new study by IDC, smartphone installations will soon outnumber those of PCs.  Not surprising, really, but we've lived in a PC dominant world for long enough that the shift seems monumental.

Chart: Worldwide Smart Connected Device Shipments, 2010-2016 (Unit Millions)Description: This data comes from IDC's WW Quarterly PC Tracker, WW Quarterly Mobile Phone Tracker, and WW Quarterly Media Tablet and eReader Tracker.Tags: Tracker, mobile phones, tablets, forecast, PCs, devices, consumer, IDC ...Author: IDCcharts powered by iCharts

 

Managing Android Devices

Google has quite a task ... to manage an installed base of over a thousand different types of Android devices. Multiple sizes, shapes, features, etc. The positive way to describe this is variety. On the other hand, it has also been refered to as fragmentation.

So how do they do it? In short, leverage. A good metaphor is a mechanical shovel. Relatively compact machines can move and lift very heavy objects using a system of joints and lever articulation. Android does something similar.

The code in Android applications doesn't manipulate devices directly. There are intermediate joints and levers that make the task manageable. Application code is programmed using component names to refer to layout elements. Layouts are adjusted to device characteristics automatically by the Android operating system. This lets an individual line of code manipulate many different types of devices.

This is a simplified view of how it all happens. There are a number of Android features that make it work: Themes, Styles, Action Bars, Fragments, Resources and much more. When implemented properly, an Android application can move a thousand different types of devices.

Dealing with Android Fragmentation

So called Android fragmentation is caused by the large number of Android device types and operating system versions deployed in the market.  It's the flip side to the benefit of having a wide variety Android devices and capabilities.

There are currently over a thousand different types of Android devices on the market. It's simply not possible to support all of these without accomodating variations in device design.

Google provides a number of tools for addressing the compatibility necessary to serve this diverse universe of devices. These include:

Unified Support for Tablets and Handsets

Android 4.0 combines the support of tablets and handsets into a single release.

The Holo Theme Family

In Android 4.0 Google has made the inclusion of the unmodified Holo theme family a compatibility requirement for devices running Android 4.0 and forward. This will provide a level of uniformity across device implementations.

Support for Multiple Screens

Provides mechanisms for supporting multiple screen sizes and densities.

Action Bar Backward Compatibility

Google has recently developed a set of classes to give the Action Bar backward compatibility for pre Android 3.0 devices.  These classes invoke the action bar design pattern on pre-API 11 devices and the built-in Action Bar on devices supporting API 11 or greater.

Android Compatibility Package

This library is available through the SDK Updater. It gives backward compatibility for the new Fragments feature.

Compatibility Guidelines

Google provides guidelines on achieving compatibility across devices.

Android Action Bar Backward Compatibility

The Action Bar is a consistently formatted navigation and option selection area at the top of a screen with an overflow area at the bottom.
 
Key aspects of the Action Bar include:
  • It's a replacement for the menu feature.
  • It was introduced in Android 3.0 and refined in Android 4.0.
  • It's included in activities that use the Holo theme family.

Elements of the Action Bar graphic include:

  • Application icon.
  • Application name.
  • Up navigation to a parent screen.
  • Built-in tab navigation for switching between fragments.
  • Drop-down list for alternative navigation such as sort by a different criteria.
  • Important actions for a given app such as search and share.

Google has recently developed a set of classes to give the Action Bar backward compatibility for pre Android 3.0 devices.  These classes invoke the action bar design pattern on pre-API 11 devices and the built-in Action Bar on devices supporting API 11 or greater.

This is part of a larger set of capabilities for supporting application compatibility with multiple device environments including tablets and handsets and various screen sizes.

New Android Design Guidelines

Google has just released new, and very helpful, Android design guidelines. They're detailed on the Android developer website. The main webpage is shown below.

It's great to have these guidelines grouped in one place for easy access and they appear to be a step forward in developing an improved user experience ... both for the operating system and applications.

The Google Motorola Mobility Merger

The purchase of Motorola Mobility by Google is progressing. It has been approved by the Motorola Mobility shareholders and awaits approval by the U.S. government.

There has been speculation that one of the major motivations for Google is the patents held by Motorola Mobility. Owning these would help Google fend off patent lawsuits by other companies.

Aside from the legal aspects, the merger will likely have a number of benefits for Google. These could include:

  • Better insights into the interaction between hardware and software.
  • Improved ability to compete with the Apple hardware/software integration advantage.
  • An improved platform for testing new features.
  • Improved input from hardware designers into software development.

Can I Get an Ice Cream Sandwich?

Google's new Android version 4.0, dubbed Ice Cream Sandwich, is now available. However, for the moment, you'll only see it on new devices. Many of us with older model phones would like to have it retrofitted. Service providers will certainly get around to doing this with some of the more recent models, but older models may never get the dairy confection.

For those of us adventurous enough, "rooting" our phones and loading an Ice Cream Sandwich ourselves is an option. Please see our Blog entry on Rooting for more information before you give it a try.

What's Up with HTML5?

HTML5 is the first major update to the HTML standard since HTML4 was standardized in 1994. Full approval by standards bodies and complete implementation may take another decade, but parts of HTML5 are already being implemented.

Each browser supports HTML5 to a different degree. The www.html5test.com website can be used to test the extent to which a browser currently supports HTML5. 

The screens to the right were taken from a test of a Droid X running Android version 2.3.3. It scored 177 points out of a total of 450. As is evident from this test, smartphone browsers are not very far along in implementing HTML5 features. The lower screen to the right shows the status of some desktop browsers.

Possibly the most well known of the HTML5 features is the new tag that will avoid the need for Flash in playing videos. This is especially important now that Adobe has announced it will stop development of Flash for mobile devices.

HTML5 contains many new features. A number of these are focused on eliminating the need for proprietary plugins and Application Programming Interfaces (APIs.) This advances the idea of being able to develop applications that will run on any device that supports HTML5, including multiple smartphone, tablet and desktop brands.

Rooting - What It Is and Why to Think Twice Before Doing It

In brief, rooting your phone refers to making changes to the phone operating system so that you can load a different version of the system than the one that's pre-loaded into your phone.

Reasons users root their phones include: enhancing performance, to get a different look and feel, to have more flexibility in what software can be used, getting the latest Android releases and to have some technical fun.

The term rooting refers to getting privileged root control access within the Android Linux core system. Rooting is necessary to install custom versions of the Android system. One of the more popular of these is CyanogenMod. It offers such features as improved sound processing, additional display themes and improved processing speed.

There has been quite a bit of controversy over rooting. Some vendors and carriers discourage it and some support it.

Potential risks include: voiding your warranty, loosing data and "bricking" your phone thus rendering it inoperable. Those that choose to root are comfortable with these risks and see them as being outweighed by the  benefits. They're also willing to invest the time needed to make sure that rooting is done correctly and can be undone if something goes wrong.

The exact process of rooting can vary by type of device. It's necessary to find instructions specific to your Android phone. There are websites dedicated to rooting where you can find this information along with help for dealing with problems caused by rooting.

Essentially, rooting involves "flashing" (changing) a phone's ROM, or Read Only Memory. There are ROM Manager apps available on the Android Market that can be used to backup, change and restore ROM contents.

So, if you have the time and sense of adventure, rooting might be just the right thing for you. 

If not, you can wait for new phone releases to bring you many of the benefits of rooting without the risk and hassle.

Google Improving Mobile Ad Relevance

Google has just announced improvements in mobile search advertising. (See the Google Blog post for more information.) Apps that incorporate search capabilities will see more relevant ads appearing on their screens.

To date, mobile ads appearing on smartphones have not been particularly relevant to the nature of the apps displaying them. In contrast, desktop search ads are highly relevant to the search terms used. So, for example, if I'm searching for information on bicycles, I'll see ads related to this topic.

Making mobile ads more targeted should improve ad click through rates and improve user satisfaction.

If I'm searching on my smartphone for bicycles, I'll see ads related to bicycles, including information on bicycle shops near my current location.