<?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>Backelite EN</title>
	<atom:link href="http://www.backelite.com/en/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.backelite.com/en</link>
	<description></description>
	<lastBuildDate>Tue, 11 Jun 2013 11:38:00 +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>Windows 8 et son écosystème</title>
		<link>http://www.backelite.com/en/2012/02/13/windows-8-et-son-ecosysteme/</link>
		<comments>http://www.backelite.com/en/2012/02/13/windows-8-et-son-ecosysteme/#comments</comments>
		<pubDate>Mon, 13 Feb 2012 13:26:10 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Non classé]]></category>

		<guid isPermaLink="false">http://www.backelite.com/?p=253</guid>
		<description><![CDATA[Une version très jeune mais contenant plusieurs nouveautés majeures fut présentée et mise à disposition...]]></description>
			<content:encoded><![CDATA[<p><img class="alignnone size-full wp-image-252" src="http://www.backelite.com/wp-content/uploads/2012/02/tmp-blog-img.jpg" alt="" width="691" height="388" /></p>
<p>Une version très jeune mais contenant plusieurs nouveautés majeures fut présentée et mise à disposition des développeurs et du public dans la foulée. Ce billet donnera des pistes de réflexion sur l’impact de ces nouveautés et abordera l’écosystème Windows existant.</p>
<h3>Un vaste écosystème</h3>
<p>S’il est facile de s’enthousiasmer pour les chiffres de croissance des terminaux mobiles comme les smartphones et les tablettes, on oublie souvent que l’écosystème Windows est gigantesque. Plus de 450 millions de licences du dernier OS de Microsoft, Windows 7, ont été vendues en l’espace de 2 ans (octobre 2009). Ce chiffre lui permet de dépasser Windows XP comme l’OS le plus répandu sur les PCs (40.17% contre 38.72%) à travers le monde. Une telle base représente aussi bien les ordinateurs de bureau que les portables en passant par les tablet PCs. Ces derniers n’ont jamais vraiment réussi à convaincre et ni à atteindre une part de marché critique.</p>
<p>Fort du constat que cet écosystème colossal est une cible potentielle alléchante pour tous les développeurs à travers le monde, la prochaine version de Windows contiendra une variante de la Marketplace déjà connue sur les autres services Microsoft (Windows Phone, Xbox, Zune) et très proche des leaders du marché que sont l’App Store et l’Android Market. Sa particularité sera de faire cohabiter des applications d’un nouveau type introduit par Windows 8 : les Metro-style apps,<br />
des applications existantes (comme Adobe Photoshop, Quicken, etc…) sous forme de liens vers les sites web des éditeurs</p>
]]></content:encoded>
			<wfw:commentRss>http://www.backelite.com/en/2012/02/13/windows-8-et-son-ecosysteme/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HTML5 video and audio tags support on mobile device: real world feedback</title>
		<link>http://www.backelite.com/en/2012/02/07/article-numero-2/</link>
		<comments>http://www.backelite.com/en/2012/02/07/article-numero-2/#comments</comments>
		<pubDate>Tue, 07 Feb 2012 10:01:20 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Non classé]]></category>

		<guid isPermaLink="false">http://localhost:8888/backelite/wp/?p=13</guid>
		<description><![CDATA[&#160; In this article, we will not discuss about the many issues to deal with...]]></description>
			<content:encoded><![CDATA[<p>&nbsp;</p>
<p>In this article, we will not discuss about the many issues to deal with video and audio containers and codecs. We just want to know if it is possible to use the video and audio tags out in the real world on mobile devices.</p>
<p>HTML5 video and audio tags are under the spotlights right now.<br />
They are supposed to be THE solution to display medias on all devices without relying on third party plug-ins like Flash.</p>
<p>In this article, we will not discuss about the many issues to deal with video and audio containers and codecs. We just want to know if it is possible to use the video and audio tags out in the real world on mobile devices.</p>
<p>&nbsp;</p>
<h2>What does the W3C tell us?</h2>
<p><strong>About the video tag:</strong><br />
“A video element is used for playing videos or movies, and audio files with captions.<br />
Content may be provided inside the video element. User agents (read “browsers”) should not show this content to the user; it is intended for older Web browsers which do not support video, so that legacy video plugins can be tried, or to show text to the users of these older browsers informing them of how to access the video contents.”</p>
<p><strong>About the audio tag:</strong><br />
“An audio element represents a sound or audio stream.<br />
Content may be provided inside the audio element. User agents should not show this content to the user; it is intended for older Web browsers which do not support audio, so that legacy audio plug-ins can be tried, or to show text to the users of these older browsers informing them of how to access the audio contents.”</p>
<p>Developers can also set attributes such as:</p>
<ul>
<li>poster: to define an image file that the browser can show while no video data is available</li>
<li>controls: to enable controls of the media</li>
</ul>
<h2>What did we test ?</h2>
<p>We created statics HTML pages with the following :</p>
<h3>The video tag</h3>
<p>The html :<br />
<code><br />
&lt;video controls="controls" poster="video-poster.jpg"&gt;<br />
&lt;source src="vp8_1280x720.webm" type="video/webm;" /&gt;<br />
&lt;source src="h264_qvga.mp4" type="video/mp4; codecs='avc1.42E01E, mp4a.40.2'" /&gt;<br />
&lt;source src="h263_176x144.3gp" type="video/3gp; codecs='h263, amr'" /&gt;<br />
Video not supported<br />
&lt;/video&gt;<br />
</code></p>
<p>What we are testing :</p>
<ul>
<li>Controls should be displayed (at least, the video can be played when clicking on the poster)</li>
<li>The specified poster is displayed</li>
<li>Three common videos formats are listed : webm, mp4 and 3gp. The browser should pick up the formats that it is able to play</li>
<li>The text “Video not supported” should be displayed when the video tag cannot be interpreted</li>
</ul>
<h3>The audio tag</h3>
<p>The html :<br />
<code><br />
&lt;audio controls="controls"&gt;<br />
&lt;source src="music.aac" type="audio/x-aac"/&gt;<br />
&lt;source src="auto.mp3" type="audio/mpeg"/&gt;<br />
Audio not supported<br />
&lt;/audio&gt;<br />
</code></p>
<p>What are we testing:</p>
<ul>
<li>Controls should be displayed (at least, the audio file can be played)</li>
<li>Two common audio formats are listed : aac and mp3. The browser should pick up the formats it is able to play</li>
<li>The text “Audio not supported” should be displayed when the audio tag cannot be interpreted</li>
</ul>
<h2>Tests results on devices</h2>
<table border="0" cellspacing="0">
<tbody>
<tr>
<td align="center" valign="middle"><strong>OS</strong></td>
<td align="center" valign="middle"><strong>OS Version</strong></td>
<td align="center" valign="middle"><strong>Browser</strong></td>
<td align="center" valign="middle"><strong>Device</strong></td>
<td align="center" valign="middle"><strong>&lt;video&gt; support : FULL</strong></td>
<td align="center" valign="middle"><strong>&lt;video&gt; support : Partial</strong></td>
<td align="center" valign="middle"><strong>&lt;audio&gt; support : FULL</strong></td>
<td align="center" valign="middle"><strong>&lt;audio&gt; support : Partial</strong></td>
<td align="center" valign="middle"><strong>Notes</strong></td>
</tr>
<tr>
<td align="left" valign="middle"><strong>Android</strong></td>
<td align="left" valign="middle">1.6</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">HTC Tatoo</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">Do not play video or audio but works as expected (shows the fallback text)</td>
</tr>
<tr>
<td align="left" valign="middle" height="17"><strong>Android</strong></td>
<td align="left" valign="middle">2.2</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">HTC Magic</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">Displays only the poster !</td>
</tr>
<tr>
<td align="left" valign="middle" height="32"><strong>Android</strong></td>
<td align="left" valign="middle">2.3.6</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">Samsung Nexus S</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">audio: player is displayed but do not play sound</td>
</tr>
<tr>
<td align="left" valign="middle" height="17"><strong>Android</strong></td>
<td align="left" valign="middle">3.0</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">Acer Iconia</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3"></td>
</tr>
<tr>
<td align="left" valign="middle" height="32"><strong>iOS</strong></td>
<td align="left" valign="middle">3.1.2</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">Apple iPod touch</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">Not able to display the right video out of the listed &lt;source&gt;</td>
</tr>
<tr>
<td align="left" valign="middle" height="32"><strong>iOS</strong></td>
<td align="left" valign="middle">3.2</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">Apple iPad 1</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">Not able to display the right video out of the listed &lt;source&gt;</td>
</tr>
<tr>
<td align="left" valign="middle" height="19"><strong>iOS</strong></td>
<td align="left" valign="middle">4</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">Apple iPhone</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3"></td>
</tr>
<tr>
<td align="left" valign="middle"><strong>Blackberry</strong></td>
<td align="left" valign="middle">4.6</td>
<td align="left" valign="middle">default (BB)</td>
<td align="center" valign="middle">BB Curve (8520)</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">Do not play video or audio but works as expected (shows the fallback text)</td>
</tr>
<tr>
<td align="left" valign="middle" height="62"><strong>Blackberry</strong></td>
<td align="left" valign="middle">6</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">BB Torch</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">no poster, no fallbak text for video tag.<br />
Note : html5test.com says it does support the video tag!</td>
</tr>
<tr>
<td align="left" valign="middle"><strong>Bada</strong></td>
<td align="left" valign="middle">1.2</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">Samsung WAVE (S8500)</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">Do not play video or audio but works as expected (shows the fallback text)</td>
</tr>
<tr>
<td align="left" valign="middle"><strong>Windows Phone</strong></td>
<td align="left" valign="middle">7</td>
<td align="left" valign="middle">default (IE7)</td>
<td align="center" valign="middle">LG E900</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">Do not play video or audio but works as expected (shows the fallback text)</td>
</tr>
<tr>
<td align="left" valign="middle" height="17"><strong>Windows Phone</strong></td>
<td align="left" valign="middle">7.5 (mango)</td>
<td align="left" valign="middle">default (IE9)</td>
<td align="center" valign="middle">Dell Venue</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">ok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3"></td>
</tr>
<tr>
<td align="left" valign="middle" height="92"><strong>Palm</strong></td>
<td align="left" valign="middle">HP webOS 2.1.0</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">Palm Pré 2</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">&lt;video&gt; : poster is diplayed but<br />
- do not play video when video path is relative to the page<br />
- do not display any controls<br />
&lt;audio&gt; : do not display the fallback text as expected</td>
</tr>
<tr>
<td align="left" valign="middle"><strong>Samsung proprietary</strong></td>
<td align="left" valign="middle"></td>
<td align="left" valign="middle">default</td>
<td align="center" valign="middle">Samsung player one</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">Do not play video or audio but works as expected (shows the fallback text)</td>
</tr>
<tr>
<td align="left" valign="middle"><strong>Symbian^3</strong></td>
<td align="left" valign="middle">Anna</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">Nokia E7</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">Do not play video or audio but works as expected (shows the fallback text)</td>
</tr>
<tr>
<td align="left" valign="middle"><strong>Symbian v3</strong></td>
<td align="left" valign="middle">9.2 rel. 3.1</td>
<td align="left" valign="middle">default (webkit)</td>
<td align="center" valign="middle">Nokia N95-8Gb</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#F4CCCC">nok</td>
<td align="left" valign="middle" bgcolor="#D9EAD3">Do not play video or audio but works as expected (shows the fallback text)</td>
</tr>
</tbody>
</table>
<h2>Case studies results</h2>
<p>From our tests with real devices, we came up with those three distinct cases:</p>
<h3>1. It works as expected</h3>
<p>It means that either the video or audio is played or the fallback text is displayed.<br />
Most of the devices we have been testing fall in this case.</p>
<h3>2. It works almost as expected</h3>
<p>Devices are supposed to choose between the different source tags you specify in the video or audio tag. This is a great feature because the browser will not download media file if it is not able to play it and should fallback to the next source.</p>
<p>In practice we noticed that some mobile browsers (like Android prior to 2.3 or iOS prior to 4) didn’t go down the list if the first source tag contains a media file not supported.</p>
<p>The workaround consists of sending only one media (which you know its format can be played on the targeted browser).<br />
Ex :<br />
<code><br />
&lt;video src="vp8_1280x720.webm" controls="controls" poster="video-poster.jpg" /&gt;<br />
</code></p>
<h3>3. It completely fails</h3>
<p>In this case, the browser is not able to play any media files <strong>and</strong> does not display the fallback text.</p>
<p>The Blackberry 9800 (OS 6) is an interesting use case. This device displays the video tag as a big blank space the size of the video. It clearly fails to play a video. To find out if this browser was supposed to support this HTML5 tag, we run the <a href="http://html5test.com/">http://html5test.com/</a> test with the device. The answer was Yes, it does support the video tag.<br />
This test uses Javascript techniques to check whether the browser supports a certain tag.<br />
In this case, we can conclude that, although it works in most cases, this technique is not as accurate as the good old manual test.</p>
<h2>Conclusion</h2>
<p>So, is it possible to use the video and audio tags out in the real world on most mobile devices?</p>
<p>Well, the strict answer is no. You will still need to use some tricks if you want your media to be played on devices others than the very new ones.</p>
<p>The good news is that the vast majority of mobile device will play mp4, 3gp video formats and aac, mp3 audio formats. That’s easier to handle than the many more various formats supported or not supported by web browsers!</p>
<p>Some resources:</p>
<ul>
<li><a href="http://diveintohtml5.info/video.html">http://diveintohtml5.info/video.html</a></li>
<li><a href="http://my.opera.com/core/blog/2010/03/03/everything-you-need-to-know-about-html5-video-and-audio-2">http://my.opera.com/core/blog/2010/03/03/everything-you-need-to-know-about-html5-video-and-audio-2</a></li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.backelite.com/en/2012/02/07/article-numero-2/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
