Tomomi recently wrote about building a simple messaging service. We really liked the idea of being able to send and receive messages through a simple API, and decided to take it a step further: why not build on this API to allow people to send massages to each other.
I was invited to give a talk to the inaugural NLHTML5 meet-up in Amsterdam about how web standards have been made in the past, and how that will change in the future.
Media Capture is one of the most interesting features in web applications, especially for mobile devices. Surprisingly capturing media on the spot is quite a new thing for browsers in general, until recently always being delegated to browser plugins such as Flash or Silverlight. In this article we will explore how to use the Media Capture APIs, their compatibility across mobile browsers and the current state of the W3C specifications that define them.
Opera 14 for Android is built on top of Chromium 26, with a total overhaul of the UI in native code, making it fit well with the latest Android design guidelines. Go get the build from Google Play or point your browser to m.opera.com, and give it a spin!
The HTML5 specification includes two features for improving media accessibility — the WebVTT format, for marking up external text tracks such as subtitles and captions, and the <track> element, for applying those text tracks alongside HTML5 <video> and <audio>. This article provides a detailed introduction to both features, showing how you can make use of them in your projects today.
HTML5 includes the Drag and Drop API, which gives us the ability to natively drag, drop, and transfer data to HTML elements. Up until now, JavaScript libraries have commonly been used to achieve something similar. What libraries such as jQuery UI or Dojo can’t do, however, is interact with other windows, frames, and applications (to and from the file system) or access a rich drag data store.
HTML5 web messaging provides a way for documents to share data without exposing the DOM to malicious cross-origin scripting. This article provides an introductory guide to using this new functionality, and some simple examples to get you started.
One of the main problems HTML5 set out to solve was consistency, and therefore machine-readability, of markup. This article explains how the microdata DOM API helps with that.
In February, we released a first Labs build of Ragnarök, Opera’s HTML5 parser. This is a second build, with reduced memory usage, enhanced performance and lots of bug fixes.
HTML5 includes a means to set custom attributes on elements using the data- prefix. Called “data attributes”, they can be scripted to define and store data as well as increase options for attribute selection when styling with CSS.
Making its debut in a Labs build this week is Ragnarök, our implementation of the HTML5 parsing algorithm. We’d love you to try to break this and give us feedback, so please grab a copy to install on your machine…
Cristian returns this week with another detailed look at custom HTML5 <video> players! Following on from his last article, he shows us how to make a much more accessible, while still visually appealing, video player including WAI-ARIA support, captions, transcripts, and more.
In this article we make full use of the HTML5 video element and associated media elements API — along with jQuery and some CSS3 magic — to make a fully-customizable, themeable HTML5 video player. To round things off, the player is encapsulated as a jQuery plugin for easier reuse.
This article gives you an introduction to <video> and some of its associated APIs. We look at why native video support in browsers is important, give an overview of the element’s markup, and outline the most important ways in which video can be controlled via JavaScript.
The HTML5 <video> element provides a fantastic way to embed video into web pages without relying on plugins, and it is now supported in Opera, Firefox and Chrome, so things are looking up. One burning question however is “how do we provide alternative content for users that either can’t see, or can’t hear the video?” In this article, Bruce Lawson looks at the issue and suggests a solution.
There is increasing interest in, and importance being laid upon, making modern dynamic web applications more accessible. New specifications such as WAI-ARIA and HTML5 provide the means by which to do this; in this article Gez Lemon presents a solution for implementing accessible drag and drop functionality using JavaScript and WAI-ARIA. Some discussion of HTML5 drag-and-drop features is also included for good measure.
In this, the second part of Jacob Seidelin’s series on creating games using HTML 5, JavaScript, canvas and raycasting, he takes the game put together in Part 1, and adds better collision detection, performance improvements, scenery and enemies to chase you!
Jacob Seidelin has a lot of exciting tricks up his sleeve, with regards to creating games using HTML5 <canvas>. This week we are lucky enough to have him sharing some of his techniques with us, in the shape of some code for creating pseudo-3D first-person perspective games using canvas and raycasting.
To really make a splash on the Web, video needs an open solution that can easily be integrated into web pages without the need for proprietary plugins. The HTML5 <video> element and Ogg Theora can provide this, and Opera is proud to announce an experimental build that supports it. So read this article, and download and play with it today.
Blob Sallad is a fun little experiment put together to show some of the capabilities of the HTML5 canvas element, when combined with some JavaScript physics simulation. You can play with it at blobsallad.se, and read about how it works in this exclusive double-length article, written by its creator, Björn Lindberg.