Here are several useful resources for anyone interested in exploring modern web technologies, especially HTML5 and interactive browser effects.
HTML5 learning and experimentation
A good place to start is HTML5 Rocks, which brings together several different resources under one site:
- HTML5 Slides: The presentation is in English, but it is clearly designed and easy to follow even if English is not your first language.
- HTML5 Playground: This interactive page contains a range of HTML5 examples and source code. You can edit the code directly in the browser and immediately see what changes.
- HTML5 Tutorials: A collection of step-by-step tutorials covering different HTML5 techniques and features.
Together, these sections offer a useful combination of explanations, working examples, and hands-on practice.
A lightweight JavaScript library for dragging effects
Another interesting resource is DragDealer, a JavaScript library designed to handle different types of dragging interactions on the web. The script is small—about 12 KB even in its uncompressed form—and it has no dependencies, which makes it relatively simple to add to a project and use.
Apple’s HTML5 showcase
Apple also put together a showcase of HTML5-based web effects. Since the iPhone does not support Flash but does support HTML5, these examples provide a useful look at the kinds of experiences that can be built without relying on Flash. Some of the demonstrations require the Safari browser.
The showcase includes examples such as:
- Video effects
- Web typography
- Web gallery
- Photo transitions
- Audio
- 360°
- VR
- Canvas pixel manipulation
- Sticky notes
- Concert Poster
- Checkers
- Light table
- Offline calendar
- Movie trailers
These resources cover everything from introductory tutorials and editable demos to more polished examples of animation, media, typography, and canvas-based interaction. If you know of other useful web development resources in the same vein, they are worth sharing as well.