How to Create a Blog 100% Valid HTML5

Here I will give a tutorial that has been widely discussed by other blogs, but if the name is not a tutorial plus standard tutorial article, so here I will give you that plus of course, okay back to topic, I think the advantages of HTML5 is more validation, fast, sophisticated and of course follow the progress of time. This HTML5 course there are differences among them than HTML4, HTML5 has new tags are:

<header>, <article>, <footer> and many more, but this is no tag in HTML5 minus one <center> tag, but we can swap the calm center without the tag that with css.

Previously please check without first validation error number to your blog, remember the purpose of this article is to provide a tutorial for your blog that is valid html5 0 Error and 1 Warning.

1. Replace the code:

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

<head> 


with this code:

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE html>

<HTML>

<head>

<meta charset='utf-8'/> 

2. Replace the code:
</html> 

with this code:

</HTML> 

3. Remove html code below:
<div class='post-share-buttons goog-inline-block'>

other code

</div>
 
------------------------------------------------------------------------------------------
 
 
<b:includable id='postQuickEdit' var='post'>

<b:if cond='data:post.editUrl'>

<span expr:class='&quot;item-control &quot; + data:post.adminClass'>

<a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>

<img alt='' class='icon-action' height='18' src='http://img2.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>

</a>

</span>

</b:if>

</b:includable> 


-------------------------------------------------------------------------------------------

<b:include name='quickedit'/>
 
-------------------------------------------------------------------------------------------
 
<b:include data='blog' name='all-head-content'/>
------------------------------------------------------------------------------------------- 

4. Avoid Tag <center> because HTML 5 does not support 5. Remove widget below (if any):
Google+ Followers
follower
Share Button
Statistics (counter number of visitors)

5. Consider the following:
Add alt tags in each tag <img>
Eliminate imageanchor code in img tag.
Remove border on the img tag code.

Okay, hopefully useful. if still confused, please comment..

0 comments:

Post a Comment