Đây là bài viết thứ 2 trong loạt bài Tối ưu SEO Onpage xử lý với nền tảng Blogger.
Bài viết #2 này sẽ hướng dẫn các bạn tối ưu cấu trúc HTML5 cho blogger/website của bạn.
Website chuẩn HTML5 cũng là một trong những tiêu chí SEO hàng đầu mà mình đưa ra. Các cấu trúc lập trình mới như CSS3 và HTML5 có nhiều cải tiến mới, các ngôn ngữ lập trình mới đưa ra hỗ trợ nhiều lệnh hơn hơn nữa là trình duyệt sẽ đọc code chuẩn mới này nhanh chóng nhờ đó tăng tốc độ load website.
 |
| Sửa lỗi HTML5 cho blogger |
Đầu tiên bạn cần tìm hiểu thuật ngữ SEO là gì
Kiểm tra chuẩn HTML5 cho website
Kiểm tra sơ qua Tôi Là Quản Trị Blog’s
 |
| Sửa lỗi HTML5 |
1. Tối ưu cho các file .CSS nhúng link từ bên ngoài
<link href=‘http://abc.xyz/mnx.CSS‘ rel=’stylesheet’ type=’text/css’/>
<script type=’text/javascript’>
//<![CDATA[
//CSS Ready
function loadCSS(e, t, n) { “use strict”; var i = window.document.createElement(“link”); var o = t || window.document.getElementsByTagName(“script”)[0]; i.rel = “stylesheet”; i.href = e; i.media = “only x”; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || “all” }) }
loadCSS(“http://abc.xyz/mnx.CSS“);
//]]>
</script>
Lưu mẫu lại và kiểm tra HTML5 lại sẽ mất các lỗi từ file này
2. Sửa lỗi HTML5 tại logo
Khi blog của bạn sử dụng Logo và check với công cụ kiểm tra HTML5 bạn sẽ thấy phát hiện lỗi HTML5 tại logo và đây là cách khắc phục để đạt chuẩn HTML5 tại logo
Tìm đoạn code sau:
<img expr:alt=’data:title’ expr:height=’data:height’ expr:id=’data:widget.instanceId + "_headerimg"’ expr:src=’data:sourceUrl’ expr:width=’data:width’ style=’display: block’/>
Và thay thế bằng
<b:if cond=’data:blog.pageType == "index"’>
<h1 itemprop=’name’>
<a expr:href=’data:blog.homepageUrl’ itemprop=’url’>
<img expr:alt=’data:title’ expr:id=’data:widget.instanceId + "_headerimg"’ expr:src=’data:sourceUrl’ expr:style=’"height:" + data:height + "width:" + data:width + "display: block"’/><span style=’display: none;’><data:blog.title/></span></a></h1>
<b:else/>
<h3 itemprop=’name’>
<a expr:href=’data:blog.homepageUrl’ itemprop=’url’>
<img expr:alt=’data:title’ expr:id=’data:widget.instanceId + "_headerimg"’ expr:src=’data:sourceUrl’ expr:style=’"height:" + data:height + "width:" + data:width + "display: block"’/><span style=’display: none;’><data:blog.title/></span></a></h3>
</b:if>
Đoạn code thay thế mình đã sử dụng điều kiện nếu là ở trang chủ thì tên Blog sẽ khai báo là thẻ H1 và vào bài viết thì tên Blog sẽ chuyển thành thẻ H3. Nên các bạn cố gắng tìm các thẻ <b:if> …. </b:if> bao đoạn code tô đỏ để thay thế toàn diện.
3. Fix lỗi HTML5 phiên bản ver2
 |
| Xóa các khai báo trong đầu blog |
<html b:version=’2′ class=’v2′ lang=’vi’ 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’>
Khi kiểm tra HTML5 bạn sẽ thấy 7-8 lỗi từ đoạn code này vì vậy cách sửa là bạn xóa và giữ lại đoạn code sau
<html b:version=’2′ class=’v2′ lang=’vi’>
Mỗi lần truy cập vào mẫu đoạn code đầu lại xuất hiện, do đó bạn phải luôn xóa nó đi mỗi lần lưu template lại
4. Sửa lỗi liên quan tới ảnh
 |
| Sửa lỗi ảnh thiếu thẻ Alt |
DienDan.Edu.Vn Cám ơn bạn đã quan tâm và rất vui vì bài viết đã đem lại thông tin hữu ích cho bạn.DienDan.Edu.Vn! là một website với tiêu chí chia sẻ thông tin,... Bạn có thể nhận xét, bổ sung hay yêu cầu hướng dẫn liên quan đến bài viết. Vậy nên đề nghị các bạn cũng không quảng cáo trong comment này ngoại trừ trong chính phần tên của bạn.Cám ơn.
