Cách thêm bài viết (article) trong HTML5?

Thẻ <article> (HTML5) đại diện cho một tác phẩm độc lập, tự chứa: bài blog, bài báo, bài diễn đàn, comment, widget... Có thể phân phối, tái sử dụng độc lập.

Ví dụ

<!DOCTYPE html>
<html>
  <head>
    <title>Thẻ Article HTML</title>
  </head>
  <body>
    <article>
      <h2>PHP</h2>
      <p>PHP là PHP Hypertext Preprocessor</p>
    </article>
  </body>
</html>

Đặc điểm

• Nội dung tự chứa: có nghĩa đầy đủ khi tách ra.
• Thường có <header> (tiêu đề, tác giả, ngày), <footer> (tag, chia sẻ), <section> con.
• Có thể lồng nhau: comment trong bài viết (article lồng article).
• SEO: Google hiểu cấu trúc nội dung chính.

Ví dụ đầy đủ

<article>
  <header>
    <h1>Tiêu đề bài viết</h1>
    <p>Tác giả: Nguyễn Văn A | Ngày: 2024-01-15</p>
  </header>
  <section>
    <h2>Mở đầu</h2>
    <p>Nội dung...</p>
  </section>
  <section>
    <h2>Chi tiết</h2>
    <p>Nội dung...</p>
  </section>
  <footer>
    <p>Tag: <a href="#">HTML</a>, <a href="#">Semantic</a></p>
  </footer>
</article>

Phân biệt <article> vs <section> vs <div>

• <article>: Tự chứa, có thể syndicate (RSS, republish).
• <section>: Nhóm nội dung liên quan theo chủ đề, không tự chứa.
• <div>: Container thuần túy, không ngữ nghĩa.