Archives For html5

LongTailVideo, makers of the popular JW Player (a video player for Web pages), just posted a long article titled “The State Of HTML5 Video.” I used JW Player on a couple of projects and was quite pleased with its usability and reliability. My experience was with using JW Player to present Flash video, but the player has since been modified to serve either Flash content or HTML5 video, which is great. Towards that end, the article presents the current state of HTML5-related features and functionality, with lots of stats about browser compatibility, what attributes and video formats can be used, and so forth.

If you present video on Web sites, whether you use the JW Player or not, it’s worth checking out to know where things stand. LongTailVideo intends to maintain and update that article as changes in the industry (such as statistical changes and the like) evolve.

I recently stumbled upon impress.js, a truly amazing Web-based presentation tool. You have got to check out the demo page (in a modern browser), you will be blown away. After running through the presentation (which will only take a minute), check out the HTML source code to be further amazed. I’m normally not this hyperbolic, but I was quite stunned by what was possible with impress.js. Besides being a useful tool for HTML-based presentations, this library is capable of changing how one thinks of presentations as a concept. Instead of presenting information in a linear, traditional format, with impress.js, you can do things like go from a bigger picture to a smaller picture, to be able to zoom in on content, as it were. If you pay attention to the URLs, you’ll note that impress.js also creates bookmark-able pages, which is an added bonus.

If you check out the corresponding README file on GitHub, you’ll find links to other presentations created with impress.js. A couple of presentations are quite useful in that they demonstrate, in my opinion, an overuse of impress.js. Those particular presentations use the rotation feature to such as extent that it makes one dizzy, which is normally not a good quality in a presentation (although one presentation is talking about 3D transformations, so there’s some justification there). One does worry that if impress.js catches on too much, we’ll all be sick of rotating transitions in no time.

For an example of another interesting use of impress.js, check out lioshi toiles, where impress.js creates a site that displays artwork in a truly interesting way. Taken a step further, Al Ingham’s site, uses impress.js for custom navigation and presentation, while still providing direct links to specific pages across the top of the page (because walking through all the “slides” to get where you needed to be is unreasonable).

If only I had any design skills whatsoever…

In this edition…

Continue Reading…

HTML5-based Mobile Apps

September 6, 2011

Some time back I posted a link to an article I read on the Chicago Tribune’s Web site (the article was later pulled from that site, for an unknown reason). The article discussed how the Financial Times and ESPN created “mobile apps” using HTML5 instead of native code. It’s an interesting concept:

  • HTML5 offers many features of conventional apps, such as support for gestures, ability to handle video, local storage capability, and offline usability.
  • The same application will be virtually guaranteed to work on multiple devices (mobile devices by their very nature use extremely current browsers).
  • Apps can be updated without the user having to download and install anything (and, actually, the user never installs anything anyway).
  • HTML5-based apps can be “distributed” without going through proprietary systems like Apple’s App Store.

It’s this last point that impacted the Financial Times’s decisions to go with a Web app, as detailed in this recent article at Macworld.

To be fair, an HTML5-based app is clearly lacking many features that conventional mobile apps can offer. And because HTML5-based apps use the device’s browser, it’s a different, less branded, user experience, even though some steps can be taken to equate the two (as the article discusses). But just one year ago, if you wanted to develop mobile apps for iOS devices, you had to: own a Mac, know Objective-C, and distribute through Apple’s App Store (okay, you didn’t technically have to, but you essentially had to). To develop mobile apps for Android devices, a separate set of skills, software, and destinations was required. Now you have two great alternative routes: using HTML5 or Adobe Flex+AIR (as I’m doing).

In this edition…

Continue Reading…