HTML là gì? HTML hoạt động thế nào?

HTML là gì?

HTML là một ngôn ngữ máy tính được tạo ra nhằm mục đích xây dựng các website. Những trang web xây dựng bằng html có thể tải lên Internet và lưu vào các dịch vụ lưu trữ gọi là hosting và được xem bởi bất kỳ ai khác kết nối với Internet. HTML tương đối dễ học, bởi vì nó khá là đơn giản và các thành phần bên trong cũng không có quá nhiều. Ngược lại, nó khá là mạnh mẽ và mọi trang web đều phải sử dụng nó để có thể tương tác với người dùng.

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

HTML không phải là ngôn ngữ lập trình, đồng nghĩa với việc nó không thể tạo ra các chức năng “động” được. Nó đóng vai trò như phần mềm Microsoft Word, dùng để bố cục và định dạng nội dung trang web. Do đó, HTML được sử dụng để thiết kế giao diện tĩnh cho trang web. Và khi đưa vào thiết kế web, người ta phải kết hợp nó với một ngôn ngữ lập trình web khác như là PHP, ASP, Python,…

html là gì

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

Để dễ hiểu hơn về cách HTML hoạt động, bạn có thể liên tưởng nó với phần mềm Microsoft Word. Khi bạn soạn thảo văn bản, bạn muốn định dạng cho 1 từ, câu hay đoạn văn, như là đổi màu, in đậm, gạch chân, tạo thẻ heading, tạo bảng,… bạn chỉ cần nhấn vào các nút chức năng tương ứng. HTML cũng có thể soạn thảo và định dạng nội dung như Word, khác một điều là thay vì bạn sử dụng các nút chức năng có sẵn, thì bạn phải dùng các cặp thẻ, còn gọi là html tag để định dạng chúng. Điều này có nghĩa là soạn thảo HTML khó hơn Word rất nhiều, nhưng nó khá là dễ học vì ngôn ngữ này khá đơn giản và dễ nhớ.

Một file html sẽ có định dạng là .htm hoặc .html. Bạn có thể mở file này bằng các trình duyệt như là Firefox, Chrome, Edge,… Thông thường, một website sẽ chứa nhiều trang web HTML, ví dụ như: trang chủ, trang giới thiệu, trang liên hệ, tất cả đều cần các trang HTML riêng.

Dưới đây là một đoạn cấu trúc html cơ bản:

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

Bạn để ý mỗi thẻ mở <> sẽ luôn có một thẻ đóng </>, điều này là bắt buộc khi sử dụng html. Trong cặp thẻ mở và đóng này bạn có thể thêm nhiều cặp thẻ khác miễn là cấu trúc của nó cho phép. Ví dụ trong đoạn mã html trên, mình sẽ giải thích ý nghĩa các cặp thẻ như sau:

học html

  • <html> </html>: đây là cặp thẻ dùng để định dạng nội dung bên trong là html. Cặp thẻ này sẽ bao trùm toàn bộ nội dung của website bên trong.
  • <head> </head>: thẻ này dùng để chứa nội dung mô tả về trang html này, như là tiêu đề, mô tả, tên trang,… ngoài ra, các file định dạng css, javascript,… cũng được khai báo trong thẻ này.
  • <title> </title>: cặp thẻ khai báo tên trang html.
  • <body> </body>: đây là thẻ bắt đầu nội dung trang web, là những gì sẽ thể hiện ra ngoài trình duyệt khi bạn mở trang.
  • <h1> </h1>: thẻ khai báo tiêu đề. Trong html sẽ có 6 thẻ heading đánh dấu từ h1 đến h6.
  • <p> </p>: thẻ khai báo đoạn nội dung văn bản.

Ngoài ra còn có các thẻ định dạng văn bản như là:

  • <strong>: in đậm
  • <em>: in nghiêng
  • <span>: định dạng nội dung gồm font chữ, màu sắc, size chữ,…

Và các thẻ khai báo thành phần như là:

  • <a>: khai báo một liên kết
  • <img>: chèn hình ảnh vào nội dung

Và còn rất nhiều thẻ khác mà chúng ta sẽ cùng học trong các bài tiếp theo nhé.

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

Ưu điểm:

  • Ngôn ngữ phổ biến này có rất nhiều nguồn tài nguyên hỗ trợ và cộng đồng sử dụng cực lớn.
  • Sử dụng mượt mà trên hầu hết mọi trình duyệt.
  • Nó khá đơn giản và dễ dàng cho những ai muốn học html.
  • Mã nguồn mở và hoàn toàn miễn phí ai cũng có thể sử dụng.
  • Dễ dàng kết hợp với các ngôn ngữ backend như PHP, ASP, Node.js,…

Khuyết điểm:

  • Được dùng chủ yếu cho web tĩnh. Khi thiết kế web, cần sử dụng JavaScript hoặc ngôn ngữ lập trình backend bên thứ 3 như PHP.
  • Khó kiểm soát hiển thị trên một số trình duyệt.