For all you out there who like to keep tabs on new developments in the browser markets, Safari 3.1 has been seeded for testing and it seems they’ve incorporated a number on the new WebKit features!

Here’s a select few examples:

Downloadable Fonts

The idea of downloadable font’s isn’t really anything new but WebKit now supports the @font-face rule:

@font-face {
  font-family: "MyFont";
  src: url(http://www.example.com/fonts/MyFont.ttf) format("truetype");
}

h1 { font-family: "MyFont", sans-serif }

Will this be the end of image replacement and sIFR?

HTML5 Audio and Video

The new HTML5 <video> and <audio> elements add native support for embedding video and audio content in web pages. They also provide a rich scripting API for controlling playback. Adding video to a web page is almost as simple as adding an image.

For example, adding a video is as simple as

<video src="sample.mov" autoplay></video>

and you have controll access through JavaScript as well:

function toggleVideo() {
    var myVideo = document.getElementsByTagName('video')[0];
    if (myVideo.paused) {
        myVideo.play();
    } else {
        myVideo.pause();
    }
}

Sweet!

HTML5 SQL Storage

The client-side database storage API allows web applications to store structured data locally using a medium many web developers are already familiar with - SQL. The API is asynchronous and uses callback functions to track the results of a database query.

Wow, client side SQL? Now that might be more useful than a Cookie!

var database = openDatabase("Database Name", "Database Version");
database.executeSql("SELECT * FROM test", function(result) {
    // do something with the result
});

There is a working example on the WebKit blog, but you’ll need WebKit of course.

If you’re interested in playing around, you can download the latest nightly builds at nightly.webkit.org.