HTML là gì? Vai trò quan trọng của HTML đối với Website.
NỘI DUNG BÀI VIẾT
HTML là gì? HTML là viết tắt của từ gì và HTML dùng để làm gì? Hãy cùng tìm hiểu qua bài viết này nhé.
HTML là gì?
HTML là viết tắt của cụm từ HyperText Markup Language. Có thể dịch là ngôn ngữ đánh dấu siêu văn bản. HTML là nền tảng để hiển thị Web. Cho dù Web bạn viết bằng ngôn ngữ lập trình gì đi nữa, thì cũng phải đảm bảo xuất ra HTML cho trình duyệt từ phía người sử dụng có thể đọc và hiển thị được nội dung.
Ngoài HTML ra 1 trang web cần phải có thêm CSS, Javascript, hình ảnh… cho sinh động. Bạn có thể hiểu đơn giản HTML giống như khung xương của con người vậy. Còn hình ảnh, CSS, Javascript…. là những thứ như tóc tai, da thịt,….
Một tài liệu HTML được hình thành bởi các phần tử HTML (HTML Elements) được quy định bằng các cặp thẻ (tag), các cặp thẻ này được bao bọc bởi một dấu ngoặc ngọn (ví dụ <html>
) và thường là sẽ được khai báo thành một cặp, bao gồm thẻ mở và thẻ đóng (ví <strong>
dụ </strong>
và ). Các văn bản muốn được đánh dấu bằng HTML sẽ được khai báo bên trong cặp thẻ (ví dụ <strong>Đây là chữ in đậm</strong>
). Nhưng một số thẻ đặc biệt lại không có thẻ đóng và dữ liệu được khai báo sẽ nằm trong các thuộc tính (ví dụ như thẻ <img>
).
Một tập tin HTML sẽ bao gồm các phần tử HTML và được lưu lại dưới đuôi mở rộng là .html hoặc .htm.
Cách hoạt động của HTML
HTML documents là files được kết thúc .html hay .htm. Với những file này bạn có thể xem bằng cách sử dụng bất kỳ trình duyệt nào (Google Chrome, Firefox, Safari,…). Các trình duyệt đọc những file HTML này và biến đổi chúng thành một dạng visual trên Internet sao cho người dùng có thể xem và hiểu được chúng.
Bình thương một trang web có nhiều có web HTML như: trang chủ, giới thiệu, liên hệ, blog,…mỗi trang như thế đều cần một trang HTML riêng. Trong mỗi trang HTML chứa một bộ các tag (elements) để xác định từng khối của một trang web và tạo thành một cấu trúc gồm section, paragraph, heading và các khối nội dung khác.
Đa phần các HTML elements đều có tag mở và tag đóng <tag></tag>. Bạn có thể xem qua một đoạn HTML được cấu trúc như thế nào:
<div>
<h<strong>1</strong>>Heading <strong>1</strong></h<strong>1</strong>>
<h<strong>2</strong>>Heading <strong>2</strong></h<strong>2</strong>>
<h<strong>3</strong>>Heading <strong>3</strong></h<strong>3</strong>>
<p>Paragraph</p>
<img src="/" alt="Alternative information">
<p>Paragraph two with a <a href="https://example.com">hyperlink</a></p>
</div>
Code language: PHP (php)
BashCopy
Trong đó:
- Element được bao ở ngoài là bộ tag division <div></div> dùng để markup cho toàn bộ nội dung.
- Tiếp theo là các thẻ tag tiêu đề <h1></h1>, <h2></h2>, <h3></h3>.
- Đoạn văn <p></p>.
- Hình ảnh <img>.
- Đoạn văn thứ 2 chứa tag <a></a> với attribute href chứa URL đích.
- Tag hình ảnh chứa 2 attribute: src cho ảnh và alt cho mô tả hình ảnh.
Ưu điểm và nhược điểm của HTML
Ưu điểm HTML
HTML có một số ưu điểm dưới đây:
- Cộng đồng với nhiều tài nguyên lớn.
- Hoạt động mượt mà trên tất cả các trình duyệt.
- Các markup sử dụng trong HTML ngắn gọn và có độ đồng nhất cao.
- Sử dụng mã nguồn mở và miễn phí.
- Tích hợp dễ dàng với các ngôn ngữ backend (PHP, Node.js,..).
Nhược điểm HTML
Nói đển ưu điểm thì không thể bỏ qua các nhược điểm của HTML, cụ thể một số nhược điểm HTML dưới đây:
- Chủ yếu được áp dụng cho web tĩnh, nếu muốn tạo tính năng động thì các lập trình viên cần sử dụng thêm JavaScript hoặc ngôn ngữ backend khác.
- Mỗi trang HTMK cần được tạo riêng biệt ngau có khi có nhiều yếu tố trùng lặp như header và footer.
- Khó để kiểm soát cách đọc và hiển thị file HTML của trình duyệt (một số trình duyệt cũ không render được tag mới. Vì vậy, dù trong HTML document có sử dụng các tag thì các browser đó không đọc được).
- Một số trình duyệt còn chậm cập nhật để hỗ trợ tính năng mới của HTML.
Tổng kết
Ở trên mình đã giải thích khá chi tiết và cặn kẽ về HTML và vai trò của nó trên website là như thế nào. Thoạt nhìn có thể bạn sẽ tưởng các thông tin này chỉ mang tính tham khảo nhưng đó lại là các thông tin cực kỳ quan trọng, vì bạn đã làm web thì phải hiểu rõ về nó.
Xem thêm:
Leave a Reply