<?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>HTML 5 Tutorial</title>
	<atom:link href="http://html5tutorial.net/feed" rel="self" type="application/rss+xml" />
	<link>http://html5tutorial.net</link>
	<description>Tutorials, Tips &#38; News for the Designer</description>
	<lastBuildDate>Thu, 08 Dec 2011 15:15:39 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=</generator>
		<item>
		<title>HTML5 Books – Help When You Need It</title>
		<link>http://html5tutorial.net/html-5-reference/html5-books-help-when-you-need-it.html</link>
		<comments>http://html5tutorial.net/html-5-reference/html5-books-help-when-you-need-it.html#comments</comments>
		<pubDate>Thu, 08 Dec 2011 15:15:39 +0000</pubDate>
		<dc:creator>the Editor</dc:creator>
				<category><![CDATA[HTML 5 Reference]]></category>
		<category><![CDATA[Books]]></category>
		<category><![CDATA[html5]]></category>

		<guid isPermaLink="false">http://html5tutorial.net/?p=472</guid>
		<description><![CDATA[HTML5 is an exciting and powerful standard for the development of advanced web pages. It offers the ability for web designers to integrate many convenient and flexible features into their web pages and greatly enhances the enjoyment and effectiveness of these sites. However it can be complicated and somewhat difficult to implement. There are some [...]]]></description>
			<content:encoded><![CDATA[<p>HTML5 is an exciting and powerful standard for the development of advanced web pages. It offers the ability for web designers to integrate many convenient and flexible features into their web pages and greatly enhances the enjoyment and effectiveness of these sites. However it can be complicated and somewhat difficult to implement. There are some terrific resources to help so we’ll discuss the availability and benefit of some HTML5 books.</p>
<p>There are many places to find useful and effective HTML5 books. They have been developed by some very talented web designers and offer a great deal of information and support in terms of being able to adopt and use the HTML5 standard.</p>
<p><a href="http://html5tutorial.net/html5-books">Take a look at a range of HTML5 books in our bookstore&#8230;</a></p>
<p>You can find these books in a variety of online and offline outlets. For example there are many find HTML5 books available at major bookstores such as Barnes and Noble and Books-A-Million. The advantage in visiting a bookstore is that you can peruse the book to see if it will benefit you as expected before you actually purchase the book.</p>
<p>You can also compare several books to determine which one is best suited for your applications and interests. However there are also very extensive resources when it comes to online bookstores such as Amazon. And even the major retail bookstores like Barnes and Noble also have an online retail store.</p>
<p>In any case you can get a great deal of information on different HTML5 books from a site like Amazon. What is very helpful is the availability of reviews on different books. It is therefore very possible to find out what others think about a particular book.</p>
<p>Amazon has established a ratings system so you can quickly see how positive the ratings are for a particular book in specific areas. You can also read detailed comments from other readers concerning their experience and satisfaction with the book.</p>
<p>You can also find a great deal of helpful information concerning HTML5 books by visiting relevant forums. These forums address topics closely related to HTML5 development. Many of them have sections pertaining to learning resources and this certainly includes books.</p>
<p>Within these forums, you can find helpful reviews and comments by people who have developed outstanding knowledge and expertise in this area. They are therefore very qualified to comment on the effectiveness of the information presented in these books.</p>
<p>The comments tend to be very limited in terms of self serving purposes. So you should be able to find many unbiased comments and reports. In this way you should be able to find some outstanding HTML5 books which can help you to develop well written and effective sites using the HTML5 standard.</p>
<p><a href="http://html5tutorial.net/html5-books">Take a look at a range of HTML5 books in our bookstore&#8230;</a></p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fhtml5tutorial.net%2Fhtml-5-reference%2Fhtml5-books-help-when-you-need-it.html&amp;title=HTML5%20Books%20%E2%80%93%20Help%20When%20You%20Need%20It" id="wpa2a_2"><img src="http://html5tutorial.net/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="share save 171 16 HTML5 Books – Help When You Need It"  title="HTML5 Books – Help When You Need It" /></a></p>]]></content:encoded>
			<wfw:commentRss>http://html5tutorial.net/html-5-reference/html5-books-help-when-you-need-it.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5 Boilerplate</title>
		<link>http://html5tutorial.net/html-5-templates/html5-boilerplate.html</link>
		<comments>http://html5tutorial.net/html-5-templates/html5-boilerplate.html#comments</comments>
		<pubDate>Tue, 08 Nov 2011 22:32:42 +0000</pubDate>
		<dc:creator>the Editor</dc:creator>
				<category><![CDATA[HTML 5 templates]]></category>
		<category><![CDATA[Boilerplate]]></category>
		<category><![CDATA[html5]]></category>

		<guid isPermaLink="false">http://html5tutorial.net/?p=469</guid>
		<description><![CDATA[Whether you like the standard or not, HTML5 seems to be gaining a great deal of popularity and support. The upcoming Window 8 program will provide extensive support for HTML5. But it can be challenging and sometimes difficult to produce sites which are compatible with HTML5. To help with this situation, there are tools to [...]]]></description>
			<content:encoded><![CDATA[<p>Whether you like the standard or not, HTML5 seems to be gaining a great deal of popularity and support. The upcoming Window 8 program will provide extensive support for HTML5. But it can be challenging and sometimes difficult to produce sites which are compatible with HTML5. To help with this situation, there are tools to assist developers. One of the best is called HTML5 boilerplate. Let’s talk more about this and how it can help.</p>
<p>HTML5 boilerplate contains a number of helpful templates which incorporates HTML, CSS, and JS to enable designers to produce fast and robust websites. It helps you to interface with HTML5 video and different fonts.</p>
<p>This tool can really help designers and developers to get their websites fully operational and compatible with this new standard.</p>
<p>Some of the features available with HTML5 boilerplate include cross browser compatibility (including IE6, IE7, and IE8). It also offers Modernizr support as well as Google analytics support. The tool can also help to optimize mobile browsers. And CDN hosted jQuery with a local fallback script is available as well.</p>
<p>This tool is available in three options. They include Boilerplate Documented, Boilerplate Stripped, and Boilerplate Custom.</p>
<p>The Boilerplate documented option includes a .zip file which contains the skeleton code which is needed to get started building an HTML5 site with documentation included, built in jQuery CDN support, CSS, caching and other features. The Boilerplate stripped version has the same components but removes comments. And the Boilerplate Custom enables you to build a custom site skeleton with full control of what gets added or removed.</p>
<p>If you seek further details and support related to HTML5 boilerplate, there is a great deal available throughout the Web. Simply type in an appropriate search terms related to this topic and you’ll be presented with many sites which allow you to download the tools as well as extensive documentation and assistance in using these tools effectively.</p>
<p>If you visit some relevant forums, you will also find a great deal of information and support there as well. There are many ways to improve your knowledge of and effectiveness in HTML5 utilization.</p>
<p>So whether you are a Web developer or just someone who is looking to get involved in HTML5 implementation, the code generated by the HTML5 boilerplate can really help to bring your projects along quickly and effectively. You can find many tips and tricks to help with this implementation and help ensure that your pages are completely HTML5 compliant.</p>
<p>These tools can go a long way towards enhancing the implementation and adoption of this flexible and powerful web standard. <a href="http://html5boilerplate.com/" target="_blank">View this HTML5 tool here&#8230;</a></p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fhtml5tutorial.net%2Fhtml-5-templates%2Fhtml5-boilerplate.html&amp;title=HTML5%20Boilerplate" id="wpa2a_4"><img src="http://html5tutorial.net/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="share save 171 16 HTML5 Boilerplate"  title="HTML5 Boilerplate" /></a></p>]]></content:encoded>
			<wfw:commentRss>http://html5tutorial.net/html-5-templates/html5-boilerplate.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>HTML5 Audio Standards</title>
		<link>http://html5tutorial.net/general/html5-audio-standards.html</link>
		<comments>http://html5tutorial.net/general/html5-audio-standards.html#comments</comments>
		<pubDate>Fri, 29 Apr 2011 18:08:03 +0000</pubDate>
		<dc:creator>the Editor</dc:creator>
				<category><![CDATA[General]]></category>
		<category><![CDATA[audio tags]]></category>
		<category><![CDATA[HTML5 audio]]></category>
		<category><![CDATA[HTML5 audio tags]]></category>

		<guid isPermaLink="false">http://html5tutorial.net/?p=461</guid>
		<description><![CDATA[HTML5 is exciting and anyone who builds web pages is looking forward to implementing these new tags into their sites. HTML5 audio tags are definitely one of the ones on the list meant to make life much easier for both webmasters and end users. Until now there has never been a standard audio player for [...]]]></description>
			<content:encoded><![CDATA[<p>HTML5 is exciting and anyone who builds web pages is looking forward to implementing these new tags into their sites. HTML5 audio tags are definitely one of the ones on the list meant to make life much easier for both webmasters and end users.</p>
<p>Until now there has never been a standard audio player for browsers. If you wanted to place audio on your site you either had to use one of the available players such as Windows Media Player or Quicktime player. With HTML5 audio there is just simple code to use to place audio anywhere on the page without have to have a separate audio player or 3rd party service hosting your audio.</p>
<p>Here is an example of how to use the HTML5 audio tags in your web code.</p>
<div id='stb-box-228' class='stb-info_box' >&lt;audio src=&#8221;song.ogg&#8221; controls=&#8221;controls&#8221;&gt;This is alternate text that is seen if the users browser does not recognize the html5 tag&lt;/audio&gt;</div>
<p>There are several attributes you can use along with your tag to customize your player. The attributes include autoplay, control customization, looping and pre-loading. Which means you can start your video when someone opens your page, customize what controls they see on the audio player and even loop the video so it plays continuously over and over.</p>
<p>So with the implementation of this tag it is going to become much easier for the average webmaster to add audio to their websites and blogs. The <a href="http://html5tutorial.net/general/html5-video-should-i-use-it.html">HTML5 video tag</a> is also new and is similar in that it provides and across the board video player for putting videos on your site.</p>
<p>Right now HTML5 tags especially the audio and video tags are very experimental. Browser support while getting better is still in its infancy stages which means that as cool as these tags are implementing them into your designs now is going to leave a huge part of the PC internet users unable to see the content on your site.</p>
<p>One also has to wonder what the effects of HTML5 audio and video tags on <a href="http://www.webhostingsearch.com" target="_blank">web hosting</a>. Until now most web hosts could depend on the fact that if a blog or small website wanted to use video or audio it was likely they would host it elsewhere.</p>
<p>With the ease of using these tags I have a feeling once they become more of a standard and are more widely used web hosts are going to see far more people hosting big audio and video files on their servers. Which could mean a rise in web hosting costs depending on how much extra storage space and bandwidth is being used.</p>
<p>HTML5 is coming there is no way around it but it is going to take some time before you can safely use it in your websites. Tags like the HTML5 audio tag are going to make certain elements of design so much easier, so until then we will just wait.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fhtml5tutorial.net%2Fgeneral%2Fhtml5-audio-standards.html&amp;title=HTML5%20Audio%20Standards" id="wpa2a_6"><img src="http://html5tutorial.net/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="share save 171 16 HTML5 Audio Standards"  title="HTML5 Audio Standards" /></a></p>]]></content:encoded>
			<wfw:commentRss>http://html5tutorial.net/general/html5-audio-standards.html/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>HTML5 Video &#8211; Should I Use It?</title>
		<link>http://html5tutorial.net/general/html5-video-should-i-use-it.html</link>
		<comments>http://html5tutorial.net/general/html5-video-should-i-use-it.html#comments</comments>
		<pubDate>Thu, 21 Apr 2011 17:58:14 +0000</pubDate>
		<dc:creator>the Editor</dc:creator>
				<category><![CDATA[General]]></category>
		<category><![CDATA[HTML5 Video]]></category>

		<guid isPermaLink="false">http://html5tutorial.net/?p=455</guid>
		<description><![CDATA[One of the most exciting buzz these days in web circles is about HTML5 and specifically video on HTML5. HTML5 video tag has solved the age old problem site owners and designers face on how to best embed video on websites. Prior to the new HTML5 video tag you basically had two options for embedding [...]]]></description>
			<content:encoded><![CDATA[<p>One of the most exciting buzz these days in web circles is about HTML5 and specifically video on HTML5. HTML5 video tag has solved the age old problem site owners and designers face on how to best embed video on websites.</p>
<p>Prior to the new HTML5 video tag you basically had two options for embedding video on your site to get a video player or to use a 3rd party service like YouTube to host your video and them use their embed code to put the video on your site.</p>
<p>Most people are currently using the 2nd option of using services like YouTube to host their videos and them embedding them on their own site. This option is not really a better design standard than getting a video player and <a href="http://www.webhostingsearch.com" target="_blank">hosting</a> your own videos but it is quicker and free which is why most people end up using this configuration for videos.</p>
<p>For people who do decide to have their own video player they quickly find out that a quality one can be costly and customization may require both a graphic designer and a web designer all just to place a video on their site.</p>
<p>That is where the magic of HTML5 video comes in. It has a simple straight forward tag that is similar to an image tag with a source and attributes. It looks like this.</p>
<div id='stb-box-3868' class='stb-info_box' >&lt;video src=&#8221;movie.webm&#8221; poster=&#8221;movie.jpg&#8221; controls&gt;I am ALT text&lt;/video&gt;</div>
<p>If you have ever added video to a website you know how much simpler that is. However, the problem is that the browsers of the world are not quite ready for what HTML5 has to offer.</p>
<p>Currently only one browser has a robust support for HTML5 video tags and that is chrome, firefox also has limited support and IE hasn’t even touched video in HTML5 in its current browsers yet. So what does that mean for you? It means a good percentage of people using computers to access the internet will not be able to render the video on your page.</p>
<p>Which is why for now when it comes to building websites video in HTML5 is like that golden egg sitting just out of your reach that you really want but you just cannot have. The push for HTML5 compliance is getting louder and louder everyday though so before you know it HTML5 will have enough standards in browsers to make 2.0 web design much easier.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fhtml5tutorial.net%2Fgeneral%2Fhtml5-video-should-i-use-it.html&amp;title=HTML5%20Video%20%26%238211%3B%20Should%20I%20Use%20It%3F" id="wpa2a_8"><img src="http://html5tutorial.net/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="share save 171 16 HTML5 Video   Should I Use It?"  title="HTML5 Video   Should I Use It?" /></a></p>]]></content:encoded>
			<wfw:commentRss>http://html5tutorial.net/general/html5-video-should-i-use-it.html/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Which Browsers Support HTML5?</title>
		<link>http://html5tutorial.net/general/which-browsers-support-html5.html</link>
		<comments>http://html5tutorial.net/general/which-browsers-support-html5.html#comments</comments>
		<pubDate>Thu, 14 Apr 2011 11:26:20 +0000</pubDate>
		<dc:creator>the Editor</dc:creator>
				<category><![CDATA[General]]></category>
		<category><![CDATA[html5 browsers]]></category>

		<guid isPermaLink="false">http://html5tutorial.net/?p=451</guid>
		<description><![CDATA[All the buzz these days when seems to be about HTML5. Web designers and techies everywhere have very strong feelings about HTML5 and either love it or hate it depending on who you talk to. First let’s take a look at what HTML5 actually is and what it is used for. HTML is a markup [...]]]></description>
			<content:encoded><![CDATA[<p>All the buzz these days when seems to be about HTML5. Web designers and techies everywhere have very strong feelings about HTML5 and either love it or hate it depending on who you talk to.</p>
<p>First let’s take a look at what HTML5 actually is and what it is used for. HTML is a markup language used to design and layout web pages. HTML5 is a new version of that language that has more tags and hence more design options.</p>
<p>Most people can agree more design options is a good thing. The controversy comes in mostly because certain companies like Apple are acting as if HTML5 is a standard when the reality is no browser fully supports it yet.</p>
<p>Essentially that means that for people using certain elements of it they will look nothing like they intended to most of the people who view the pages. So while HTML5 and its applications are definitely going to offer us some much cooler websites it is just not practical yet to use for your web designs.</p>
<p>We tested out a few of the most popular browsers to see how ready they are for HTML5 and this is what we found out. For this test we used <a href="http://www.html5test.com" target="_blank">http://www.html5test.com</a> which offers an HTML5 testing page and a rating system that goes up to 400 points depending on how many HTML5 features are already implemented into the browser.</p>
<p>Chrome 10.0 was the big winner coming in at 301 points out of 400 possible. They have already implemented most of the functionality to be a compatible HTML5 browser. In addition, many of the features that are not added are partially added. So Google Chrome is definitely way out in front in the race for HTML compatible browsers.</p>
<p>Firefox 4.0 is next in line and they scored pretty decently getting 249 out 400 possible points. They are still missing a lot of key elements but got bonus points for the audio and video implementation as well as their parsing rules.</p>
<p>Internet Explorer 8 is pretty far behind the curve. IE scored a total of 32 points out of 400. Pretty dismal showing for what used to be the top internet browser in the world. Internet Explorer has been playing catch up with rendering design since the implementation of CSS and their poor showing here tells us it does not seem like much will change in the future.</p>
<p>So those are the statistics. At the moment the only HTML5 browser that is going to get you very far is Google Chrome and until browsers catch up with the newer language it is probably a good idea to use it sparingly in your designs until it actually is a true and tested standard.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fhtml5tutorial.net%2Fgeneral%2Fwhich-browsers-support-html5.html&amp;title=Which%20Browsers%20Support%20HTML5%3F" id="wpa2a_10"><img src="http://html5tutorial.net/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="share save 171 16 Which Browsers Support HTML5?"  title="Which Browsers Support HTML5?" /></a></p>]]></content:encoded>
			<wfw:commentRss>http://html5tutorial.net/general/which-browsers-support-html5.html/feed</wfw:commentRss>
		<slash:comments>13</slash:comments>
		</item>
		<item>
		<title>Lutz Roeder&#8217;s HTML5 Samples Using The Canvas Element</title>
		<link>http://html5tutorial.net/examples/samples-using-the-html5-canvas-element.html</link>
		<comments>http://html5tutorial.net/examples/samples-using-the-html5-canvas-element.html#comments</comments>
		<pubDate>Fri, 25 Feb 2011 11:05:21 +0000</pubDate>
		<dc:creator>the Editor</dc:creator>
				<category><![CDATA[Examples]]></category>
		<category><![CDATA[canvas element]]></category>
		<category><![CDATA[element]]></category>
		<category><![CDATA[html5]]></category>
		<category><![CDATA[HTML5 canvas]]></category>
		<category><![CDATA[HTML5 canvas element]]></category>

		<guid isPermaLink="false">http://html5tutorial.net/?p=432</guid>
		<description><![CDATA[The site Lutz Roeder&#8217;s HTML5 Samples contains three code samples, all written in JavaScript using the HTML5 canvas element. The source is available via GitHub. The most complex of the samples is Textor, a text editor with syntax highlighting. Instead of editing the text using the HTML DOM, Textor renders text directly into a HTML5 [...]]]></description>
			<content:encoded><![CDATA[<p>The site <a href="http://www.lutzroeder.com/html5" target="_blank">Lutz Roeder&#8217;s HTML5 Samples</a> contains three code samples, all written in JavaScript using the HTML5 canvas element. The source is available via GitHub.</p>
<p>The most complex of the samples is <strong>Textor</strong>, a text editor with syntax highlighting. Instead of editing the text using the HTML DOM, Textor renders text directly into a HTML5 canvas element while handling key and mouse events using JavaScript code.</p>
<p>On top of that it provides syntax highlighting for HTML, JavaScript and CSS and also supports mixed language HTML/JavaScript text. Textor works in IE9, Chrome, Safari and Firefox on both Windows and Mac.</p>
<p>The code includes an undo stack implementation, an incremental tokenizer for syntax highlighting, text input for different browsers and incremental screen invalidation. Textor is lightweight with only 47kB of compressed JavaScript in the main texteditor.js module.</p>
<p><img class="alignnone size-full wp-image-443" title="Graphic" src="http://html5tutorial.net/wp-content/uploads/2011/02/Graphic-1.jpg" alt="Graphic 1 Lutz Roeders HTML5 Samples Using The Canvas Element" width="466" height="309" /></p>
<p><strong>Digger</strong>, another sample, is a Boulderdash-style game, again entirely written in JavaScript and using the HTML5 canvas and audio elements. The game fits entirely into one 50kB module with less than 1200 lines of code, including the graphics and sounds encoded as base64 streams. The game is 100% ported from a Silverlight version with exactly the same graphics and functionality.</p>
<p><a href="http://html5tutorial.net/wp-content/uploads/2011/02/PastedGraphic-8.jpg"><img class="size-full wp-image-433 alignnone" title="Digger" src="http://html5tutorial.net/wp-content/uploads/2011/02/PastedGraphic-8.jpg" alt="PastedGraphic 8 Lutz Roeders HTML5 Samples Using The Canvas Element" width="324" height="258" /></a></p>
<p>The last sample is <strong>Netron</strong>, a library for editing graph elements and connections using HTML5 canvas. It allows the definition of specific graph elements and custom code can be added to change the appearance of these elements.</p>
<p>Each node has a custom set of connection points that can be connected by dragging the mouse. Double-click will activate an element so it&#8217;s content can be edited using an overlay input element. Netron includes and undo stack implementation that records all edits and allows reverting them.</p>
<p><a href="http://www.lutzroeder.com/html5" target="_blank">See these in action and learn more about Lutz Roeder&#8217;s HTML5 work here&#8230;</a></p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fhtml5tutorial.net%2Fexamples%2Fsamples-using-the-html5-canvas-element.html&amp;title=Lutz%20Roeder%26%238217%3Bs%20HTML5%20Samples%20Using%20The%20Canvas%20Element" id="wpa2a_12"><img src="http://html5tutorial.net/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="share save 171 16 Lutz Roeders HTML5 Samples Using The Canvas Element"  title="Lutz Roeders HTML5 Samples Using The Canvas Element" /></a></p>]]></content:encoded>
			<wfw:commentRss>http://html5tutorial.net/examples/samples-using-the-html5-canvas-element.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>HTML5 web app: ARIS ModelViewer</title>
		<link>http://html5tutorial.net/news/html5-web-app-aris-modelviewer.html</link>
		<comments>http://html5tutorial.net/news/html5-web-app-aris-modelviewer.html#comments</comments>
		<pubDate>Mon, 14 Feb 2011 10:33:38 +0000</pubDate>
		<dc:creator>the Editor</dc:creator>
				<category><![CDATA[Examples]]></category>
		<category><![CDATA[News]]></category>
		<category><![CDATA[ARIS ModelViewer]]></category>
		<category><![CDATA[HTML5 web app]]></category>
		<category><![CDATA[HTML5-based model viewer]]></category>

		<guid isPermaLink="false">http://html5tutorial.net/?p=420</guid>
		<description><![CDATA[I&#8217;m very glad the folks of HTML 5 Tutorials give me the chance to show you the HTML5-based model viewer app my company developed. I work for Software AG (in business since 1969!), which you might know from the SOA infrastructure market with our webMethods and CentraSite products. We also market a complete suite for [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;m very glad the folks of HTML 5 Tutorials give me the chance to show you the HTML5-based model viewer app my company developed. I work for Software AG (in business since 1969!), which you might know from the SOA infrastructure market with our webMethods and CentraSite products. We also market a complete suite for business process analysis under the ARIS brand. Customers use ARIS to document and analyze their internal processes and organization.</p>
<p>Before I bore you with a long explanation about enterprise modeling, let&#8217;s take a look at an example and see our HTML5-based model viewer at work:</p>
<p><script src="http://www.ariscommunity.com/sites/all/libraries/modelviewer/modelViewer.js" type="text/javascript"></script><script type="text/javascript">// <![CDATA[
   ARISModelViewer.createViewer("royal_family_tree_0.adf", "500", "500", "royal_family_tree_0_adf");
// ]]&gt;</script></p>
<div id="royal_family_tree_0_adf"><img style="border: 1px solid #AAAAAA;" src="http://www.ariscommunity.com/system/files/adfpreview/royal_family_tree_0.adf.preview.jpg" alt="royal family tree 0.adf.preview HTML5 web app: ARIS ModelViewer"  title="HTML5 web app: ARIS ModelViewer" /></div>
<p>&#8230;&#8230;&#8230;&#8230;&#8230;..</p>
<p>An organizational chart is normally used to document the formal structure of your company. In the example above, I created a family tree of the British Royals. After visualizing them, I analyzed the model and marked those spots where we can still become part of it <img src='http://html5tutorial.net/wp-includes/images/smilies/icon_wink.gif' alt="icon wink HTML5 web app: ARIS ModelViewer" class='wp-smiley' title="HTML5 web app: ARIS ModelViewer" />  I created the model using our <a href="http://www.ariscommunity.com/aris-express" target="_blank">free modeling tool ARIS Express</a> and uploaded it to the belonging community page. Of course, you can do more serious stuff with the tool like documenting the <a href="http://www.ariscommunity.com/users/sstein/2010-08-09-bpm-view-scrum" target="_blank">Scrum process</a>.</p>
<p>At the heart of model viewer, we use HTML5&#8242;s canvas to do all the drawing directly in the browser. Besides panning and zooming, you can also enlarge the model to your browser window or embed it in your blog. Our lead developer posted <a href="http://www.ariscommunity.com/users/rdeangelis/2011-02-10-aris-says-hello-html5" target="_blank">a complete feature overview of model viewer</a>.</p>
<p>While developing the viewer, we faced many challenges like those models should look the same as in the ARIS Express tool. Also, we have to support Microsoft Internet Explorer as it is still the default browser in many corporations. To solve this, we added a browser switch so that Flash gets used in case of Internet Explorer. This Flash version renders much slower, which seems to be a clear indication that with the advent of HTML5, Flash is a technology of the past. If you wish to do some benchmarking between the HTML5 canvas and Flash, take a look at this remake of the complete first level of <a href="http://www.ariscommunity.com/users/kristof-coussens/2009-11-27-find-princess" target="_blank">Super Mario</a>. We also experimented with SVG, but it seems it has the same future as Flash does.</p>
<p>I think our model viewer proves that HTML5 is not just ready to create visually appealing websites, but also the web apps of tomorrow.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fhtml5tutorial.net%2Fnews%2Fhtml5-web-app-aris-modelviewer.html&amp;title=HTML5%20web%20app%3A%20ARIS%20ModelViewer" id="wpa2a_14"><img src="http://html5tutorial.net/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="share save 171 16 HTML5 web app: ARIS ModelViewer"  title="HTML5 web app: ARIS ModelViewer" /></a></p>]]></content:encoded>
			<wfw:commentRss>http://html5tutorial.net/news/html5-web-app-aris-modelviewer.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>The iPhone and HTML5 – What’s Happening There?</title>
		<link>http://html5tutorial.net/news/the-iphone-and-html5-%e2%80%93-what%e2%80%99s-happening-there.html</link>
		<comments>http://html5tutorial.net/news/the-iphone-and-html5-%e2%80%93-what%e2%80%99s-happening-there.html#comments</comments>
		<pubDate>Tue, 02 Nov 2010 17:44:32 +0000</pubDate>
		<dc:creator>the Editor</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[html5]]></category>
		<category><![CDATA[iPhone]]></category>

		<guid isPermaLink="false">http://html5tutorial.net/?p=417</guid>
		<description><![CDATA[There has been a fair amount of press concerning the new HTML5 standard and how it may impact video playback and rich web content as an alternative to Flash. HTML5 is supposed to be more efficient than Flash in terms of processing load. The testing is inconclusive but one area where HTML5 seems to be [...]]]></description>
			<content:encoded><![CDATA[<p>There has been a fair amount of press concerning the new HTML5 standard and how it may impact video playback and rich web content as an alternative to Flash.  HTML5 is supposed to be more efficient than Flash in terms of processing load.  The testing is inconclusive but one area where HTML5 seems to be more embraced is with the iPhone.</p>
<p>One reason could be that using the least amount of processing power for a given application is very important.  While the iPhone packs a lot of smarts into a small package, it certainly can’t compete with the processing power and graphics processing found in a full sized PC or Mac.</p>
<p>A clear indication of the iPhone’s move towards more HTML5 is demonstrated in the new YouTube app for iPhone.   The new application allows iPhone users to browse and search for videos, access details of their account, and stream video playback without the Flash plugin.</p>
<p>Other video providers including CBS networks are reported to be developing players based on HTML5 for their streaming content.</p>
<p>So for these and other developers of iPhone apps, they have begun writing them for HTML5.  Some of the acknowledged advantages of Flash such as better fonts, a game engine, and other high end graphics are not nearly so critical for the small screen in the iPhone.</p>
<p>And the efficiencies and flexibility they can achieve with HTML5 more than make up for some of these advantages found in Flash.  And support for HTML5 versus Flash in the iPhone is strongly by Steve Jobs who felt that the slow and buggy flash plugin to the iPhone was due to “lazy” developers at Adobe.</p>
<p>It has also been reported that the use of Flash in iPhone applications would significantly impact battery life from 10 hours down to about 1.5 hours.  If this is true, it is obviously a significant detriment to using Flash in a mobile device like the iPhone.  Jobs is a very strong proponent for HTML5 and indicates it is absolutely the way to go for iPhone apps.</p>
<p>In defense, Adobe has stated that their upcoming Flash player version 10.1 will show great improvement on mobile applications and that they are also working on its performance with Mac OS X.</p>
<p>So while the debate ranges on whether Flash is superior to HTML5 or vice versa, development of iPhone apps for HTML5 are well established and continuing to grow strong.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fhtml5tutorial.net%2Fnews%2Fthe-iphone-and-html5-%25e2%2580%2593-what%25e2%2580%2599s-happening-there.html&amp;title=The%20iPhone%20and%20HTML5%20%E2%80%93%20What%E2%80%99s%20Happening%20There%3F" id="wpa2a_16"><img src="http://html5tutorial.net/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="share save 171 16 The iPhone and HTML5 – What’s Happening There?"  title="The iPhone and HTML5 – What’s Happening There?" /></a></p>]]></content:encoded>
			<wfw:commentRss>http://html5tutorial.net/news/the-iphone-and-html5-%e2%80%93-what%e2%80%99s-happening-there.html/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>HTML5 vs Flash – How Does It Affect You?</title>
		<link>http://html5tutorial.net/news/html5-vs-flash-how-does-it-affect-you.html</link>
		<comments>http://html5tutorial.net/news/html5-vs-flash-how-does-it-affect-you.html#comments</comments>
		<pubDate>Sun, 10 Oct 2010 09:16:04 +0000</pubDate>
		<dc:creator>the Editor</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[html5]]></category>

		<guid isPermaLink="false">http://html5tutorial.net/?p=414</guid>
		<description><![CDATA[The manner in which most videos are currently played through browsers these days is through a Flash plugin. This works pretty well but Flash unfortunately requires a lot of computing power. A new web standard HTML5 is trying to change that. HTML5 has been designed with audio and video codecs which should take less processing [...]]]></description>
			<content:encoded><![CDATA[<p>The manner in which most videos are currently played through browsers these days is through a Flash plugin.  This works pretty well but Flash unfortunately requires a lot of computing power.  A new web standard HTML5 is trying to change that.</p>
<p>HTML5 has been designed with audio and video codecs which should take less processing power than an equivalent Flash player.  Independent tests have shown that this is generally so although not entirely across the board.  As with most new technologies, things are not always clearcut.</p>
<p>However even with improvements in processing efficiency from HTML5, it should not be assumed that it will completely replace Flash or even have a significant impact, especially on rich web content.  Flash still has many advantages such as:</p>
<p>~ Better sub pixel resolution and anti aliasing<br />
~ It’s good excellent developer tools (far more extensive than HTML5)<br />
~ Flash has a vast array of good looking and impactful fonts</p>
<p>At this point, graphic artists and game developers still love Flash.  And though they certainly like the idea of being able to operate with less computing overhead, they want to get the most control and ability to generate outstanding results.</p>
<p>However for many simpler video playback application such as in YouTube, HTML5 has the ability to quickly surpass Flash as the video/audio player of choice in browsers.  At this point, the development of the YouTube HTML5 supported player is still in its early phases and a lot more tweaking and refinement must be done.</p>
<p>It also needs more support to work properly with other browsers and extensive testing to work out instability and incompatibility issues.  However since it’s on an open platform, there are many people working through these issues so it is just a matter of time.</p>
<p>But many people feel that this process could easily take years.  There are still many issues to work through.  This gets down to some parts of the HTML5 specification which are viewed to be controversial by many critics.</p>
<p>And the fact still remains that HTML5 is not compatible with all browsers and many users are resistant to changing to another browser.  As far as the average computer user is concerned, if it works ok for them they are not interested in moving to another browser.</p>
<p>For example, Intenet Explorer is largely criticized for its instability and security flaws.  Yet many people steadfastly hold on that browser and are very reluctant to change to something like Firefox or Chrome.</p>
<p>So be aware that even with the potential efficiencies which HTML5 can bring, don’t expect rapid deployment or changes away from Flash.</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fhtml5tutorial.net%2Fnews%2Fhtml5-vs-flash-how-does-it-affect-you.html&amp;title=HTML5%20vs%20Flash%20%E2%80%93%20How%20Does%20It%20Affect%20You%3F" id="wpa2a_18"><img src="http://html5tutorial.net/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="share save 171 16 HTML5 vs Flash – How Does It Affect You?"  title="HTML5 vs Flash – How Does It Affect You?" /></a></p>]]></content:encoded>
			<wfw:commentRss>http://html5tutorial.net/news/html5-vs-flash-how-does-it-affect-you.html/feed</wfw:commentRss>
		<slash:comments>15</slash:comments>
		</item>
		<item>
		<title>YouTube Video Player Uses HTML5</title>
		<link>http://html5tutorial.net/news/youtube-video-player-uses-html5.html</link>
		<comments>http://html5tutorial.net/news/youtube-video-player-uses-html5.html#comments</comments>
		<pubDate>Sat, 18 Sep 2010 12:36:35 +0000</pubDate>
		<dc:creator>the Editor</dc:creator>
				<category><![CDATA[News]]></category>
		<category><![CDATA[youtube]]></category>
		<category><![CDATA[youtube html5]]></category>

		<guid isPermaLink="false">http://html5tutorial.net/?p=410</guid>
		<description><![CDATA[In August of last year, Youtube introduced a video player which uses the HTML5 video tags. If your browser can support this video tag and the YouTube video you want to use doesn’t include captions, annotations and doesn’t show ads, you’ll be able to watch this video in YouTube’s HTML5 player. Here are some highlights [...]]]></description>
			<content:encoded><![CDATA[<p>In August of last year, Youtube introduced a video player which uses the HTML5 video tags. If your browser can support this video tag and the YouTube video you want to use doesn’t include captions, annotations and doesn’t show ads, you’ll be able to watch this video in YouTube’s HTML5 player. Here are some highlights of the player.</p>
<p>HTML5 is a new web standard and is gaining rapid popularity. It enables features which enhances your web experience and supports video and audio playback. This means that users with an HTML5 compatible browser and the appropriate codecs don’t need to download separate browser plugins.</p>
<p>It should be noted that for now, the browsers which are compatible with this video player include the following:</p>
<p>· Firefox 4 (WebM,)<br />
· Google Chrome<br />
· Opera 10.6+ (WebM)<br />
· Apple Safari (h.264, version 4+)<br />
· Microsoft Internet Explorer 9 (h.264)<br />
· Microsoft Internet Explorer 6, 7, or 8 with Google Chrome Frame installed</p>
<p>Keep in mind that this player is still in the experimental phase and there are limited videos produced for this format. However as the bugs get worked out and HTML5 gets more mainstream, you are sure to se this player pick up in popularity.</p>
<p>It’s an open platform so there are a lot of people working on it and enhancing it. There are a few other things to note as listed in the YouTube support page for HTML5.</p>
<p>· Fullscreen support is partially implemented. Pressing the fullscreen button will expand the player to fill your browser. If your browser supports a fullscreen option, you can then use that to truly fill the screen</p>
<p>· The HTML5 player has a badge in the control bar. If you don&#8217;t see the &#8220;HTML5&#8243; icon in the control bar, you&#8217;ve been directed to the Flash player (due to restrictions listed below)</p>
<p>· The HTML5 player also has a badge to indicate the video is using the WebM format. If you don&#8217;t see the &#8220;WebM&#8221; icon, the video is encoded using h.264</p>
<p>· If you want to find videos with WebM formats available, you can use the Advanced Search options to look for them (or just add &amp;webm=1 to any search URL)</p>
<p>And for those of you who really aren’t sure what the big deal is about this player and HTML5 in the first place, it is designed to replace the Flash player/plugin. This player hogs a lot of computing resources so migration to a video player which operates under HTML5 will enable a much more efficient and faster process. So those high def movies won’t slow down the rest of your system..</p>
<p><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fhtml5tutorial.net%2Fnews%2Fyoutube-video-player-uses-html5.html&amp;title=YouTube%20Video%20Player%20Uses%20HTML5" id="wpa2a_20"><img src="http://html5tutorial.net/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="share save 171 16 YouTube Video Player Uses HTML5"  title="YouTube Video Player Uses HTML5" /></a></p>]]></content:encoded>
			<wfw:commentRss>http://html5tutorial.net/news/youtube-video-player-uses-html5.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

