<?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; charset</title> <atom:link href="http://html5gallery.com/tag/charset/feed/" rel="self" type="application/rss+xml" /><link>http://html5gallery.com</link> <description>A showcase of sites using HTML5 markup</description> <lastBuildDate>Tue, 07 Feb 2012 22:19:00 +0000</lastBuildDate> <language>en</language> <sy:updatePeriod>hourly</sy:updatePeriod> <sy:updateFrequency>1</sy:updateFrequency> <generator>http://wordpress.org/?v=3.3</generator> <item><title>Marquee Media</title><link>http://html5gallery.com/2012/02/marquee-media/</link> <comments>http://html5gallery.com/2012/02/marquee-media/#comments</comments> <pubDate>Tue, 07 Feb 2012 22:19:00 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[Brochure]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7699</guid> <description><![CDATA[The website of New York advertising broker Marquee Media. The site uses some of the new HTML5 structural elements including nav, footer and section. The section elements on the home page make sense but it&#8217;s rare for a section not to need a heading, so the links that are visual headings could go into headings. [...]]]></description> <content:encoded><![CDATA[<p>The website of New York advertising broker Marquee Media.</p><p>The site uses some of the new <abbr>HTML</abbr>5 structural elements including nav, footer and section. The section elements on the home page make sense but it&#8217;s rare for a section not to need a heading, so the links that are visual headings could go into headings.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/12/marqueemedia-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://marqueemedia.com">http://marqueemedia.com</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/02/marquee-media/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>weheart.co.uk</title><link>http://html5gallery.com/2012/02/weheart-co-uk/</link> <comments>http://html5gallery.com/2012/02/weheart-co-uk/#comments</comments> <pubDate>Thu, 02 Feb 2012 22:10:02 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[Media]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[wai-aria]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7608</guid> <description><![CDATA[We Heart is a lifestyle and design magazine featuring some stunning design from around the world. The markup ticks a few boxes, for example the type attribute is absent from script and link elements, and some WAI-ARIA roles are used. However it seems a find and replace has been done on div with section, and [...]]]></description> <content:encoded><![CDATA[<p>We Heart is a lifestyle and design magazine featuring some stunning design from around the world.</p><p>The markup ticks a few boxes, for example the <code>type</code> attribute is absent from <code>script</code> and <code>link</code> elements, and some <abbr>WAI-ARIA</abbr> roles are used. However it seems a find and replace has been done on <code>div</code> with <code>section</code>, and a look at the document outline shows the effect of this. The humble <a
href="http://html5doctor.com/you-can-still-use-div/"><code>div</code> is still a very useful element</a> when no semantics are required.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/12/weheart-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://www.weheart.co.uk">http://www.weheart.co.uk</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/02/weheart-co-uk/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>dublinbikes2go</title><link>http://html5gallery.com/2012/02/dublinbikes2go/</link> <comments>http://html5gallery.com/2012/02/dublinbikes2go/#comments</comments> <pubDate>Wed, 01 Feb 2012 23:05:37 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[Web App]]></category> <category><![CDATA[appcache]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[Geolocation]]></category> <category><![CDATA[localStorage]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7250</guid> <description><![CDATA[A mobile focused (although it works perfectly well on a laptop) web app for finding and using Dublin Bikes, Dublin&#8217;s bike sharing scheme. The site uses HTML5 technologies such as localStorage and offline appcache, as well as the geolocation API, a technology closely related to HTML5. URL: http://beta.dublinbikes2go.com/]]></description> <content:encoded><![CDATA[<p>A mobile focused (although it works perfectly well on a laptop) web app for finding and using Dublin Bikes, Dublin&#8217;s bike sharing scheme.</p><p>The site uses <abbr>HTML</abbr>5 technologies such as <code>localStorage</code> and offline <code>appcache</code>, as well as the geolocation API, a technology closely related to HTML5.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/07/dublinbikes2go-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://beta.dublinbikes2go.com/">http://beta.dublinbikes2go.com/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/02/dublinbikes2go/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>Ernesto Graterol</title><link>http://html5gallery.com/2012/01/ernesto-graterol/</link> <comments>http://html5gallery.com/2012/01/ernesto-graterol/#comments</comments> <pubDate>Tue, 31 Jan 2012 22:23:41 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[Agency]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[microformats]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7709</guid> <description><![CDATA[Ernesto Graterol is a WordPress theme and plugin development studio. The site is a single page, using JavaScript to switch the tabbed content, so each part would be a good candidate for the section element. It depends on your interpretation of the nav specification, but I would say as it&#8217;s their content the social links [...]]]></description> <content:encoded><![CDATA[<p>Ernesto Graterol is a WordPress theme and plugin development studio.</p><p>The site is a single page, using JavaScript to switch the tabbed content, so each part would be a good candidate for the <code>section</code> element. It depends on your interpretation of the <a
href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-nav-element">nav specification</a>, but I would say as it&#8217;s their content the social links could go into a <a
href="http://html5doctor.com/nav-element/">nav</a>.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/12/ernestograterol-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://www.ernestograterol.com/">http://www.ernestograterol.com/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/01/ernesto-graterol/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>MBA Multimedia</title><link>http://html5gallery.com/2012/01/mba-multimedia/</link> <comments>http://html5gallery.com/2012/01/mba-multimedia/#comments</comments> <pubDate>Thu, 12 Jan 2012 22:02:56 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[Agency]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <category><![CDATA[forms]]></category> <category><![CDATA[microformats]]></category> <category><![CDATA[wai-aria]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7718</guid> <description><![CDATA[MBA Multimedia is a web agency based just outside Rennes in France. The site is really well constructed and makes good use of headings to create a nice outline. Other boxes are ticked too including hcard microformat and good use of new form input types and attributes. There is a little WAI-ARIA which could be [...]]]></description> <content:encoded><![CDATA[<p>MBA Multimedia is a web agency based just outside Rennes in France.</p><p>The site is really well constructed and makes good use of headings to create a nice outline. Other boxes are ticked too including hcard microformat and good use of new form input types and attributes. There is a little <abbr>WAI-ARIA</abbr> which could be rolled out to cover <code>banner</code>, <code>navigation</code>, <code>form</code>, <code>complementary</code> and <code>contentinfo</code> roles.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/12/mbamultimedia-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://www.mba-multimedia.com">http://www.mba-multimedia.com</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/01/mba-multimedia/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>Gallery of Mo</title><link>http://html5gallery.com/2012/01/gallery-of-mo/</link> <comments>http://html5gallery.com/2012/01/gallery-of-mo/#comments</comments> <pubDate>Mon, 09 Jan 2012 22:43:33 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[Events]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7724</guid> <description><![CDATA[A gallery of portraits of people who donated to the Movember campaign in 2011, each with a moustache added by the artist. The site is nicely constructed and each portrait is in a section element, which helps build a document outline. Perhaps they would be better as articles as they work as standalone items, but [...]]]></description> <content:encoded><![CDATA[<p>A gallery of portraits of people who donated to the Movember campaign in 2011, each with a moustache added by the artist.</p><p>The site is nicely constructed and each portrait is in a <code>section</code> element, which helps build a document outline. Perhaps they would be better as <code>article</code>s as they work as standalone items, but a bigger problem is the lack of heading elements within each.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/12/galleryofmo-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://www.galleryofmo.co.uk">http://www.galleryofmo.co.uk</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/01/gallery-of-mo/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>Sann-Remy Chea</title><link>http://html5gallery.com/2012/01/sann-remy-chea/</link> <comments>http://html5gallery.com/2012/01/sann-remy-chea/#comments</comments> <pubDate>Tue, 03 Jan 2012 09:00:52 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[Personal]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7689</guid> <description><![CDATA[Personal website of developer Sann-Remy Chea, who&#8217;s based in Paris, France. Good use of some of the new structural elements that HTML5 has to offer. Where there are two h elements together, they could be grouped in a hgroup. The section element is sometimes being used for styling purposes only, so a div would be [...]]]></description> <content:encoded><![CDATA[<p>Personal website of developer Sann-Remy Chea, who&#8217;s based in Paris, France.</p><p>Good use of some of the new structural elements that HTML5 has to offer. Where there are two <code>h</code> elements together, they could be grouped in a <code>hgroup</code>. The <code>section</code> element is sometimes being used for styling purposes only, so a <code>div</code> would be more appropriate. The <code>time</code> element could be used to enclose the blog post dates.</p><p>Remember that the <code>script</code> element no longer requires the <code>type</code> attribute.</p><p> <img
src="http://html5gallery.comwp-content/uploads/2012/01/schrea-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://srchea.com/">http://srchea.com/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/01/sann-remy-chea/feed/</wfw:commentRss> <slash:comments>2</slash:comments> </item> <item><title>Always data</title><link>http://html5gallery.com/2012/01/always-data/</link> <comments>http://html5gallery.com/2012/01/always-data/#comments</comments> <pubDate>Mon, 02 Jan 2012 09:00:49 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[Portfolio]]></category> <category><![CDATA[canvas]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7695</guid> <description><![CDATA[Website of Styro, a graphic designer and front-end developer based in Paris, France. Good clean use of semantic HTML5 elements in this layout, although the &#8220;content&#8221; section element should probably use a div instead. The article element is used to enclose each entry and the time element is used for the post date, although the [...]]]></description> <content:encoded><![CDATA[<p>Website of Styro, a graphic designer and front-end developer based in Paris, France.</p><p>Good clean use of semantic HTML5 elements in this layout, although the &#8220;content&#8221; <code>section</code> element should probably use a <code>div</code> instead. The <code>article</code> element is used to enclose each entry and the <code>time</code> element is used for the post date, although the <code>small</code> element probably shouldn&#8217;t be used here. The <code>canvas</code> element is used to draw a diagonal red line in the page background.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/12/styro-alwaysdata-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://styro.alwaysdata.net">http://styro.alwaysdata.net</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/01/always-data/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>CMSTEC</title><link>http://html5gallery.com/2012/01/cmstec/</link> <comments>http://html5gallery.com/2012/01/cmstec/#comments</comments> <pubDate>Sun, 01 Jan 2012 09:00:12 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[Agency]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[elements]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7649</guid> <description><![CDATA[Homw site of cmstec, a CMS by Dietmar Krause. The site overall makes good use of some of the new structural HTML5 elements such as header, hgroup, nav, section and footer. The use of an aside in the footer to contain information such as copyright and other links probably isn&#8217;t ideal as this is still [...]]]></description> <content:encoded><![CDATA[<p>Homw site of cmstec, a CMS by Dietmar Krause.</p><p>The site overall makes good use of some of the new structural HTML5 elements such as <code>header</code>, <code>hgroup</code>, <code>nav</code>, <code>section </code>and <code>footer</code>. The use of an <code>aside </code>in the <code>footer </code>to contain information such as copyright and other links probably isn&#8217;t ideal as this is still important information. And <code>header </code>elements which contain a single <code>h</code> element could have been left out.</p><p> <img
src="http://html5gallery.com/wp-content/uploads/2011/12/cmstec-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://cmstec.de/">http://cmstec.de/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2012/01/cmstec/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> <item><title>ButtonBar+</title><link>http://html5gallery.com/2011/12/buttonbar/</link> <comments>http://html5gallery.com/2011/12/buttonbar/#comments</comments> <pubDate>Mon, 26 Dec 2011 09:00:04 +0000</pubDate> <dc:creator>Gerard Druiven</dc:creator> <category><![CDATA[ECommerce]]></category> <category><![CDATA[charset]]></category> <category><![CDATA[doctype]]></category> <category><![CDATA[sections]]></category> <guid
isPermaLink="false">http://html5gallery.com/?p=7606</guid> <description><![CDATA[Website advertising an extension for the Safari web browser. The social links in the top bar shouldn&#8217;t be contained within a nav element as they&#8217;re not the primary navigation of the site. Some of the section elements used could use a div as they seem to be used for styling purposes only. The type attribute [...]]]></description> <content:encoded><![CDATA[<p>Website advertising an extension for the Safari web browser.</p><p>The social links in the top bar shouldn&#8217;t be contained within a <code>nav</code> element as they&#8217;re not the primary navigation of the site. Some of the <code>section</code> elements used could use a <code>div</code> as they seem to be used for styling purposes only.</p><p>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/12/buttonbar-thumb.jpg" alt="Website Screenshot" /></p><p>URL: <a
href="http://www.buttonbar-plus.com/">http://www.buttonbar-plus.com/</a></p>]]></content:encoded> <wfw:commentRss>http://html5gallery.com/2011/12/buttonbar/feed/</wfw:commentRss> <slash:comments>0</slash:comments> </item> </channel> </rss>
