File Under Cool Tools: Record Page Load Video With WebPageTest

As you could probably guess since Performance is one of the six site categories around here, I’m a fan of WebPageTest. You can imagine my reaction to the news that page load videos are now available from the service.

From Recording video with WebPagetest:

One of the things we like to look at is what a page looks like when it is loading, particularly if you are comparing a before and after or multiple sites to each other. This is particularly helpful when talking to the business about performance and sometimes the raw load times don’t adequately represent the user experience.

Up until now this has been a pretty manual process where we screen record a video while loading a site then load it up into Premiere and stitch it together.

Starting today, you can have WebPagetest record a video of a page load directly. It’s still in a pretty rough form and it’s going to be a while before it’ll be ready for the masses but what is there is already pretty powerful and extremely flexible.

read the rest of this article…

Very cool. I can think of two or three presentations where video of page load would have been super useful and will definitely find a use for the feature in the near future.

HTML5 Notes: My First Time Using the Canvas Element

Quick verdict? It’s fun.

The long verdict (albeit one not base on the work I did here?) The accessibility concerns are valid and will need to be addressed before we end up with a replay of Flash circa 2000. And no one wants that.

Anyway, the example I did do for the demo is actually one of the use cases imagined when the Canvas element was introduced. I took a simple data table and turned it into a simple chart. This is obviously not the most complicated, impressive example of the technology, but it’s an easy one to digest so it’s a perfect way to highlight the technology as part of a 45 minute presentation. Especially since I’ve got to run through another five or six features of the spec.

Anyway, here’s the example.
Continue reading “HTML5 Notes: My First Time Using the Canvas Element”

As If URL Shorteners Alone Weren’t Bad Enough, Now They’ve Mated With URL Hijacking Frames

The Digg Bar is the most obvious (and noxious) example, but the new trend of URL shorteners coupled with a URL hijacking frame is spreading alarmingly. More and more I’m seeing this odious technique. These things break bookmarks, wreck navigation cues from the URL and are generally sleazy and rude.

And there’s how to beat them. Insert this code in the head of your document and frames will disappear:

Best Frame-buster JavaScript

Continue reading “As If URL Shorteners Alone Weren’t Bad Enough, Now They’ve Mated With URL Hijacking Frames”

HTML 5 Notes: The Video Element Rocks

Now if we could just get everyone to support it.
Continue reading “HTML 5 Notes: The Video Element Rocks”

HTML 5 Notes: In Case a Client Asks… No Full Screen Video

I’m going to be posting a series of notes on the production of my first HTML 5 demo page. I’m doing a presentation on it at work (to be shared here, of course) and I want to capture my thoughts as I have them in the process of producing some fully formed HTML5 content.

One of the things I’m looking at with interest is the new Video element. Anything that simplifies embedding video on a web page gets a thumbs up in my book.
Continue reading “HTML 5 Notes: In Case a Client Asks… No Full Screen Video”