Cách tạo bài đăng chuẩn HTML5 cho blogspot

Nối tiếp bài viết cách tạo blog chuẩn W3C HTML5 thì bài viết này sẻ giúp bạn cách đăng bài tránh bị lỗi mà hoàn toàn Valid HTML 5.
Cách tạo bài đăng chuẩn HTML5 cho blogspot

Một số lỗi bạn gặp phải thường do đăng ảnh, hoặc tạo bảng như:
"Attribute imageanchor not allowed on element a at this point", "The border attribute is obsolete. Consider specifying img { border: 0; } in CSS instead" hoặc 'An img element must have an alt attribute, except under certain conditions. For details, consult guidance on providing text alternatives for images"...

Cách đăng bài chuẩn HTML5


Lời khuyên là các bạn nên đăng bài ở chế độ HTML thay vì dạng viết dạng text theo thông thường. hoặc nếu bạn không quen thì có thể chuyển đổi qua lại làm sao cho thuận tiện nhất là được.

Lỗi khi up ảnh lên bài viết


Đây là lỗi thường gặp nhất nếu bạn không để ý thì khi check blog trên http://validator.w3.org/ sẻ hiển thị lỗi ngay, ảnh thiếu alt cũng là lỗi thường gặp nó vừa bị lỗi và vừa không tối ưu với công cụ tìm kiếm.

Cách tạo bài đăng chuẩn HTML5 cho blogspot

Khi đăng ảnh bạn cần xóa mã sau: border="0"imageanchor="1" và nhớ thêm thẻ alt để bài đăng được chuẩn HTML5

Cách tạo bài đăng chuẩn HTML5 cho blogspot

Một số lỗi trong template...


Một số lỗi thường gặp như: "The allowtransparency attribute on the iframe element is obsolete. Use CSS instead" , "The frameborder attribute on the iframe element is obsolete. Use CSS instead", "Duplicate ID post-timestamp-for-related.", "Bad value for attribute src on element iframe: Must be non-empty"...

Để fix các lỗi này bạn vào template tìm đoạn code sau:

<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' scrolling='no' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>

và xóa tất cả các mã như bên dưới đi:

- allowtransparency='true'
- frameborder='0'
- src=''
- scrolling='no'
- width='100%'
- style='display: none'

Tiếp tục tìm đoan code sau:

<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>

Thay thế bằng mã sau:

<b:if cond='data:blog.pageType == &quot;static_page&quot;'> <a expr:href='&quot;http://www.blogger.com/comment-iframe.g?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;pageID=&quot; + data:post.id' id='comment-editor-src'/> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'> <a expr:href='&quot;http://www.blogger.com/comment-iframe.g?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;postID=&quot; + data:post.id' id='comment-editor-src'/> </b:if>

Với một vài lời khuyên trên hy vọng sẻ giúp bạn tạo bài đăng chuẩn HTML5 cho blogspot!
Donate MoMo: 035.45.48.599
Bài đăng mới hơn Bài đăng mới hơn Bài đăng cũ hơn Bài đăng cũ hơn

Bài đăng khác

21 nhận xét

Khi Comment hãy click vào "Thông báo cho tôi" để theo dõi phản hồi mới nhất từ admin
  1. mình viết bài xong check http://validator.w3.org/
    link : http://validator.w3.org/check?uri=http%3A%2F%2Fwww.tuanphan.info%2F2014%2F06%2Fhoc-nhanh-cac-phim-tat-trong-windows.html&charset=%28detect+automatically%29&doctype=Inline&group=0
    nó báo lỗi này là sao ta:Error Line 1914, Column 52: Bad value for attribute src on element script: Must be non-empty.
    <script async='async' src='' type='text/javascript'></script>

    Trả lờiXóa
    Trả lời
    1. Bác coi remove cái đoạn <script async='async' src='' type='text/javascript'></script>
      đoạn mã đồng bộ này rỗng nên nó báo lỗi thế đấy, còn lỗi 1 để mình xem lại thử chứ chưa biết sao nữa

      Xóa
  2. ok mình đả xóa đoạn này <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/> không biết có ảnh hưởng gì không

    Trả lờiXóa
    Trả lời
    1. Để an toàn hơn bạn tìm đến đoạn code này <b:include data='post' name='threaded_comment_js'/> và thêm vào trên nó đoạn mã sau:
      <script type='text/javascript'>
      //<![CDATA[
      if (typeof(jQuery) == 'undefined') {
      //output the script (load it from google api)
      document.write("<scr" + "ipt type=\"text/javascript\" src=\"http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js\"></scr" + "ipt>");
      }
      //]]>
      </script>
      <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>
      <script type='text/javascript'>
      <b:if cond='data:post.numComments != 0'>
      var Items = <data:post.commentJso/>;
      var Msgs = <data:post.commentMsgs/>;
      var Config = <data:post.commentConfig/>;
      <b:else/>
      var Items = {};
      var Msgs = {};
      var Config = {&#39;maxThreadDepth&#39;:&#39;0&#39;};
      </

      Nhớ để đoạn code bạn xóa lúc nảy vào nhé

      Xóa
  3. Nhận xét này đã bị tác giả xóa.

    Trả lờiXóa
    Trả lời
    1. à lỗi này do bài viết không có nhận xét nên nó báo vậy mà

      Xóa
  4. à bạn fix lỗi webmaster tools mình hộ cái
    Lỗi: The name of reviewed item is not supplied by "item" field.
    link:
    https://www.google.com/webmasters/tools/richsnippets?q=http%3A%2F%2Fwww.tuanphan.info%2F2014%2F06%2Fnguoi-bi-tap-13-phuong-vy-john-huy-tran.html

    Trả lờiXóa
    Trả lời
    1. Không chắc lắm nhưng bạn thử tìm đoạn code sau: <span itemprop='reviewer'> và thay bằng <span itemscope="" itemtype='reviewer'> thử xem

      Xóa
    2. Nếu vẫn lỗi thì thay bằng đoạn này <span itemscope='' itemtype='http://data-vocabulary.org/Review-aggregate'> chắc oki

      Xóa
    3. Fix hết lỗi bên webmaster tool thì bị lỗi HTML5

      Xóa
    4. Dùng cái này <span itemscope='' itemtype='http://data-vocabulary.org/Review-aggregate'> thì ok cả hai, cám ơn bạn nhiều

      Xóa
    5. mình thay đoạn này củng ok nè
      <span itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>

      Xóa
  5. à trong flie tùy chọn tìm kiếm mình cài thế này cò chính xác chưa bạn
    http://4.bp.blogspot.com/-U9jhQrn3ARg/U69v0oH_iJI/AAAAAAAAGxU/oA8QToP7MBs/s320/Blogger++Tuan+Phan+Blog+-+T%C3%B9y+ch%E1%BB%8Dn+t%C3%ACm+ki%E1%BA%BFm+(1).png

    Trả lờiXóa
  6. hơi ngoài lề chút, làm sao tạo dc 1 page giới thiệu dạng http://www.tips24h.net/p/contact.html như này dc nhỉ?

    Trả lờiXóa
    Trả lời
    1. Bạn vào bảng điều khiển chọn "Trang" rồi chọn "Trang mới" rồi viết những gì bạn cần rồi xuất bản thôi
      Hoặc bạn tìm trên google "cách tạo trang tĩnh cho blogger"

      Xóa
  7. blog của em nó báo lỗi thiếu alt cho hình ảnh khi sử dụng seoquaketer rất la nhiều, mặc dù trong bài viết em ko thiếu alt nào, có phải là do trong Hình ảnh hiển thị ở label, reated post không anh, cách sửa như thế nào hả anh

    Trả lờiXóa
    Trả lời
    1. Blog bác là gì nhỉ, bác sử dụng mấy công cụ sau để check và tìm tới ảnh nào thiếu thẻ alt thì thêm vào thôi.
      add-on seo doctor trên firefox
      chkme.com là trang web check seo
      mình thường dùng 2 thằng này để check...bạn thử đi có gì pm lại mình giúp

      Xóa
  8. http://validator.w3.org/check?uri=http%3A%2F%2Fwww.toilaquantri.com%2F&charset=%28detect+automatically%29&doctype=Inline&group=0&user-agent=W3C_Validator%2F1.3+http%3A%2F%2Fvalidator.w3.org%2Fservices

    a kiểm tra và hd e sửa vài lỗi html5 chứ tem e còn nhiều lỗi quá mà đã đọc hết bài rồi

    Trả lờiXóa
  9. Nhận xét này đã bị tác giả xóa.

    Trả lờiXóa