<?xml version="1.0" encoding="UTF-8"?> <rss
version="2.0"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:wfw="http://wellformedweb.org/CommentAPI/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:atom="http://www.w3.org/2005/Atom"
xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
> <channel><title>HTML5 Gallery &#187; video</title> <atom:link href="http://html5gallery.com/tag/video/feed/" rel="self" type="application/rss+xml" /><link>http://html5gallery.com</link> <description>A showcase of sites using HTML5 markup</description> <lastBuildDate>Wed, 16 May 2012 09:00:17 +0000</lastBuildDate> <language>en</language> <sy:updatePeriod>hourly</sy:updatePeriod> <sy:updateFrequency>1</sy:updateFrequency> <generator>http://wordpress.org/?v=3.3.2</generator> <item><title>Michael K. Clements</title><link>http://html5gallery.com/2012/04/michael-k-clements/</link> <comments>http://html5gallery.com/2012/04/michael-k-clements/#comments</comments> <pubDate>Tue, 03 Apr 2012 09:00:26 +0000</pubDate> <dc:creator>Ian Devlin</dc:creator> <category><![CDATA[Portfolio]]></category> <category><![CDATA[css3]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[nav]]></category> <category><![CDATA[video]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7845</guid> <description><![CDATA[The main navigation uses a nav element and is a good example of how nav doesn&#8217;t have to contain a ul or ol list of items. The video element is used although oddly the WebM video wouldn&#8217;t play in Firefox &#8230; <a
href="http://html5gallery.com/2012/04/michael-k-clements/">Continue reading <span
class="meta-nav">&#8594;</span></a>]]></description> <content:encoded><![CDATA[<p>The main navigation uses a <code>nav</code> element and is a good example of how <code>nav</code> doesn&#8217;t have to contain a <code>ul</code> or <code>ol</code> list of items. The <code>video</code> element is used although oddly the WebM video wouldn&#8217;t play in Firefox 11.</p><p>The page <code>charset</code> definition could have made use of the new shorter code that HTML5 brings with it. Remember that the <code>script</code> and <code>link stylesheet</code> elements no longer require the <code>type</code> attribute.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2012/03/michaelkc-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="michaelkc.com">michaelkc.com</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/04/michael-k-clements/feed/</wfw:commentRss> <slash:comments>12</slash:comments> </item> <item><title>Tatiana Bileski</title><link>http://html5gallery.com/2012/03/tatiana-bileski/</link> <comments>http://html5gallery.com/2012/03/tatiana-bileski/#comments</comments> <pubDate>Fri, 30 Mar 2012 11:50:45 +0000</pubDate> <dc:creator>Derek Johnson</dc:creator> <category><![CDATA[Personal]]></category> <category><![CDATA[Portfolio]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[video]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7861</guid> <description><![CDATA[The personal site of designer Tatiana Bileski. HTML5 structural elements are used in the site, although there are too many untitled sections being used where div would be better. However it&#8217;s nice to see native video in use, and with &#8230; <a
href="http://html5gallery.com/2012/03/tatiana-bileski/">Continue reading <span
class="meta-nav">&#8594;</span></a>]]></description> <content:encoded><![CDATA[<p>The personal site of designer Tatiana Bileski.</p><p><abbr>HTML</abbr>5 structural elements are used in the site, although there are too many untitled <code>section</code>s being used where <a
href="http://html5doctor.com/you-can-still-use-div/"><code>div</code> would be better</a>. However it&#8217;s nice to see native <code>video</code> in use, and with the <code>poster</code> attribute.</p><p>in use, and with the</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2012/03/tatiana-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://www.tatianabileski.com/">http://www.tatianabileski.com/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/03/tatiana-bileski/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>Auricchio</title><link>http://html5gallery.com/2011/08/auricchio/</link> <comments>http://html5gallery.com/2011/08/auricchio/#comments</comments> <pubDate>Thu, 11 Aug 2011 16:30:08 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[ECommerce]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[video]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7238</guid> <description><![CDATA[Italian makers of Provolone. The site uses several new elements and also uses HTML5 video rendered using VideoJS. URL: http://www.auricchio.it/]]></description> <content:encoded><![CDATA[<p>Italian makers of Provolone. The site uses several new elements and also uses HTML5 video rendered using <a
href="http://videojs.com">VideoJS</a>.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/07/auricchio-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://www.auricchio.it/">http://www.auricchio.it/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2011/08/auricchio/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>HTML5 Tuts</title><link>http://html5gallery.com/2011/07/html5-tuts/</link> <comments>http://html5gallery.com/2011/07/html5-tuts/#comments</comments> <pubDate>Wed, 06 Jul 2011 17:00:01 +0000</pubDate> <dc:creator>Derek Johnson</dc:creator> <category><![CDATA[Blog]]></category> <category><![CDATA[audio]]></category> <category><![CDATA[canvas]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[contenteditable]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[drag and drop]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[forms]]></category> <category><![CDATA[localStorage]]></category> <category><![CDATA[sessionStorage]]></category> <category><![CDATA[svg]]></category> <category><![CDATA[video]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7033</guid> <description><![CDATA[An HTML5 tutorial and demo site created by Alex Jones as a university project. Plenty of good demos here on a wide range of HTML5 features and APIs. In one or two places the article element is used without a &#8230; <a
href="http://html5gallery.com/2011/07/html5-tuts/">Continue reading <span
class="meta-nav">&#8594;</span></a>]]></description> <content:encoded><![CDATA[<p>An <abbr>HTML</abbr>5 tutorial and demo site created by Alex Jones as a university project.</p><p>Plenty of good demos here on a wide range of <abbr>HTML</abbr>5 features and <abbr>API</abbr>s. In one or two places the <code>article</code> element is used without a heading as more of a generic wrapper, but overall a great resource and very well put together.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/07/html5tuts-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://www.html5tuts.co.uk/">http://www.html5tuts.co.uk/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2011/07/html5-tuts/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>Radio Deejay Visual Player</title><link>http://html5gallery.com/2011/07/radio-deejay-visual-player/</link> <comments>http://html5gallery.com/2011/07/radio-deejay-visual-player/#comments</comments> <pubDate>Mon, 04 Jul 2011 23:37:08 +0000</pubDate> <dc:creator>Derek Johnson</dc:creator> <category><![CDATA[Music]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[svg]]></category> <category><![CDATA[video]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=6996</guid> <description><![CDATA[A site with photos, videos and lyrics of Skunk Anansie, Duran Duran and Take That. Everything takes place on a single page, and it is all very well structured in terms of markup and the document outline. Each of the &#8230; <a
href="http://html5gallery.com/2011/07/radio-deejay-visual-player/">Continue reading <span
class="meta-nav">&#8594;</span></a>]]></description> <content:encoded><![CDATA[<p>A site with photos, videos and lyrics of Skunk Anansie, Duran Duran and Take That.</p><p>Everything takes place on a single page, and it is all very well structured in terms of markup and the document outline. Each of the videos is, naturally enough, a <code>video</code> element with both mp4 and ogv <code>source</code>s.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/07/deejay-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://www.deejay.it/D5/contest/index-eng.html#">http://www.deejay.it/D5/contest/index-eng.html#</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2011/07/radio-deejay-visual-player/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>Endless Mural</title><link>http://html5gallery.com/2011/06/endless-mural/</link> <comments>http://html5gallery.com/2011/06/endless-mural/#comments</comments> <pubDate>Thu, 16 Jun 2011 14:00:12 +0000</pubDate> <dc:creator>Derek Johnson</dc:creator> <category><![CDATA[Experimental]]></category> <category><![CDATA[Web App]]></category> <category><![CDATA[canvas]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[video]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=6786</guid> <description><![CDATA[A web app by Eric Fickes that uses canvas to create shapes and drawings based on users&#8217; mouse gestures. The help section uses a video element. URL: http://endlessmural.com/]]></description> <content:encoded><![CDATA[<p>A web app by Eric Fickes that uses <code>canvas</code> to create shapes and drawings based on users&#8217; mouse gestures. The help section uses a <code>video</code> element.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/06/mural-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://endlessmural.com/">http://endlessmural.com/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2011/06/endless-mural/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>One-Nyne</title><link>http://html5gallery.com/2011/02/one-nyne/</link> <comments>http://html5gallery.com/2011/02/one-nyne/#comments</comments> <pubDate>Mon, 21 Feb 2011 10:00:23 +0000</pubDate> <dc:creator>Ian Devlin</dc:creator> <category><![CDATA[Agency]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[video]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=6305</guid> <description><![CDATA[Website of design agency One-Nyne. The main site header element contains the nav links but should also contain a h1 rather than an a element. The main content is within an article, with internal content split into section and aside &#8230; <a
href="http://html5gallery.com/2011/02/one-nyne/">Continue reading <span
class="meta-nav">&#8594;</span></a>]]></description> <content:encoded><![CDATA[<p>Website of design agency One-Nyne.</p><p>The main site <code>header</code> element contains the <code>nav</code> links but should also contain a <code>h1</code> rather than an <code>a</code> element. The main content is within an <code>article</code>, with internal content split into <code>section</code> and <code>aside</code> elements, depending on their importance. The dates in the <code>aside</code> on the right could have made use of the <code>time</code> element.</p><p>Some of the portfolio items use the <code>video</code> element, although the only source served up is <code>MP4</code> so will work in compatible browsers only (e.g. it doesn&#8217;t work in Firefox). The <code>type</code> attribute is no long required by the <code>script</code> element.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/02/onenyne-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://onenyne.com/">http://onenyne.com/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2011/02/one-nyne/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>VideoJS</title><link>http://html5gallery.com/2011/02/videojs/</link> <comments>http://html5gallery.com/2011/02/videojs/#comments</comments> <pubDate>Sat, 12 Feb 2011 09:00:09 +0000</pubDate> <dc:creator>Ian Devlin</dc:creator> <category><![CDATA[Scripts]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[video]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=6250</guid> <description><![CDATA[Website for open-source HTML5 video player, VideoJS. It&#8217;s good to see another JavaScript library out there that uses the HTML5 video API. The website itself uses some of the main HTML5 structural elements such as header, nav, section, small and &#8230; <a
href="http://html5gallery.com/2011/02/videojs/">Continue reading <span
class="meta-nav">&#8594;</span></a>]]></description> <content:encoded><![CDATA[<p>Website for open-source HTML5 video player, VideoJS.</p><p>It&#8217;s good to see another JavaScript library out there that uses the HTML5 <code>video</code> API. The website itself uses some of the main HTML5 structural elements such as <code>header</code>, <code>nav</code>, <code>section</code>, <code>small </code>and <code>footer</code>.</p><p>The <code>source</code> element is an empty element and therefore doesn&#8217;t need a closing tag. Where multiple <code>h</code> elements are grouped together, they could be enclosed in a <code>hgroup</code> element. The <code>small</code> element might have been used for the copyright information. The <code>type</code> attribute is no longer required for the <code>script</code> element.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/02/videojs-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://videojs.com/">http://videojs.com/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2011/02/videojs/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>McKinney</title><link>http://html5gallery.com/2011/02/mckinney/</link> <comments>http://html5gallery.com/2011/02/mckinney/#comments</comments> <pubDate>Tue, 08 Feb 2011 09:00:34 +0000</pubDate> <dc:creator>Ian Devlin</dc:creator> <category><![CDATA[Agency]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[video]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=6224</guid> <description><![CDATA[Website of ad agency McKinney. This site uses the usual structure elements such as header, nav and section to layout the content. The video element is also used on this site although in H.264 format only, with a fallback to &#8230; <a
href="http://html5gallery.com/2011/02/mckinney/">Continue reading <span
class="meta-nav">&#8594;</span></a>]]></description> <content:encoded><![CDATA[<p>Website of ad agency McKinney.</p><p>This site uses the usual structure elements such as <code>header</code>, <code>nav</code> and <code>section</code> to layout the content. The <code>video</code> element is also used on this site although in H.264 format only, with a fallback to Flash. The <code>small</code> element could have been used for the <code>footer</code> copyright information, and the social links shouldn&#8217;t be within a <code>nav</code> element as they navigate away from the site.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/02/mckinney-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://mckinney.com/">http://mckinney.com/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2011/02/mckinney/feed/</wfw:commentRss> <slash:comments>1</slash:comments> </item> <item><title>Gianluca Guarini</title><link>http://html5gallery.com/2011/01/gianluca-guarini/</link> <comments>http://html5gallery.com/2011/01/gianluca-guarini/#comments</comments> <pubDate>Thu, 13 Jan 2011 22:00:21 +0000</pubDate> <dc:creator>Derek Johnson</dc:creator> <category><![CDATA[Personal]]></category> <category><![CDATA[Portfolio]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[video]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=5988</guid> <description><![CDATA[The portfolio site of Milan based visual designer and web developer Gianluca Guarini. The site uses both explicit and implicit sectioning to structure the page, and uses it quite well apart from perhaps an untitled article to wrap the contact &#8230; <a
href="http://html5gallery.com/2011/01/gianluca-guarini/">Continue reading <span
class="meta-nav">&#8594;</span></a>]]></description> <content:encoded><![CDATA[<p>The portfolio site of Milan based visual designer and web developer Gianluca Guarini.</p><p>The site uses both explicit and implicit sectioning to structure the page, and uses it quite well apart from perhaps an untitled <code>article</code> to wrap the contact form. The main visual area of the site is created using the <code>video</code> element with a flash fallback for non-supporting browsers.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/01/colour-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://gianlucaguar.altervista.org/">http://gianlucaguar.altervista.org/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2011/01/gianluca-guarini/feed/</wfw:commentRss> <slash:comments>1</slash:comments> </item> </channel> </rss>
