Hướng dẫn tạo blog chuẩn W3C HTML5

Blog chuẩn W3C HTML5 đang là xu hướng trong năm nay 2015, hầu hết các template blogger mới đều được thiết kế chuẩn W3C HTML5. Với sự đi lên của công nghệ, blog cũng phải nâng cấp để phù hợp với xu thế hiện tại.

KIỂM TRA W3C

- Kiểm tra blog chuẩn HTML5 tại trang: http://validator.w3.org/
- Kiểm tra blog chuẩn CSS3 tại trang: http://jigsaw.w3.org/css-validator/

CHỈNH SỬA TEMPLATE CHUẨN W3C

 Bước 1: Xóa hết các thẻ trên <head> và để lại như sau:

<?xml version="1.0" encoding="UTF-8" ?> 
<!DOCTYPE html> 
<HTML> 
Chuyển mã </html> thành </HTML>

 Bước 2: Thay thế mã sau:

<b:include data='blog' name='all-head-content'/>
thành 
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/> 
<meta content='blogger' name='generator'/> 
<link expr:href='data:blog.homepageUrl + &quot;favicon.ico&quot;' rel='icon' type='image/x-icon'/> 
<link expr:href='data:blog.url' rel='canonical'/> 
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/> 
<link expr:href='data:blog.homepageUrl + &quot;feeds/posts/default?alt=rss&quot;' expr:title='data:blog.title + &quot; - RSS&quot;' rel='alternate' type='application/rss+xml'/> 
<link expr:href='&quot;http://www.blogger.com/feeds/&quot; + data:blog.blogId + &quot;/posts/default&quot;' expr:title='data:blog.title + &quot; - Atom&quot;' rel='alternate' type='application/atom+xml'/> 
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/> 
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/> 
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<b:if cond='data:blog.postImageThumbnailUrl'> 
<link expr:href='data:blog.postImageThumbnailUrl' rel='image_src'/> 
</b:if> 
<b:if cond='data:blog.metaDescription != &quot;&quot;'> 
<meta expr:content='data:blog.metaDescription' name='description'/> 
<b:else/> 
<meta expr:content='data:blog.pageName + &quot; - &quot; + data:blog.title' name='description'/> 
</b:if> 
</b:if>

 Bước 3: Thay thế mã <b:skin><![CDATA[ thành

<link href='//www.blogger.com/static/v1/widgets/3950009988-widget_css_bundle.css' rel='stylesheet' type='text/css'/>
&lt;style type=&quot;text/css&quot;&gt; &lt;!-- /*<b:skin><![CDATA[*/]] <style>

 Bước 4: Xóa bỏ các đoạn code sau:

<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>
và 
<a expr:name='data:post.id'/>

Bước 5: Tìm và xóa bỏ tất cả code như sau:

<b:include name='quickedit'/>
- Có thể Ctrl+F và tìm kiếm bằng từ: quickedit

 Bước 6: Thay các kí tự & thành &amp;amp;

THÔNG BÁO BLOG CHUẨN W3C

Blog chuẩn HTML5
Chuẩn HTML5
Blog chuẩn CSS3
Chuẩn CSS3

Nhận xét