Home » Archive

Articles tagged with: html5

Cool & Future Tech, Featured, Headline, html5, Web Experiments »

[17 Jul 2013 | 6 Comments | ]
Build an MPEG-DASH player from Scratch

This post will show you how to build an MPEG-DASH video player using Javascript.
tl;dr? Skip to the demo (chrome only) http://francisshanahan.com/demos/mpeg-dash.
Dynamic Adaptive Streaming over HTTP (DASH) enables streaming of media content delivered from conventional HTTP web servers. Fragments served are static pieces of media so no server-side component required. This is very similar to HLS but unlike HLS MPEG-DASH is the first adaptive bit-rate HTTP-based streaming solution that is an international standard. Reference [LINK]
The recent Build conference announced Netflix’s plan for Playready DRM+HTML5 in the browser without plugins, …

Featured, Headline, html5, Technology »

[7 May 2013 | No Comment | ]
The Truth about Netflix and HTML5 vs. Silverlight

There has been a lot of hype recently about Netflix “dumping” Silverlight in favour of HTML5.
A quick Google reveals multiple articles rotating the same sound-bytes [LINK], [LINK] or [LINK].
So what’s the truth? Is the sky really falling? In my opinion there are some inaccuracies or rather inflated truths here which are being bounced around the “lite” tech echo chambers of Gizmodo, CNET and the like.
I will offer here my opinion on what is really going on.
Is Netflix moving away from Silverlight? Yes. In fact ALL streaming media providers …

Featured, Headline, html5 »

[6 Jul 2011 | 17 Comments | ]
Mycellium Source Code Available

Last time [LINK] I discussed how virtual Worms could “eat” a picture, seeking out the lighter or darker areas as food and leaving a trail in their wake. I’ve dumped the source here: http://francisshanahan.com/demos/worms/test.html so you can interact, create your own images and figure out how it’s done. To be honest I haven’t had much time to clean this up as I’ve been focusing on other things and doing a bit of travel for work so be gentle.
Just enter a URL of an image and click “create drawing” to …

Cool & Future Tech, Featured, Headline, html5, Web Experiments »

[24 Jul 2010 | 4 Comments | ]
Create CSS Rules from an HTML5 Canvas

Here I show how you can re-use your Canvas images as CSS backgrounds using another interesting feature coming in HTML5. You’ll need a browser supporting CSS3 and Canvas, Chrome, Opera, Safari or Firefox will do.

Cool & Future Tech, Featured, Headline, html5, Web Development, Web Experiments »

[21 Jul 2010 | One Comment | ]
Identicon5 – Identicons using HTML5 Canvas & JQuery

What do you get when you combine Digital Identity, MD5 Hashes, the Canvas element, JQuery and Quilting? Answer: My first JQuery plugin – “Identicon5″ for want of a better name.
Identicon5 is a JQuery plugin that takes an MD5 hash and converts it to a unique image. It’s called Identicon5 since it works through the HTML5 Canvas element.
Working Demo is here: http://francisshanahan.com/identicon5/test.html
Project page is here: http://francisshanahan.com/index.php/identicon5
JQuery Plugin page is here: http://plugins.jquery.com/project/identicon5
Identicons provide a nice visual representation of a user’s identity, that’s unique to that user, without divulging any …

Cool & Future Tech, Featured, Headline, Web Development »

[15 Jul 2010 | No Comment | ]
New Input Types in HTML5

I’ve recently been doing a lot of digging into quote/unquote “newer” browser capabilities, some of which are very cool. I will share what I’ve discovered as I go.
As always I’m using a little “test project” as my sandbox, this is a real-world website that’ll use all these features and I’ll share that when it’s done.  So far I’m using oAuth/Twitter integration, ASP.NET MVC/JQuery as a basic stack and am adding in HTML5 and CSS3 features. The resulting site will not be pretty but the point for me is always to …

Cool & Future Tech, Featured, Headline, html5, Web Development, Web Experiments »

[13 Jul 2010 | One Comment | ]
HTML5 Canvas vs SVG

What is the new Canvas tag in HTML5 all about? And why would I use it over SVG (scalable vector graphics)? I took a look and here’s what I found out…

Cool & Future Tech, Featured, Headline, Web Development »

[2 Jul 2010 | 3 Comments | ]
Converting the WordPress Arthemia Theme to HTML5

The other day I converted the current WordPress theme of this site from XHTML Transitional 1.0 to HTML5. It was fairly easy so here’s what I did.
An XHTML 1.0 transitional website was a great place to start. I used the trusty w3c validator located at http://validator.w3.com.
First thing was to get the Doctype fixed up: I changed
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<!DOCTYPE html>
and bingo, we’re recognized as HTML5 instead of XHTML. Not compliant yet though. I removed the profile attribute from my head tag as so:
<head profile=”http://gmpg.org/xfn/11″> which wasn’t …