28 Jun
Offline Web Applications in HTML5 are wonderful when they work. Visitors can view our site while on the subway or otherwise offline, and our sites load faster when they’re online.
Unfortunately, when things go awry, Offline Web Apps can be a horrible beast to debug. I wanted to outline some common things that can go wrong. Continue reading
Tags: app cache, application cache debugging, debugging offline web apps, failed to parse manifest, invalid manifest mime type, resource fetch failed
21 Jun
CSS3 gives us a number of new properties in order to quickly add shadows to our elements. There’s box-shadow, which will add a drop shadow, inset shadows and even text-shadows. These are easy to add and their support extends to all browsers, apart from IE 8 and earlier.
However, if you have something more complicated in mind for your element’s shadow, these properties don’t always do the trick. In this post, we’ll build a more complex shadow by combining several CSS properties together: CSS3 gradients and transforms, z-index and position. You can find the complete code and demo here, or play with the code yourself on JSFiddle.
Continue reading
Tags: css3 shadows, css3 transform, css3 tricks
17 Jun
One of the more powerful new JavaScript APIs in HTML5 is the Canvas API. It’s based conceptually on Apple’s Quartz Drawing framework, and involves adding the new canvas element to your HTML, and then drawing to it via calls to the Canvas JavaScript API.
An excellent example of what you can do with canvas is the How fast is your typing app that was an entry in the 10k Apart Contest. The contest challenged developers to build a web application in less than 10kb.
Here’s a screenshot of the app, but to truly do it justice, you really need to play it!
Tags: canvas, typing games
16 Jun
There’s an excellent article on O’Reilly Radar by a former JavaScript HATER, Mike Loukides, on why everyone needs to learn JavaScript this year. HTML5 plays prominently into his reasoning:
HTML5… [is] about enabling JavaScript to do more powerful things. The WebGL library (which is still bleeding edge) allows real-time 3D graphics inside an HTML5 canvas. HTML5 geolocation allows you to write location-aware applications in the browser (a basic capability for mobile phones). Persistent storage and offline functionality have enabled developers to write full-fledged applications, with the same functionality you’d expect on a desktop, that run in the browser.
Read more at: http://radar.oreilly.com/2011/06/time-to-learn-javascript.html
Tags: html5, javascript, JS haters
