What’s new in HTML5 and what happened to XHTML2
Is XHTML dead? In July, the XHTML2 working group announced it would be dropping the spec and closing the book on XHTML2. That’s XHTML with a 2. Not XHTML.
XHTML is alive and well – it’s just not getting the overhaul that was intended with XHTML2. If you’re a developer or designer who writes markup, then you’re possibly already using XHTML 1.0 or 1.1, strict, transitional or otherwise.
I’d also be willing to bet that if you’re using it, you’re using it to make use of stricter validation rules: lowercase tags, double quoted attributes, self-closing tags (like
) and so on – right?
Equally, if you’re that type of designer or developer, you’re probably also not serving it as true XHTML. Quite simply because Internet Explorer doesn’t accept the application/ xhtml+xml mime type at all, which is a requirement for XHTML. This is old news, though.
The new news is that XHTML2 is dead. The idealist recommendation for the web didn’t make it. Possibly because of the lack of backward compatibility, possibly for lots of reasons – the web was hot with discussion on the loss of the spec; the why, who and “whoh!”.
However, there is hope. If you’re the type of person who likes the strict rules of markup design that runs everything carefully through a validator then you’ll be over the moon to know two things:
Firstly, HTML5 supports all the lowercase, self-closing tags, double quoted attributes – the works. And if you don’t like these things, it supports that too!
Secondly, if you absolutely have to have XHTML in your bag of tricks, XHTML5 will satisfy your thirst. XHTML5 is quite simply HTML5 + XML, ie all the normal rules of XHTML, like no document. write allowed.
* Google plumps for HTML 5 over Gears successor
For it to be XHTML5, though, you must serve it as application/xml or application/ xhtml+xml (which isn’t currently supported in IE). So HTML5 with lovely XHTML-style markup is the way I’ll be going.
Before we dive into what’s in HTML5 and what we have to do to get it going, though, I want to address the future: 2022. Aside from it being the year Queen Elizabeth II will celebrate her Platinum Jubilee (assuming she’s still around), it’s the date that’s been inappropriately linked with HTML5 in the minds of many in our community. It’s wrong.
In fact, HTML5 is ready to use today. So why the confusion? In an interview by Tech Republic, Ian Hickson, the editor of the HTML5 working draft, was asked to give a timeline of the HTML5 recommendation.
One date should have come out of that interview, but another, much further away did instead: 2022 – the date of the final proposed recommendation, which actually translates to: require at least two browsers to completely pass HTML5 test suites.
Let’s put this in context of another spec that’s taken a very long time: CSS2.1. CSS2.1 is CSS that I’m certain you’re familiar with. I’m certain you use it day to day, without any thought as to whether it’s a completed spec. Well, it’s been in development for over 10 years, and it has only just become a candidate recommendation (23 April 2009).
Even then, it still doesn’t have two browsers completely supporting it. Only Internet Explorer 8 supports the full CSS2.1 spec. Did that stop you from using CSS2.1? I suspect not. Will that stop us from using HTML5? It certainly shouldn’t.
HTML5 is available and ready to use today. In fact, the really important HTML5 date is October 2009. This is the last call for the HTML5 working draft. That means that issues with the spec, enhancements, bugs, anything – it all needs to be in and submitted and written into the spec for October (although it can go through reiterations, this is the main deadline).
The Web Hypertext Application Technology Working Group (WHATWG) is completely open for anyone to contribute their ideas and suggestions.
At the site, you can sign up to the mailing lists. You can communicate directly using IRC. And there’s even a complete log of all the IRC history. It’s all available from whatwg.org.
HTML5 in five seconds
So how do you get your markup to validate as HTML5? It’s super easy: you change your DOCTYPE from whatever it is now to this:
That’s it. It doesn’t require anything more than that.
Google is doing it already. Check out its homepage, written all in one line:
HTML5 – Google Search</ title><script></p>
<p>Ironically, Google's search page and listings don't validate because of their use of invalid tags – font element for instance – and a number of other errors. But that doesn't matter, because they can take advantage of the HTML5 parsing rules with that doctype (for example: no type attribute on the script element).</p>
<p>Although that's all you need for HTML5 to be triggered, there's a lot more to HTML5 for you to play with. If you want something a little fuller, here's a typical boilerplate for HTML5, which includes the IE shiv (which I'll discuss later) and default HTML5 block styles:</p>
<p><!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<!--[if IE]> <script src="http://html5shiv.googlecode com/svn/trunk/html5.js"></script> <![endif]--></p>
<style> article, aside, figure, footer, header, hgroup, menu, nav, section { display: block; } </style>
<p></head><br />
<body></p>
<p>Hello World</p>
<p></body><br />
</html><br />
A note about the style and script elements in HTML5: these both no longer need the type attribute as they default to text/css and text/ javascript respectively, which just helps to remove a little more cruft from our markup</p>
<h2>The new HTML5 elements</h2>
<p>More markup</p>
<p>Way back when we were laying pages out using the table element, we probably weren't aware of semantics and standards. Nowadays, we're using divs left right and centre.</p>
<p>The situation isn't terrible, because most of us are using semantic classes and ID naming conventions to describe what the function of the div is. Wouldn't it just be better if we had a header and footer element instead? HTML5 gives us exactly that.</p>
<p>One of the biggest assets to us authors of HTML5 is the new semantic markup. There's an arsenal of new elements that has been added to HTML5, and because of the 'pave the cowpaths' approach, these can be used by the browsers today (although some might need a little bit of prodding from JavaScript).</p>
<p>Here's a non-exclusive list of the new HTML5 elements that are available:</p>
<p>1) Block structure</p>
<p>article represents a component of a page that consists of a self-contained composition in a document, page, application, or site and that is intended to be independently distributable or reusable.</p>
<p>This could be a forum post, blog post, newspaper article, a user comment, or any other independent item of content.</p>
<p>aside is used to represent a section of content that is related to the content around the aside element, eg a pull quote or a sidebar.</p>
<p>footer is the footer to a section. This is not restricted to one use at the bottom of the page. You can also use the footer to mark up the footer of a blog post in addition to the footer of the entire document.</p>
<p>header represents a group of navigational aids, and is used to construct the document outline. You are also not restricted to using header only once; you could use this to mark up the author's name and the time of a comment placed on a blog post, for example.</p>
<p>nav is used to wrap major navigation blocks, such as table of contents, pagination links and breadcrumbs. Note that the nav element should be used for links that navigate around site, ie inappropriate for a list of sponsor links.</p>
<p>section is a generic document or application section. However, this isn't a replacement for the div element. A section is only appropriate if the element's contents would be listed explicitly in the document's outline.</p>
<p>2) Inline semantics</p>
<p>details is used to include additional info that the user can obtain on demand. An open attribute on the element determines whether its contents can be seen, and it can be toggled by the user or by JavaScript.</p>
<p>figure is used to annotate illustrations, photos, listings etc that, if moved away from the primary content, would not affect the flow of the document.</p>
<p>mark highlights a run of text, eg to mark the terms the user was searching for.</p>
<p>time is intended to encode modern dates and times in a machine-readable way. The datetime attribute on this element gives the machine readable time, whereas the contents is human readable.</p>
<p>3) Interactive elements</p>
<p>The following elements include DOM interface methods that allow them to function correctly. So if the browser hasn't implemented these elements specifically, they won't work. However, they all support fallbacks using nested elements within the tag to degrade down to a working solution.</p>
<p>audio and video are both types of media elements. They enable you to embed audio and video directly into the browser without any need for plug-ins. However, where support is lacking in the browser, best practice suggests that you should fall back to Flash plug-ins. You can either let the browser render the chrome for the element, or take control via JavaScript to create a bespoke interface.</p>
<p>source is a child element to audio and video. It enables you to specify multiple alternative sources for the media element. For example, Firefox doesn't support the WAV audio format, so you can specify an alternative source in Ogg Theora format.</p>
<p>canvas is a 2D drawing element that can be accessed using JavaScript to render graphics on the fly – for example, for games, graphs or animations.</p>
<p>4) Compatibility</p>
<p>Where the new elements aren't relying on a new DOM interface to be available to the browser, the element is available to you right now. The media elements audio and video have a new DOM interface, so only those browsers that have specifically implemented these media elements will be able to offer native audio or video.</p>
<p>However, this shouldn't hold you back from using these elements. If you use the video element and it's not supported in the browser, its contents will be rendered. For example, for my video element, I'll first provide an Ogg Theroa-encoded video, then QuickTime, then finally degrade down to Flash if the video element isn't supported:</p>
<p>However, there are a couple of browsers that do have trouble seeing the new elements natively. In particular, all versions of Internet Explorer can't see the elements by default, and as such they can't be styled without the help of a bit of JavaScript.</p>
<p>Firefox 2 and Camino 1 have a bug in the Gecko rendering engine that causes the DOM to render incorrectly. However, Firefox 2 had its <a href="http://redirectingat.com/?id=92X363&url=http%3A%2F%2Fyuiblog.com%2Fblog%2F2009%2F07%2F02%2Fgbs-update-20090702%2Fhttp%3A%2F%2Fyuiblog.com%2Fblog%2F2009%2F07%2F02%2Fgbs-update-20090702%2F" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','redirectingat.com/?id=92X363&url=http%3A%2F%2Fyuiblog.com%2Fblog%2F2009%2F07%2F02%2Fgbs-update-20090702%2Fhttp%3A%2F%2Fyuiblog.com%2Fblog%2F2009%2F07%2F02%2Fgbs-update-20090702%2F']);">A-grade support dropped</a> earlier this year, and Firefox has a very solid upgrade path (hence why they've been dropped from A-grade support in the first place)</p>
<p><a href="http://www.coredigest.com/?attachment_id=570" rel="attachment wp-att-570"><img src="http://www.coredigest.com/wp-content/uploads/2009/12/NET195.f_html5.whencaniuse-420-90-300x259.jpg" alt="NET195.f_html5.whencaniuse-420-90" title="NET195.f_html5.whencaniuse-420-90" width="300" height="259" class="alignnone size-medium wp-image-570" /></a></p>
<p>Camino has version 2 in beta, but it hasn't been released just yet (and arguably, it's not an A-grade browser). However, there are a few ways to fix Firefox 2 and Camino 1 and you can <a href="http://redirectingat.com/?id=92X363&url=http%3A%2F%2Fhtml5doctor.com%2Fhow-to-get-html5-working-in-ie-and-firefox-2%2F" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','redirectingat.com/?id=92X363&url=http%3A%2F%2Fhtml5doctor.com%2Fhow-to-get-html5-working-in-ie-and-firefox-2%2F']);">read about them</a> here</p>
<h2>Fixing Internet Explorer</h2>
<p>Fixing Internet Explorer</p>
<p>So, Internet Explorer is problematic. What's new, right? The fix is actually incredibly simple, and if you're using any of the new DOM APIs or HTML5 JavaScript APIs, the requirement for JavaScript is justified.</p>
<p>Sjoerd Visscher first posted about this solution whereby Internet Explorer is able to style any element so long as you run the following code:</p>
<p>document.createElement('myelement');</p>
<p>Now myelement can be styled using CSS in Internet Explorer. We also have an HTML5 shiv to enable all the HTML5 elements for Internet Explorer. So long as this script is included in the head element, then you'll be able to style the document correctly:</p>
<p><!--[if IE]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--></p>
<p>If JavaScript isn't enabled, the document will be displayed as if CSS hadn't been applied to the document, which (given that we're used to writing semantic standards-based markup) means all the content is accessible and readable regardless.</p>
<p>Default HTML5 styles</p>
<p>As with any browser, all the default styles for all elements are part of the browser. Since the browsers don't really know about these new elements by default, we need to give the block elements their initial default styles. This is fixed by including the following CSS in your style sheet:</p>
<p>header, nav, section, article, figure, aside, footer { display: block; }</p>
<p>But wait: it's more than just markup. HTML5 is much, much more than just markup changes. There's also the Web Forms 2.0 spec in HTML5 which means we don't have to use JavaScript to do the basic form validation that we've all repeated time and time again.</p>
<p>You've also seen how the audio and video elements can be interactive. They expose a DOM interface that JavaScript can interact with. Included in the HTML5 spec is a host of JavaScript APIs, along with a bunch of JavaScript APIs that used to be in the spec and have since been moved out to their own specs. New HTML5 JavaScript APIs include:</p>
<p>Drag and Drop – native JavaScript dragging, which also works across browser windows. Currently available in IE8, Firefox 3.5 and Safari 4.</p>
<p>Inline editing – enabling the user to edit content visibly on the page without an editor; the changes can then be used as the input to a CMS.</p>
<p>History API – to support Ajax-based applications and saving states in the history to move back and forth between.</p>
<p>Cross-domain messaging – allowing messages to be communicated across different domains. This is available in IE8, Firefox 3.5, Safari 4 and Opera 10.</p>
<p>Offline applications – enabling users to continue to use your web application even without a web connection. Available in Safari 4 (and iPhone Safari) and Firefox 3.5.</p>
<p>The specs are changing all the time, leading up to the last call (in October 2009).</p>
<p>Some of the other interesting JavaScript APIs include:</p>
<p>Local storage – two types of storage, key/value pair and SQL based to store data associated with your application.</p>
<p>Web workers – basically threading for JavaScript.</p>
<p>Geolocation – an API to retrieve the latitude and longitude.</p>
<p>New selector API – document. querySelectorAll uses CSS syntax to find elements in the DOM.</p>
<p>Web sockets – for TCP/IP type socket communication.</p>
<p>HTML5 is here to stay. The semantic elements are ready to be used today, and a decent amount of the JavaScript APIs are available in the latest browsers to be played with and integrated into your cutting edge applications. So go play! </p>
<div class="tweetthis" style="text-align:left;"><p> <a target="_blank" rel="nofollow" class="tt" href="http://twitter.com/home/?status=Everything+you+need+to+know+about+HTML5+http%3A%2F%2Fcoredigest.com%2F%3Fp%3D568" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','twitter.com/home/?status=Everything+you+need+to+know+about+HTML5+http%3A%2F%2Fcoredigest.com%2F%3Fp%3D568']);" title="Post to Twitter"><img class="nothumb" src="http://www.coredigest.com/wp-content/plugins/tweet-this/icons/en/twitter/tt-twitter.png" alt="Post to Twitter" /></a> <a target="_blank" rel="nofollow" class="tt" href="http://twitter.com/home/?status=Everything+you+need+to+know+about+HTML5+http%3A%2F%2Fcoredigest.com%2F%3Fp%3D568" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','twitter.com/home/?status=Everything+you+need+to+know+about+HTML5+http%3A%2F%2Fcoredigest.com%2F%3Fp%3D568']);" title="Post to Twitter">Tweet This Post</a></p></div><div style="text-align:center;width:100%;"><div style="margin:0px 0px 0px 0px;"><script type="text/javascript"><!--
google_ad_client = "ca-pub-5938866324528150";
/* coredigest tar Sq Botom */
google_ad_slot = "1917953991";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></div></div></div>
<p>Related posts:</p><ol><li><a href='http://www.coredigest.com/code-snippets/embed-youtube-videos-in-both-flash-and-html5/' rel='bookmark' title='Permanent Link: Embed YouTube Videos in both Flash and HTML5'>Embed YouTube Videos in both Flash and HTML5</a></li>
<li><a href='http://www.coredigest.com/google/html5-support-in-popular-web-browsers/' rel='bookmark' title='Permanent Link: HTML5 Support in Popular Web Browsers'>HTML5 Support in Popular Web Browsers</a></li>
</ol> </div><!--/entry -->
</div><!-- .entry-container -->
<div class="post-footer fix">
</div><!-- .post-footer -->
<div id="comments">
<div id="respond">
<h3 id="reply-title">Leave a Reply <small><a rel="nofollow" id="cancel-comment-reply-link" href="/technology/everything-you-need-to-know-about-html5/#respond" style="display:none;">Cancel reply</a></small></h3>
<form action="http://www.coredigest.com/wp-comments-post.php" method="post" id="commentform">
<span></span>
<p>
<label for='author' class=''>Name</label>
<input type='text' name='author' id='author' class='textarea' value='' size='28' tabindex='1' />(required)
</p>
<p>
<label for='email' class=''>E-mail</label>
<input type='text' name='email' id='email' value='' size='28' tabindex='2' class='textarea' />(required)
</p>
<p>
<label for='url' class=''>URI</label>
<input type='text' name='url' id='url' value='' size='28' tabindex='3' class='textarea' />
</p>
<p>
<label for='comment' class='textarea '>Your Comment</label>
<textarea name='comment' id='comment' cols='60' rows='10' tabindex='4' class='textarea'></textarea>
</p> <p class="form-allowed-tags">You may use these <abbr title="HyperText Markup Language">HTML</abbr> tags and attributes: <code><a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> </code></p> <p class="form-submit">
<input name="submit" type="submit" id="submit" value="Submit Comment" />
<input type='hidden' name='comment_post_ID' value='568' id='comment_post_ID' />
<input type='hidden' name='comment_parent' id='comment_parent' value='0' />
</p>
<script type='text/javascript'>
var RecaptchaOptions = { theme : 'red', lang : 'en' , tabindex : 5 };
</script><script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LfZOrsSAAAAAAfWOdNDIEPk4YGNYuEYh8k2Eryj"></script>
<noscript>
<iframe src="http://www.google.com/recaptcha/api/noscript?k=6LfZOrsSAAAAAAfWOdNDIEPk4YGNYuEYh8k2Eryj" height="300" width="500" frameborder="0"></iframe><br/>
<textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
<input type="hidden" name="recaptcha_response_field" value="manual_challenge"/>
</noscript> <div id="recaptcha-submit-btn-area"> </div>
<noscript>
<style type='text/css'>#submit {display:none;}</style>
<input name="submit" type="submit" id="submit-alt" tabindex="6" value="Submit Comment"/>
</noscript><p>Comment moderation is enabled. Your comment may take some time to appear.</p> </form>
</div><!-- #respond -->
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#commentform').submit(function() {
_gaq.push(
['_setAccount','UA-10953964-1'],
['_trackEvent','comment']
);
});
});
</script>
</div> </div><!--/post -->
</div><!-- content -->
</div><!-- main col -->
<div id='sidebar-wrap' class='sidebar-wrap sidebar-wrap-right fix'> <!-- #wsidebar-top -->
<div id="wsidebar-top" class="dbx-group right flattened warea">
<!--widget start --><div id="text-3" class="suf-flat-widget widget_text"> <div class="textwidget"><script type="text/javascript"><!--
google_ad_client = "ca-pub-5938866324528150";
/* Core Tar Sq 300 */
google_ad_slot = "3418635017";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></div>
</div><!--widget end --> </div>
<!-- /#wsidebar-top -->
<div id='sidebar-shell-1' class='sidebar-shell sidebar-shell-right'>
<div class="dbx-group right boxed warea" id="sidebar">
<!--widget start --><div id="archives-3" class="dbx-box suf-widget widget_archive"><div class="dbx-content"><h3 class="dbx-handle plain">Archives</h3> <ul>
<li><a href='http://www.coredigest.com/2011/07/' title='July 2011'>July 2011</a></li>
<li><a href='http://www.coredigest.com/2011/06/' title='June 2011'>June 2011</a></li>
<li><a href='http://www.coredigest.com/2011/05/' title='May 2011'>May 2011</a></li>
<li><a href='http://www.coredigest.com/2011/04/' title='April 2011'>April 2011</a></li>
<li><a href='http://www.coredigest.com/2011/01/' title='January 2011'>January 2011</a></li>
<li><a href='http://www.coredigest.com/2010/12/' title='December 2010'>December 2010</a></li>
<li><a href='http://www.coredigest.com/2010/11/' title='November 2010'>November 2010</a></li>
<li><a href='http://www.coredigest.com/2010/10/' title='October 2010'>October 2010</a></li>
<li><a href='http://www.coredigest.com/2010/09/' title='September 2010'>September 2010</a></li>
<li><a href='http://www.coredigest.com/2010/07/' title='July 2010'>July 2010</a></li>
<li><a href='http://www.coredigest.com/2010/02/' title='February 2010'>February 2010</a></li>
<li><a href='http://www.coredigest.com/2010/01/' title='January 2010'>January 2010</a></li>
<li><a href='http://www.coredigest.com/2009/12/' title='December 2009'>December 2009</a></li>
</ul>
</div></div><!--widget end --></div><!--/sidebar -->
</div>
<div id='sidebar-shell-2' class='sidebar-shell sidebar-shell-right'>
<div class="dbx-group right boxed warea" id="sidebar-2">
<!--widget start --><div id="categories-3" class="dbx-box suf-widget widget_categories"><div class="dbx-content"><h3 class="dbx-handle plain">Categories</h3> <ul>
<li class="cat-item cat-item-92"><a href="http://www.coredigest.com/android/" >Android</a>
</li>
<li class="cat-item cat-item-85"><a href="http://www.coredigest.com/apple/" >Apple</a>
</li>
<li class="cat-item cat-item-89"><a href="http://www.coredigest.com/blogging/" >Blogging</a>
</li>
<li class="cat-item cat-item-87"><a href="http://www.coredigest.com/code-snippets/" >Code Snippets</a>
</li>
<li class="cat-item cat-item-84"><a href="http://www.coredigest.com/firefox/" >Firefox</a>
</li>
<li class="cat-item cat-item-93"><a href="http://www.coredigest.com/gadgets/" >Gadgets</a>
</li>
<li class="cat-item cat-item-6"><a href="http://www.coredigest.com/games/" >Games</a>
</li>
<li class="cat-item cat-item-78"><a href="http://www.coredigest.com/google/" >Google</a>
</li>
<li class="cat-item cat-item-88"><a href="http://www.coredigest.com/how-to/" >How To</a>
</li>
<li class="cat-item cat-item-82"><a href="http://www.coredigest.com/linux/" >Linux</a>
</li>
<li class="cat-item cat-item-60"><a href="http://www.coredigest.com/microsoft/" >Microsoft</a>
</li>
<li class="cat-item cat-item-108"><a href="http://www.coredigest.com/social-networks/" >Social Networks</a>
</li>
<li class="cat-item cat-item-81"><a href="http://www.coredigest.com/softwares/" >Softwares</a>
</li>
<li class="cat-item cat-item-80"><a href="http://www.coredigest.com/technology/" >Technology</a>
</li>
<li class="cat-item cat-item-83"><a href="http://www.coredigest.com/tools/" >Tools</a>
</li>
<li class="cat-item cat-item-157"><a href="http://www.coredigest.com/videos/" >Videos</a>
</li>
<li class="cat-item cat-item-86"><a href="http://www.coredigest.com/wordpress/" >Wordpress</a>
</li>
<li class="cat-item cat-item-79"><a href="http://www.coredigest.com/yahoo/" >Yahoo</a>
</li>
</ul>
</div></div><!--widget end -->
</div><!--/sidebar-2 -->
</div>
</div> </div><!-- /container -->
<div id="cred">
<table>
<tr>
<td class="cred-left">© 2011 <a href='http://www.coredigest.com'>Core Digest</a></td>
<td class="cred-center"></td>
<td class="cred-right"><a href="http://www.aquoid.com/news/themes/suffusion/">Suffusion theme by Sayontan Sinha</a></td>
</tr>
</table>
</div>
<!-- 64 queries, 22MB in 0.999 seconds. -->
</div><!--/wrapper -->
<div id="bottom-bar">
<ul id="mainpanel">
<li><a href="javascript:;" onClick="location.href='http://www.coredigest.com'" class="home">Home</a></li>
<li id='latest-posts'><a href='javascript:;' class="recent-posts">Latest posts</a>
<div class="subpanel largesubpanel">
<h3><span> – </span> Latest posts</h3>
<ul>
<li><a href="http://www.coredigest.com/how-to/facebook-confirms-skype-integration-for-video-calling/" title="Post: <b>Facebook confirms Skype Integration for Video Calling </b>" ><b>Facebook confirms Skype Integration for Video Calling </b></a></li><li><a href="http://www.coredigest.com/google/google-pagerank-dropped-to-910/" title="Post: <strong> Google PageRank dropped to 9/10</strong>" ><strong> Google PageRank dropped to 9/10</strong></a></li><li><a href="http://www.coredigest.com/tools/how-to-take-website-screen-shot-thumbnail-in-windows-server/" title="Post: <strong>How to Take Website Screenshot / Thumbnail in Windows Server</strong>" ><strong>How to Take Website Screenshot / Thumbnail in Windows Server</strong></a></li><li><a href="http://www.coredigest.com/how-to/all-new-nook-is-now-shipping/" title="Post: <b> All-New Nook is now shipping</b>" ><b> All-New Nook is now shipping</b></a></li><li><a href="http://www.coredigest.com/how-to/google-1-button-for-websites-like-facebook/" title="Post: <strong> Google +1 Button for websites like facebook</strong>" ><strong> Google +1 Button for websites like facebook</strong></a></li>
</ul>
</div>
</li>
<li id='popular-posts'><a href="javascript:;" class="top-posts">Popular posts</a>
<div class="subpanel largesubpanel">
<h3><span> – </span> Popular posts</h3>
<ul>
<li><a href="http://www.coredigest.com/tools/publish-the-same-blog-post-to-multiple-blogging-sites-at-once/" title="Post: Publish the Same Blog Post to Multiple Blogging Sites at Once (13 comments)">Publish the Same Blog Post to Multiple Blogging Sites at Once</a></li><li><a href="http://www.coredigest.com/how-to/how-to-enable-google-maps-navigation-outside-usa/" title="Post: How to Enable Google Maps Navigation Outside USA (11 comments)">How to Enable Google Maps Navigation Outside USA</a></li><li><a href="http://www.coredigest.com/yahoo/yahoo-messenger-invisible-checker-detector/" title="Post: Yahoo Messenger Invisible Checker Detector (7 comments)">Yahoo Messenger Invisible Checker Detector</a></li><li><a href="http://www.coredigest.com/how-to/chikka-messenger-to-send-free-sms-text-messages/" title="Post: Chikka Messenger to Send Free SMS Text Messages (6 comments)">Chikka Messenger to Send Free SMS Text Messages</a></li><li><a href="http://www.coredigest.com/yahoo/yahoo-invisible-detector-php-code/" title="Post: yahoo invisible detector PHP Code (6 comments)">yahoo invisible detector PHP Code</a></li>
</ul>
</div>
</li>
<li id='latest-comments'><a href="javascript:;" class="recent-comments">Comments</a>
<div class="subpanel largesubpanel">
<h3><span> – </span> latest comments</h3>
<ul>
<li><a href="http://www.coredigest.com/how-to/chikka-messenger-to-send-free-sms-text-messages/#comment-24584" title=" jovelyn enriquez in Chikka Messenger to Send Free SMS Text Messages">jovelyn enriqu... in Chikka Messenger to Send Free...</a></li>
<li><a href="http://www.coredigest.com/how-to/chikka-messenger-to-send-free-sms-text-messages/#comment-24583" title=" jovelyn enriquez in Chikka Messenger to Send Free SMS Text Messages">jovelyn enriqu... in Chikka Messenger to Send Free...</a></li>
<li><a href="http://www.coredigest.com/yahoo/ymsg16-protocol-login-and-send-message/#comment-22640" title=" Farbod Farhour in YMSG16 Protocol - Login and Send Message">Farbod Farhour in YMSG16 Protocol - Login and S...</a></li>
<li><a href="http://www.coredigest.com/yahoo/yahoo-invisible-detector-php-code/#comment-22639" title=" Farbod Farhour in yahoo invisible detector PHP Code">Farbod Farhour in yahoo invisible detector PHP ...</a></li>
<li><a href="http://www.coredigest.com/google/find-invisible-users-in-gmail/#comment-22400" title=" Marina in Find Invisible Users In Gmail ">Marina in Find Invisible Users In Gmail...</a></li>
</ul>
</div>
</li>
<li><a href='javascript:;' onClick="location.href='http://www.coredigest.com/?p=415'" class="random-post">Random post</a></li>
<li id='bbtop'><a title='Top' id='bb_toTop' style='display: block;'> </a></li>
<li id='share'><a href="javascript:;" class="share">Share</a>
<div class="subpanel">
<h3><span> – </span> Share</h3>
<ul><li><a href='http://delicious.com/save?url=http://www.coredigest.com/technology/everything-you-need-to-know-about-html5/&title=Everything+you+need+to+know+about+HTML5' class='delicious hover'>Share to Delicious</a></li><li><a href='http://digg.com/submit?phase=2&url=http://www.coredigest.com/technology/everything-you-need-to-know-about-html5/&title=Everything+you+need+to+know+about+HTML5' class='digg hover'>Share to Digg</a></li><li><a href='http://edno23.com/pf:open/?loadlink=http://www.coredigest.com/technology/everything-you-need-to-know-about-html5/&loadtext=Everything+you+need+to+know+about+HTML5' class='edno23 hover'>Share to Edno23</a></li><li><a href='http://facebook.com/sharer.php?u=http://www.coredigest.com/technology/everything-you-need-to-know-about-html5/&t=Everything+you+need+to+know+about+HTML5' class='facebook hover'>Share to Facebook</a></li><li><a href='http://google.com/bookmarks/mark?op=add&bkmk=http://www.coredigest.com/technology/everything-you-need-to-know-about-html5/&title=Everything+you+need+to+know+about+HTML5' class='google-bookmarks hover'>Share to Google Bookmarks</a></li><li><a href='http://www.google.com/buzz/post?url=http://www.coredigest.com/technology/everything-you-need-to-know-about-html5/&title=Everything+you+need+to+know+about+HTML5' class='google-buzz hover'>Share to Google Buzz</a></li><li><a href='http://svejo.net/story/submit_by_url?url=http://www.coredigest.com/technology/everything-you-need-to-know-about-html5/&title=Everything+you+need+to+know+about+HTML5' class='svejo hover'>Share to Svejo</a></li><li><a href='http://twitter.com/home?status=Everything+you+need+to+know+about+HTML5 - http://www.coredigest.com/technology/everything-you-need-to-know-about-html5/' class='twitter hover'>Share to Twitter</a></li></ul></div></li></ul></div> <!-- Start of StatCounter Code -->
<script type="text/javascript">
<!--
var sc_project=5194753;
var sc_security="455a9a24";
var sc_invisible=1;
//-->
</script>
<script type="text/javascript" src="http://www.statcounter.com/counter/counter_xhtml.js"></script>
<noscript><div class="statcounter"><a title="web analytics" href="http://statcounter.com/"><img class="statcounter" src="http://c.statcounter.com/5194753/0/455a9a24/1/" alt="web analytics" /></a></div></noscript>
<!-- End of StatCounter Code -->
<div style="clear:both;"></div>
<div id="tga_dropmenu" class="dpmAp" onmouseover="clearhidemenu()" onmouseout="delayhidemenu()" style="left: 0px; top: 0px; visibility: hidden;">
<div id="tga_dpmtap" style="background:transparent url(http://www.coredigest.com/wp-content/plugins/tagally-for-wp/img/ftap.gif) no-repeat scroll 0px 0px;width:262px;height:16px"></div>
<div class="dpms0" id="tga_dpms_0" style="background-color:#FFF;border-bottom:#898C95 1px solid;border-left:#898C95 1px solid;border-right:#898C95 1px solid;font-size:12px;margin:0px;width:260px;z-index:9999">
<form onsubmit="" action="" method="post" target="_blank">
<div class="dpms1">
<span style="border-bottom:#020509 1px solid;color:#000040;font-size:10px;font-weight:bold;text-align:left">Tag : </span>
<a id="tga_tNY6IO" target='_blank' href="#" style="color:#E10000;font-weight:700">tag</a><br/>
<a id="tga_tNYIMU" href="http://www.tagally.com/main/addfavorite?tags="><img id="addlist" width="124" height="17" src="http://www.coredigest.com/wp-content/plugins/tagally-for-wp/img/addto.gif" style="padding:2px 0px 0px 0px;margin-top:2px;background:none;border-color:#FFF;border-style:none;border-width:0px;" alt="add this tag to your favorites in TagALLY.com"/></a>
</div>
<div class="dpms3">
<div class="dphd">
<ul class="dphd_title" id="tga_dphdtitle">
<li><a id="tga_tgda1" class="tgdac_2" href="javascript:void(0)" onmouseover="delaydphdq(0)" onmouseout="cleardelaydphdq();">all blogs</a></li>
<li><a id="tga_tgda2" class="tgdac_1" href="javascript:void(0)" onmouseover="delaydphdq(1)" onmouseout="cleardelaydphdq();">this blog</a></li>
</ul>
<div style='height:2px;width:250px;background-color:#9cf;margin:0px;overflow:hidden'></div>
<div>
<span style="border-bottom:#020509 1px solid;color:#000040;font-size:10px;font-weight:bold;text-align:left">Latest : </span>
<span id="tga_lart1" style="display:none;padding-left:3px"><a style="font-size:11px;color:#0033CC;" href="" target="_blank"></a></span>
<span id="tga_lart2" style="display:none;padding-left:3px"><a style="font-size:11px;color:#0033CC;" href="" target="_blank"></a></span>
</div>
<span style="border-bottom:#020509 1px solid;color:#000040;font-size:10px;font-weight:bold;text-align:left">Top Hot : </span>
<div class="dphd_con" id="tga_tdpcon1" style="display:none;"></div>
<div class="dphd_con" id="tga_tdpcon2" style="display:none;"></div>
</div>
</div>
<div id="tga_liDv" style="border:0px;margin:3px 115px 10px;"><img style="max-width:none;background:none;border:0px none #FFFFFF;padding:0px;margin:0px" width="33" height="33" src="http://www.coredigest.com/wp-content/plugins/tagally-for-wp/img/31.gif"/></div>
<div class="dpmsfoot" style="width:248px;background-color:#9cf;color:#333;font-size:9px;margin:10px 1px 1px;padding:5px;text-align:right">
<a style="color:#000040;background-color:#9cf" target='_blank' href="http://www.tagally.com">Powered by TagALLY.com</a>
</div>
</form>
</div>
</div>
<script type="text/javascript">
var sub = document.getElementById('submit');
document.getElementById('recaptcha-submit-btn-area').appendChild (sub);
document.getElementById('submit').tabIndex = 6;
if ( typeof _recaptcha_wordpress_savedcomment != 'undefined') {
document.getElementById('comment').value = _recaptcha_wordpress_savedcomment;
}
document.getElementById('recaptcha_table').style.direction = 'ltr';
</script>
</body>
</html>