HTML là gì? Hướng dẫn HTML cơ bản cho người mới bắt đầu

HTML là nền tảng của mọi trang web. Nếu bạn đang tìm hiểu lập trình web, đây là điều cần biết ngay: HTML không phải ngôn ngữ lập trình, không cần cài đặt gì cả, và bạn có thể tạo trang web đầu tiên chỉ trong 30 phút.

HTML là gì?

Định nghĩa HTML đơn giản

HTML là viết tắt của HyperText Markup Language — Ngôn ngữ đánh dấu siêu văn bản.

Điều quan trọng cần nhớ: HTML không phải ngôn ngữ lập trình. HTML là "ngôn ngữ đánh dấu" — dùng để xây dựng cấu trúc của trang web, chứ không có logic hay điều kiện như Python hay JavaScript.

Hãy hình dung HTML như bộ khung xương của một ngôi nhà: quyết định tường ở đâu, cửa ở đâu, cửa sổ ở đâu. CSS lo phần sơn màu và trang trí nội thất, JavaScript phụ trách hệ thống điện và nước.

HTML hoạt động như thế nào?

Khi bạn truy cập một trang web, trình tự diễn ra như sau:

Bạn nhập URL vào trình duyệt (Chrome, Firefox...)
Trình duyệt gửi yêu cầu đến server
Server trả về file HTML
Trình duyệt đọc HTML và hiển thị thành trang web trên màn hình

Nói cách khác, mọi website bạn thấy hằng ngày đều được trình duyệt "dịch" từ code HTML thành giao diện trực quan.

Bộ ba HTML – CSS – JavaScript:

HTML — Cấu trúc (khung xương): tiêu đề, đoạn văn, hình ảnh
CSS — Giao diện (nội thất): màu sắc, font chữ, bố cục
JavaScript — Hành vi (điện nước): click, animation, xử lý form

Tại sao cần học HTML?

HTML là nền tảng của mọi trang web

Mọi website trên thế giới — Google, Facebook, YouTube, Shopee — đều được xây dựng trên HTML. Muốn học lập trình web, HTML là bước đầu tiên không thể bỏ qua.

Dễ học và mở ra cơ hội nghề nghiệp

HTML là công nghệ lý tưởng để bắt đầu, vì:

Cú pháp đơn giản: tên thẻ là tiếng Anh dễ nhớ (<p> = paragraph, <h1> = heading 1)
Thấy kết quả ngay: viết code xong, mở trình duyệt là thấy liền
Nhu cầu cao: Frontend Developer là một trong những vị trí tuyển dụng nhiều nhất tại Việt Nam năm 2026

Cấu trúc cơ bản của một file HTML

Mọi file HTML đều có một "bộ khung" cố định. Chỉ cần nhớ bộ khung này, rồi thêm nội dung vào bên trong:

<!DOCTYPE html>
<html lang="vi">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tiêu đề trang web</title>
</head>
<body>
    <h1>Xin chào Việt Nam!</h1>
    <p>Đây là trang web đầu tiên của tôi.</p>
</body>
</html>

Giải thích từng phần:

<!DOCTYPE html> — Khai báo với trình duyệt: "Đây là tài liệu HTML5"
<html lang="vi"> — Mở tài liệu HTML; lang="vi" xác định ngôn ngữ tiếng Việt
<head> — Phần "hậu trường": tiêu đề, mã ký tự, thông tin meta
<meta charset="UTF-8"> — Bắt buộc để hiển thị đúng tiếng Việt có dấu
<title> — Tiêu đề hiển thị trên tab trình duyệt
<body> — Phần nội dung người dùng nhìn thấy trên màn hình

Các thẻ HTML cơ bản nhất

Trong HTML, bạn dùng "thẻ" (tag) để xác định loại nội dung. Mỗi thẻ có dạng <mở> và </đóng>.

Thẻ tiêu đề (h1 – h6)

<h1>Tiêu đề lớn nhất (dùng 1 lần mỗi trang)</h1>
<h2>Tiêu đề cấp 2</h2>
<h3>Tiêu đề cấp 3</h3>
<h4>Tiêu đề cấp 4</h4>

<h1> là tiêu đề quan trọng nhất — chỉ dùng 1 lần mỗi trang. Các thẻ <h2> trở đi có thể dùng nhiều lần.

Thẻ đoạn văn và xuống dòng

<p>Đây là một đoạn văn bản. Trình duyệt tự xuống dòng khi hết chiều rộng.</p>
<p>Đây là đoạn văn thứ hai. Mỗi thẻ p tạo một đoạn văn mới.</p>

<p>Dòng thứ nhất<br>Dòng thứ hai</p>

Thẻ liên kết và hình ảnh

<a href="https://google.com">Truy cập Google</a>

<img src="hinh-anh.jpg" alt="Mô tả hình ảnh cho người khiếm thị">

Thuộc tính alt mô tả hình ảnh cho người khiếm thị và cải thiện SEO — đừng bỏ qua.

Thẻ danh sách

<ul>
    <li>HTML - Cấu trúc trang web</li>
    <li>CSS - Giao diện trang web</li>
    <li>JavaScript - Tương tác trang web</li>
</ul>

<ol>
    <li>Học HTML trước</li>
    <li>Sau đó học CSS</li>
    <li>Cuối cùng học JavaScript</li>
</ol>

Muốn tìm hiểu đầy đủ hơn về các thẻ HTML? Xem bài viết Các thẻ HTML cơ bản cần biết.

Thực hành: Tạo trang HTML đầu tiên

Lý thuyết thôi chưa đủ — hãy thực hành ngay!

Bước 1 — Tạo file HTML

Mở VS Code (trình soạn thảo code miễn phí)
Tạo file mới
Lưu với tên gioi-thieu.html

Bước 2 — Viết code HTML

Copy đoạn code dưới đây và dán vào file:

<!DOCTYPE html>
<html lang="vi">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Giới thiệu bản thân</title>
</head>
<body>
    <h1>Xin chào! Tôi là Minh</h1>
    <p>Tôi là sinh viên năm 2, đang học ngành Công nghệ Thông tin tại TP.HCM.</p>

    <h2>Kỹ năng của tôi</h2>
    <ul>
        <li>HTML cơ bản</li>
        <li>Đang học CSS</li>
        <li>Sắp học JavaScript</li>
    </ul>

    <h2>Mục tiêu năm 2026</h2>
    <ol>
        <li>Hoàn thành lộ trình Frontend</li>
        <li>Xây dựng portfolio cá nhân</li>
        <li>Tìm thực tập Frontend Developer</li>
    </ol>

    <h2>Liên hệ</h2>
    <p>Email: <a href="mailto:minh@example.com">minh@example.com</a></p>
    <p>GitHub: <a href="https://github.com/minh">github.com/minh</a></p>
</body>
</html>

Bước 3 — Mở trên trình duyệt

Nhấn đúp vào file gioi-thieu.html để mở bằng trình duyệt. Trang web đầu tiên của bạn sẽ hiện ra ngay lập tức.

Chúc mừng! Bạn vừa tạo thành công trang HTML đầu tiên.

HTML5 là gì? Có gì mới?

HTML5 là phiên bản hiện đại của HTML, ra mắt chính thức năm 2014. Tính đến 2026, HTML được duy trì dưới dạng HTML Living Standard bởi tổ chức WHATWG — được cập nhật liên tục thay vì ra phiên bản mới định kỳ.

Những tính năng nổi bật của HTML5:

Thẻ semantic: <header>, <nav>, <main>, <article>, <section>, <footer> — giúp cấu trúc trang rõ ràng hơn cho cả người đọc lẫn máy tìm kiếm
Multimedia: <video>, <audio> — nhúng video và âm thanh trực tiếp, không cần plugin
Form nâng cao: <input type="email">, <input type="date"> — xác thực dữ liệu tự động ngay trên trình duyệt

Google ưu tiên các trang dùng thẻ semantic HTML đúng cách trong kết quả tìm kiếm — vì vậy học đúng từ đầu rất quan trọng.

Công cụ viết HTML tốt nhất cho người mới

VS Code (khuyến nghị)

Visual Studio Code là trình soạn thảo code miễn phí của Microsoft. VS Code hỗ trợ tự động hoàn thành HTML, tô màu cú pháp và xem trước trực tiếp — rất phù hợp khi mới bắt đầu.

Công cụ online

CodePen.io — viết HTML/CSS/JS trên trình duyệt, thấy kết quả ngay tức thì
JSFiddle — viết và chia sẻ code dễ dàng

Câu hỏi thường gặp

HTML có phải là ngôn ngữ lập trình không?
Không. HTML là ngôn ngữ đánh dấu (markup language). Nó không có logic như vòng lặp hay điều kiện giống Python hay JavaScript.

Chỉ học HTML thôi có làm được website không?
Được, nhưng chỉ có cấu trúc đơn giản. Muốn trang web đẹp thì cần CSS, muốn có tương tác thì cần JavaScript.

Học HTML mất bao lâu?
Nắm vững các thẻ cơ bản chỉ mất 1–2 tuần nếu luyện tập đều đặn mỗi ngày.

Học HTML có tốn tiền không?
Không. VS Code miễn phí, trình duyệt miễn phí, và có rất nhiều tài liệu học miễn phí trên mạng.

Bước tiếp theo — Học gì sau HTML?

Học CSS — thêm màu sắc, font chữ, bố cục cho trang web → CSS là gì? Cách tạo style cho trang web
Tìm hiểu thêm về HTML — bảng, form, thẻ semantic → Các thẻ HTML cơ bản cần biết
Học CSS layout — xây dựng bố cục hiện đại với Flexbox → Flexbox CSS: Hướng dẫn căn chỉnh layout

HTML là bước đầu tiên trong hành trình lập trình web. Hãy xây dựng nền tảng vững chắc trước khi tiến sang kỹ năng tiếp theo!