Chuyển đến nội dung chính

Định dạng tệp

HTML là gì? Lịch sử, cách phân tích cú pháp và DOM

HTML là ngôn ngữ đánh dấu mô tả cấu trúc của trang web, nằm bên dưới gần như mọi website. Bài viết trình bày lịch sử, cách trình duyệt xử lý HTML và những điều cần lưu ý khi chuyển HTML thành tài liệu.

Tác giả: Hemen Dönüştür Editör EkibiNgày đăng: 10 phút đọc

Nhãn tệp ghi HTML kèm biểu tượng dấu ngoặc nhọn

Gần như mọi thứ bạn thấy trên web, kể cả trang này, đều được viết bằng HTML. HTML (HyperText Markup Language) không phải ngôn ngữ lập trình mà là ngôn ngữ đánh dấu, mô tả cấu trúc của tài liệu: đây là tiêu đề, đây là đoạn văn, đây là liên kết, đây là bảng. Và HTML không chỉ dành cho website. Nó có mặt trong mẫu email, tài liệu trợ giúp, báo cáo xuất ra và các tài liệu "lưu dưới dạng trang web". Bài viết này trình bày lịch sử của HTML, cách trình duyệt đọc và vẽ nó lên màn hình, các lỗi thường gặp, và những điều cần lưu ý khi chuyển tệp HTML sang Word hoặc PDF.

HTML là gì?

HTML là một ngôn ngữ văn bản thuần, đánh dấu nội dung bằng các thẻ (tag). Thẻ được viết trong cặp dấu ngoặc nhọn, và phần lớn tạo thành một phần tử gồm thẻ mở và thẻ đóng:

<!DOCTYPE html>
<html lang="vi">
  <head>
    <meta charset="utf-8">
    <title>Trang mẫu</title>
  </head>
  <body>
    <h1>Xin chào</h1>
    <p>Đoạn văn này chứa một <a href="https://example.com">liên kết</a>.</p>
  </body>
</html>

Phần <head> chứa thông tin về trang (bảng mã ký tự, tiêu đề, bảng định kiểu), còn <body> chứa nội dung hiển thị. Diện mạo được thêm bằng CSS và hành vi bằng JavaScript. Trong cách phân chia đó, HTML mô tả nội dung là gì, CSS mô tả nó trông ra sao và JavaScript mô tả nó làm gì.

Sơ lược lịch sử

HTML ra đời như một phần của dự án World Wide Web mà Tim Berners-Lee đề xuất tại CERN năm 1989. Trình duyệt đầu tiên của ông chạy trên một máy tính NeXT vào năm 1990. Các phiên bản sớm nhất của ngôn ngữ này không hẳn là một tiêu chuẩn chính thức mà là danh sách các thẻ được ghi lại tại CERN. Những cột mốc quan trọng kể từ đó:

  • Tháng 11 năm 1995, HTML 2.0: RFC 1866, do Tim Berners-Lee và Dan Connolly soạn, lần đầu định nghĩa HTML như một tiêu chuẩn chính thức.
  • Tháng 1 năm 1997, HTML 3.2: phiên bản được W3C chính thức thông qua như một đặc tả chung của cả ngành.
  • Ngày 24 tháng 12 năm 1999, HTML 4.01: là đặc tả cốt lõi của web trong nhiều năm; W3C chính thức đánh dấu nó là đã bị thay thế vào ngày 27 tháng 3 năm 2018.
  • Ngày 28 tháng 10 năm 2014, HTML5: W3C công bố HTML5 ở cấp Khuyến nghị (Recommendation). Video, âm thanh, các phần tử phân đoạn ngữ nghĩa và một thuật toán phân tích cú pháp được định nghĩa chính xác đã được chuẩn hóa cùng với nó.
  • Ngày 28 tháng 5 năm 2019, một tiêu chuẩn duy nhất: W3C và WHATWG, cộng đồng do các hãng trình duyệt lập ra, ký một bản ghi nhớ. Theo đó, HTML và DOM chủ yếu được phát triển tại WHATWG dưới dạng một "Living Standard" (tiêu chuẩn sống) không đánh số phiên bản.

Vì vậy, ngày nay "HTML5" thực chất có nghĩa là "HTML hiện hành"; đặc tả chính thức là HTML Living Standard được cập nhật liên tục.

HTML phổ biến đến mức nào? Theo thống kê của W3Techs ngày 15 tháng 10 năm 2026, 97,8% trang web xác định được ngôn ngữ đánh dấu dùng HTML. Cùng nguồn này cho biết 99,1% trang web xác định được bảng mã ký tự dùng UTF-8.

Trình duyệt xử lý HTML như thế nào?

Điều khiến HTML khác các định dạng tài liệu khác là ngay cả tài liệu viết sai cũng được mọi trình duyệt hiểu theo cùng một cách. HTML Living Standard định nghĩa một mô hình phân tích cú pháp chi tiết cho việc này:

  1. Xác định bảng mã: trước tiên trình duyệt phải biến các byte nhận được thành ký tự. Nó lần lượt kiểm tra BOM, bảng mã khai báo trong header HTTP của máy chủ và khai báo <meta charset> trong 1024 byte đầu tiên của tài liệu; nếu không tìm thấy gì, nó sẽ phỏng đoán có cơ sở.
  2. Tách token: một máy trạng thái chia văn bản thành các token như thẻ mở, thẻ đóng, chú thích, DOCTYPE và ký tự.
  3. Dựng cây: các token được xử lý theo các chế độ chèn như "in body" hay "in table". Trình phân tích giữ một ngăn xếp các phần tử đang mở và sửa các thẻ lồng sai theo những quy tắc đã định.
  4. DOM: kết quả là một cây đối tượng gọi là Document Object Model (DOM). CSS được áp dụng lên cây đó, còn JavaScript đọc và thay đổi nó.

Đặc tả nói rõ rằng cách xử lý lỗi phân tích cú pháp đều được định nghĩa chặt chẽ. Ví dụ, nếu viết <div/>, HTML bỏ qua dấu gạch chéo ở cuối, nên các phần tử phía sau sẽ nằm bên trong div đó. Một thẻ <p> chưa đóng sẽ được tự động đóng khi phần tử khối tiếp theo xuất hiện. Sự khoan dung này giúp web vẫn chạy được dù có vô số trang không hoàn hảo, nhưng cũng có nghĩa là bất kỳ công cụ nào chuyển HTML sang định dạng tài liệu đều phải tuân theo đúng những quy tắc đó.

HTML được dùng ở đâu?

  • Website và ứng dụng web: bộ khung của mọi trang web.
  • Email: email có định dạng và bản tin được viết bằng HTML.
  • Tài liệu: trang trợ giúp, tài liệu phần mềm và các trang tạo từ Markdown.
  • Sách điện tử: định dạng EPUB đóng gói nội dung thành các tài liệu XHTML.
  • Báo cáo và dữ liệu xuất: nhiều ứng dụng xuất báo cáo dưới dạng HTML, và kết quả "Lưu dưới dạng trang web" của Word cũng là HTML.

Ưu điểm và nhược điểm

Ưu điểmNhược điểm
Mở được bằng trình duyệt trên mọi thiết bịDiện mạo phụ thuộc vào CSS, phông chữ và hình ảnh bên ngoài
Tiêu chuẩn mở, miễn phí và cập nhật liên tụcYếu ở các khái niệm in ấn như trang và lề
Bố cục linh hoạt, tự thích ứng với kích thước màn hìnhKhó mang đi như một tệp duy nhất (hình ảnh nằm ở tệp riêng)
Cấu trúc ngữ nghĩa cho khả năng tiếp cận và công cụ tìm kiếmCần cẩn trọng khi có chứa JavaScript
Là văn bản thuần nên hợp với quản lý phiên bảnKhông phù hợp bằng PDF để chốt bản cuối cùng

Những chương trình nào mở được HTML?

Mọi trình duyệt, gồm Chrome, Firefox, Safari và Edge, đều hiển thị HTML. Để sửa mã nguồn, một trình soạn thảo mã như Visual Studio Code hay bất kỳ trình soạn thảo văn bản nào cũng đủ. Microsoft Word và LibreOffice Writer có thể mở tệp HTML và sửa chúng như tài liệu, tuy các bố cục CSS phức tạp sẽ bị đơn giản hóa.

Các lỗi thường gặp và cách khắc phục

Ký tự đặc biệt bị lỗi

Bảng mã của trang bị thiếu hoặc sai. Hãy thêm <meta charset="utf-8"> gần đầu phần <head> và đảm bảo tệp thực sự được lưu dưới dạng UTF-8. Nếu máy chủ khai báo một bảng mã khác, hãy sửa cả header HTTP.

Trang đã lưu không có hình ảnh hay định dạng

Tệp HTML thường lấy hình ảnh và CSS từ các tệp riêng hoặc từ địa chỉ trên internet. Chỉ di chuyển tệp .html thì các liên kết đó sẽ hỏng. Hãy dùng tùy chọn lưu "Trang web, hoàn chỉnh" của trình duyệt hoặc nhúng hình ảnh vào tài liệu.

Trang bị vỡ khi in

Bố cục thiết kế cho màn hình có thể không vừa với giấy. Định nghĩa các quy tắc @media print và đặt khổ giấy, lề bằng @page trong CSS sẽ cải thiện đáng kể bản in.

Mẹo khi chuyển đổi tệp HTML

Trên trình chuyển đổi của chúng tôi, tệp HTML được tải lên máy chủ và bị xóa trong vòng 30 phút. Khi đọc tệp, bảng mã được nhận diện từ BOM, sau đó từ khai báo <meta charset>, rồi đến chính nội dung; các trang cũ không phải UTF-8 được đọc theo Windows-1254, bảng mã Windows cũ của tiếng Thổ Nhĩ Kỳ, nên tốt nhất hãy lưu trang dưới dạng UTF-8 trước khi chuyển đổi. Nội dung <body> của tài liệu và khối <style> của trang được giữ lại, còn các đoạn HTML không có thẻ <body> được xử lý nguyên trạng.

  • HTML sang PDF chạy trong một công cụ hiển thị của trình duyệt: CSS dành cho in được áp dụng, khổ trang định nghĩa bằng @page được tôn trọng (nếu không thì dùng A4), và màu nền được in ra. Vì lý do bảo mật, JavaScript không được thực thi và hình ảnh, phông chữ hay bảng định kiểu trên internet không được tải về; chỉ những tài nguyên nhúng trong tài liệu (data: URI) được sử dụng. Nếu muốn có hình ảnh trong kết quả, hãy nhúng chúng vào HTML.
  • HTML sang Word dùng LibreOffice để chuyển tiêu đề, danh sách, bảng, căn lề và hình ảnh nhúng sang DOCX. Các bố cục CSS phức tạp (flex, grid) không có tương đương trong Word và sẽ bị đơn giản hóa.
  • HTML sang Markdown rất phù hợp để chuyển một trang web hay bài viết trợ giúp vào kho tài liệu: tiêu đề, chữ nhấn mạnh, danh sách, bảng, liên kết và khối mã được giữ lại, còn thông tin định kiểu bị bỏ đi.
  • Theo chiều ngược lại, Word sang HTML nhúng hình ảnh vào trong tệp và tạo ra một tài liệu HTML duy nhất, độc lập, có khai báo bảng mã ký tự, nên chữ có dấu hiển thị đúng trong trình duyệt.

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

HTML có phải ngôn ngữ lập trình không?

Không. HTML là ngôn ngữ đánh dấu: nó mô tả cấu trúc nội dung nhưng không có vòng lặp, điều kiện hay phép tính. JavaScript được dùng để thêm hành vi cho trang.

HTML5 và HTML khác nhau thế nào?

HTML5 là tên phiên bản lớn trở thành Khuyến nghị của W3C năm 2014. Từ năm 2019, HTML được phát triển tại WHATWG không đánh số phiên bản, dưới tên "HTML Living Standard". Trên thực tế, ngày nay HTML5 và HTML là một.

Làm sao mở một tệp HTML?

Nhấp đúp vào tệp, nó sẽ mở trong trình duyệt mặc định. Để xem mã nguồn, hãy mở tệp bằng trình soạn thảo văn bản hoặc dùng tùy chọn "Xem nguồn trang" của trình duyệt.

Vì sao hình ảnh bị mất khi chuyển HTML sang PDF?

Nếu hình ảnh được tải từ một địa chỉ internet, trình chuyển đổi của chúng tôi không tải chúng về vì lý do bảo mật. Hãy nhúng hình ảnh vào HTML dưới dạng data: URI, hoặc chuyển tài liệu sang Word trước rồi thêm hình ảnh vào đó.

Mở tệp HTML có an toàn không?

HTML có thể chứa JavaScript, nên hãy cẩn trọng với tệp từ nguồn không rõ. Trang HTML gửi kèm email và yêu cầu nhập mật khẩu là một thủ đoạn lừa đảo (phishing) phổ biến.

Nguồn tham khảo

Công cụ chuyển đổi liên quan

Tất cả bài viết