Một tài liệu hay tập tin HTML để được gọi là một tài liệu web thì sẽ được bao gồm bốn yếu tố chính đó là:
- Có thẻ khai báo loại tập tin/tài liệu.
- Có thẻ đóng và mở tài liệu HTML.
- Có thẻ đóng và mở phần thông tin website.
- Có thẻ đóng và mở phần nội dung website.
1. Thẻ khai báo loại tập tin
Ngay tại đoạn đầu tiên của tài liệu, chúng ta phải có một thẻ khai báo loại tập tin cho nó như thế này, cụ thể là ta sẽ khai báo rằng đây là tập tin HTML.
Với thẻ
<!DOCTYPE> ở trên, ta có thêm một tham số đó là html. Tham số html này nghĩa là chúng ta khai báo với trình duyệt rằng đây là tài liệu HTML5 (HTML phiên bản 5), dù rằng chúng ta có thể không sử dụng HTML5 nhưng hiện tại khi khai báo tập tin HTML thì bạn cứ sử dụng tham số này vừa ngắn gọn lại vừa dễ dàng sử dụng thêm HTML5 nếu thích.Ngoài ra, nó còn có một vài tham số khác
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN” “http://www.w3.org/TR/html4/frameset.dtd”>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>
Chú ý: thẻ
<!DOCTYPE> không phải là một thẻ của HTML, mà nó chỉ là một thẻ khai báo thông tin trên tài liệu để trình duyệt hiểu phiên bản HTML mà bạn sử dụng trên website.2. Thẻ đóng và mở tệp html
thẻ
<html> </html> có nhiệm vụ khai báo cho trình duyệt biết rằng những nội dung bên trong cặp thẻ này là HTML. Tuy nhiên, bên trong thẻ này mình có thêm một thuộc tính tên là lang với giá trị là vi (<html lang="vi">). Thuộc tính này nghĩa là chúng ta khai báo cho trình duyệt biết mã ngôn ngữ mà ta sử dụng trên website, mã vi nghĩa là Vietnamese – tiếng Việt, bạn có thể tham khảo các mã ngôn ngữ khác tại đây.Thẻ
<html> </html> phải bao bọc toàn bộ nội dung website, không bao gồm thẻ <!DOCTYPE>.3. Thẻ đóng và mở thông tin website
Phần khai báo thông tin của website sẽ được đặt vào bên trong cặp thẻ gọi là
<head> </head>. Nội dung bên trong thẻ này là:
– các thẻ chuyên cho khai báo thông tin website (meta): đây là một thẻ đặc biệt vì nó không có thẻ đóng như các thẻ khác mà sẽ có dấu gạch chéo như
/ ở đằng trước ký tự > cuối cùng. Thẻ này có mục đích khai báo các dữ liệu vĩ mô trong tài liệu web HTML của bạn như mô tả, từ khóa, tên tác giả, bảng mã ký tự sử dụng,…Thẻ meta luôn được khai báo kèm theo ít nhất là một thuộc tính và mỗi thuộc tính phải luôn có giá trị. Ví dụ:
Trong đó,
charset là tên thuộc tính và utf-8 là giá trị của thuộc tính charset.Nó có nhiệm vụ khai báo cho trình duyệt biết bảng mã ký tự siêu văn bản bên trong tài liệu là gì. Và hiện nay hầu hết chúng ta đều sử dụng bảng mã UTF-8 cho tất cả ngôn ngữ bao gồm các ngôn ngữ tiếng latin, chữ Hán – Nôm và các ngôn ngữ đọc từ phải sang trái (Right to Left – RTL) như tiếng Ả-Rập chẳng hạnNgoài ra còn có thể khai báo tác giả, mô tả, keyword
<meta name="author" content="Giang Trần" /><meta name="description" content="Xây dựng trang web" /><meta name="keyword" content="html, xây dựng trang web, thiet ke web" />– tên website (title),
– khai báo CSS (style),
– khai báo các đoạn Javascript (script)
và một số thông tin khác.
Thường là các thông tin được khai báo trong đây sẽ không hiển thị trực tiếp thành siêu văn bản trên web nhưng nó sẽ có nhiệm vụ chứa các thông tin quan trọng về website.
4. Thẻ đóng và mở nội dung website
Đây là cặp thẻ mà bạn sẽ tiến hành viết nội dung vào, đó là cặp thẻ
<body> </body>. Cặp thẻ này là để trình duyệt xác định đây là phần thân của website, nó sẽ chứa toàn bộ các nội dung siêu văn bản hoặc media mà bạn muốn nó hiển thị lên trang web của bạn.
Một số thẻ cơ bản như:
<strong>: In đậm chữ viết. – nhấn mạnh nội dung- <b> : thẻ in đậm ( bold)
<i>: In nghiêng chứ viết (italic).- <em> In nghiêng – nhấn mạnh nội dung emphasized
<u>: Gạch chân chữ viết.- unline<strike>: Gạch ngang chữ viết.<del>: xóa bỏ ngang nội dung. – delete<code>: Định dạng cho một đoạn mã nào đó.<hr>: Thước kẻ ngang trên tài liệu. – horizontor ( ko có thẻ đóng)
- <br> ngắt dòng- break( ko có thẻ đóng)
<mark>: Tô sáng chữ viết.- <p>: đoạn văn bản – paragraph
- <sub> chữ dưới subcript
- <sup> chữ trên – superscript
- <a > liên kết
- <img> ảnh
- …..
