So, looks like there’s a new App Store alternative around these days: OpenAppMkt! Basically they’re doing their best to replicate the App Store experience with HTML5 apps; and they seem to be getting a little bit of traction. As well as a good deal of frenzied yammering about “loopholes” and the like, from people whose memories apparently are not good enough to extend back to 2007 when we were all being told that HTML5 would be the only way to write iPhone applications. My, my, how things do change.
But, as we’ve pointed out before, Apple has continually improved the HTML app capabilities and development experience right along with SDK development; it’s just that people almost completely ignore that alternative … even when an HTML app makes scads more sense for what they have in mind. As well as being potentially cross-platform and all, especially as WebKit-based browsers continue their apparently inexorable march towards complete dominance of the mobile landscape.
But the thing that actually intrigued us whilst reading around on OpenAppMkt is that although several commentators have mentioned that Apple has their own web app directory, absolutely not a single piece we read seemed to have any idea of the existence of the first HTML app marketplace, that we posted about pretty much exactly a year ago; Hottrix and their Premier App Shop,
another genre-specific shop that blushing modesty bars us from mentioning, and Your App Shop for creating your own store.
Why that initiative hasn’t, in a year, seemed to go anyplace in particular and OpenAppMkt seems to have pretty solid interest out of the gate rather escapes us. Maybe the timing was wrong before, maybe the technology is better now (although the Premier App Shop webapp actually seems like the superior user experience to us) or maybe … well, we dunno. if anyone has any insights, please share!
Here’s a collection of iPhone-targeted HTML5 links we stumbled across recently, for whenever it is you decide to get into writing cross-platform or non-AppStore apps:
Tutorial: Your First Mobile HTML5 App – The Basics, Forms, and Geolocation (Part 1)
Tutorial: Your First Mobile HTML5 App – Offline Storage (Part 2)
Nice and easy introduction.
HTML fullscreen apps for the iPad
Some handy formatting tips.
Create offline Web applications on mobile devices with HTML5
From IBM developerWorks, no less; provides a sample inventory management application, tested on an iPhone 3GS and a Palm Pre.
Opensourcing Golingo
Source of a word puzzle game published in the App Store, created with Titanium Mobile and Web code.
Akihabara
Sprite library using the canvas tag, targeted at retro pixelated games; several playable demos.
Japstore – The free Javascript application store
Bookmarkable Javascript applications and a downloadable SDK to create them.
Parcycle: A Particle System with HTML5 canvas
Oh, we just love those particle systems, yes we do. Browser and offline webapp demos for your hypnotic pleasure. And dig around on the site for other links to various webapp examples.
UPDATE:
Learn HTML5: 10 Must Read Lessons has a bunch of good stuff.
Here’s a new feature that snuck into the iPad’s version of WebKit: CSS orientation media queries!
Using orientation in CSS is very simple. The code looks like this:
<link rel=”stylesheet” media=”all and (orientation:portrait)” href=”portrait.css”>
<link rel=”stylesheet” media=”all and (orientation:landscape)” href=”landscape.css”>
Yeah, doesn’t get much simpler than that. And it works on non-sucking desktop browsers too, just resize the window narrow to see. Presumably this would be a handy tip for laying out content in your iPad (and no doubt iPhone after the next OS rev) apps via UIWebView and getting orientation changing in a straightforward fashion as well, with any luck.
Also check out the article comments for other handy tips on iDevice-friendly web page layout!
h/t: maxvoltar!
Here’s another one in our dribble of occasional mentions of the offline HTML5 alternative to building iPhone applications, just in case we ever have a problem with App Store restrictions or the need for a cross-mobile-platform deliverable enough to actually get into it:
How to Make an HTML5 iPhone App
… I’ll show you how to create an offline HTML5 iPhone application. More specifically, I’ll walk you through the process of building a Tetris game.
What am I talking about when I say “offline”? Well, it means that we have a custom icon, a custom startup screen, a native look-and-feel, and you can use the app even when the phone isn’t connected to the Internet.
The app should be as functional as it can when it is offline, just like normal native mobile apps.
This is a tutorial specifically for iPhones but most of these techniques apply to all phones that have HTML5-capable browsers…
Thorough walkthrough, easy to follow, covers offline data storage even. Good stuff, good stuff!
h/t: MobileOrchard!
Oooh, this is just the thing for those with the artistic ability of trolls: an attribution-licensed complete website for an iPhone application!
Not only that, full documentation here. Good stuff, good stuff.
And if you want Wordpress support or the source .psd files, here is the commercial version!
h/t: iPhoneSDK!
Here from the awesomely-named Cats Who Code blog is an article of 10+ Useful Code Snippets To Develop IPhone Friendly Websites — some of which are interesting for use in your UIWebView-presented embedded content as well, looks like:
- Detect iPhones and iPods using Javascript
- Detect iPhones and iPods using PHP
- Set iPhone width as the viewport
- Insert an iPhone specific icon
- Prevent Safari from adjusting text size on rotate
- Detect iPhone orientation
- Apply CSS styles to iPhones/iPods only
- Automatically re-size images for iPhones
- Hide toolbar by default
- Make use of special links
- Simulate :hover pseudo class
The blog looks pretty interesting in general if you’re into HTML, WordPress, etc. at all. Which, yeah, we will be one of these days, at least to find a theme that’s actually readable to save our Gracious Readers’ eyes. Just as soon as things slow down just a smidgen. 2018 is looking not bad. So far…
Now this is an intriguing twist on the App Store discussed over here at Mobile Orchard: Let’s say you’ve written a clever piece of JavaScript to extend Mobile Safari, like for instance
So, instead of writing a complete Safari replacement to add the missing Find In Page capability, you write JavaScript to take the search term and then find it in the page. Add that JavaScript as a bookmark and you’re all set.
Now, let’s say you feel like monetizing that. Through the App Store. The App Store? Why yes, through the App Store!
Vais’ twist is this: he’s selling his bookmarklet in the App Store for $0.99. His angle is clever: he’s created a simple app that places the bookmarklet JavaScript on the pasteboard. The user can then add a bookmark and set its location by pasting the JavaScript…
Now that’s a cool idea. Wouldn’t have occurred to us that Apple allows such a thing, but the proof is in the pudding. Where by “the pudding” we mean “the App Store”, of course. So there you go, if you have some clever browser extension code, now you know how to monetize it!
So we’ve mentioned favorably before that using HTML5 to build iPhone apps is an interesting looking alternative, but there’s been a dearth of public information targeted specifically at that. Well, now there is! Over at O’Reilly Labs they’ve published
Building iPhone Apps with HTML, CSS, and JavaScript
Now web designers and developers can join the iPhone app party without having to learn Cocoa’s Objective-C programming language. It’s true: You can write iPhone apps quickly and efficiently using your existing skills with HTML, CSS, and JavaScript. This book shows you how with lots of detailed examples, step-by-step instructions, and hands-on exercises.
- Learn how to build iPhone apps with standard web tools
- Refactor a traditional website into an iPhone web app
- Hook into advanced iPhone features (e.g. accelerometer, geolocation, vibration, and sound) with JavaScript
- Do most of your development with the operating system of your choice
Yes, we’ve definitely got that on the reading list. Just as soon as there’s a spare minute around here…
h/t: DZone!
So you’ve no doubt noticed references here and there to the nifty new HTML5 stuff that’s working its way out into the world, but there’s been a positive dearth of good introductions out there, as opposed to snippets trickling out here and there; well, here’s a good start on sorting that from our friends at Google:
Video Introduction to HTML5
We’ve put together an educational Introduction to HTML 5 video that goes over many of the major aspects of this new standard, including:
- Web vector graphics with the Canvas tag and Scalable Vector Graphics (SVG)
- The Geolocation API
- HTML 5 Video
- The HTML 5 Database and Application Cache
- Web workers
In the video we also crack open the HTML 5 YouTube Video prototype to show you some of the new HTML 5 tags, such as nav, article, etc. It’s chock full of demos and sample source code.
Well worth the watch. Especially in light of the news that Google is going to drag Internet Explorer users kicking and screaming into the current millennium by, essentially, delivering WebKit as an IE plugin. They must be feeling pretty nervous down in Redmond these days!
[EDIT: And here's another link-laden HTML5 overview worth checking out!]
And a little something for our web developer friends today: if you’re into jQuery — and seems everybody is, these days — there’s a plugin called jQTouch for your mobile WebKit programming needs, and sounds like the new beta version is indeed all that and a ham sandwich:
Just wanted to let everyone know I just released a new beta for jQTouch — a jQuery plugin for mobile development, similar to iUI. The new beta has a ton of features like native animations, event callbacks (including swipe detection), and a ton of shortcuts for creating fullscreen apps.
Pretty impressively updated from our first mention back in March … enough we figure to merit a reminder in case you weren’t bowled over back then!
h/t: iPhoneWebDev!
