Nếu bạn muốn xây dựng một trang web thì chắc chắn bạn không thể bỏ qua được ngôn ngữ HTML . HTML đóng vai trò như vật liệu để xây dựng website , nó có nhiệm vụ hiển thị nội dung văn bản, hình ảnh, video,… tất cả để hiển thị nội dung trên trình duyệt. HTML giống như gạch, đá, xi măng,…v.v là những vật liệu cần thiết để xây đựng 1 ngôi nhà đó. Bây giờ chúng ta bắt đầu tìm hiểu : HTML là gì? và Cấu trúc cơ bản của HTML
HTML là gì?
- HTML là chữ viết tắt của HyperText Markup Language, dịch ra tiếng Việt có nghĩa là ngôn ngữ đánh dấu siêu văn bản . Nó dùng để định dạng bố cục ,các thuộc tính kiên quan đến cách hiển thị một đoạn text và được hiển thị trên 1 chương trình đặc biệt.
- HTML không phải là ngôn ngữ lập trình, html là ngôn ngữ đánh dấu (markup language), ngôn ngữ đánh dấu là một nhóm các thẻ đánh dấu (các tag).
Cú pháp đóng mở thẻ
Vì HTML là một định dạng đặc biệt của XML nên nó sẽ có thẻ mở và thẻ đóng với cú pháp như sau:
<tagname> </tagname>
Trong đó :
- <tagname> là thẻ mở
- </tagname> là thẻ đóng
Mỗi tagname như trên ta gọi là 1 thẻ HTML và công dụng của chúng cũng khác nhau. Ví dụ bạn muốn hiển thị 1 đoạn văn nào đó thì có thể đặt trong thẻ <p> Nội dung đoạn văn </p>
Cấu trúc cơ bản của HTML
<!DOCTYPE html>
<html>
<head>
<title>Tiêu đề</title>
</head>
<body>
Phần nội dung ...
</body>
</html>Trong đó:
- <!DOCTYPE html> là phần khai báo kiểu dữ liệu hiển thị là html để trình duyệt (Browser) biết.
- <html> và </html> là cặp thẻ nằm ngoài cùng và nó có nhiệm vụ là bao hết nội dung của trang web lại. Thẻ này là bát buộc.
- <head> và </head> là phần khai báo thông tin của trang web
- <title> và </title> nằm bên trong thẻ <head> và đây chính là khai báo tiêu đề cho trang web.
- <body> và </body> là thành phần quan trọng nhất, nó chứa nhưng đoạn mã HTML dùng để hiển thị trên website
- Các thẻ còn lại nằm trong thẻ <body> chính là các thẻ định dạng dữ liệu.
Ví dụ sau giúp ta hiểu rõ hơn về cấu trúc cơ bản HTML:
<!DOCTYPE html>
<html>
<head>
<title>Học lập trình</title>
</head>
<body>
<h1>Học lập trình tại huydevtheme.com/</h1>
</body>
</html>Cấu trúc cơ bản của trang web
Mỗi trang web đều có cách thể hiện cấu trúc khác nhau, có trang 1 cột, có trang 2 và cũng có trang chứa nhiều cột, bên dưới đây chúng ta tham khảo một trang đơn giản sử dụng 2 cột để layout.
- Phần đầu: header, có thể chứa logo, câu slogan, các liên kết, các banner liên kết, các button, đoạn flash, hoặc các form ngắn như form tìm kiếm,…
- Phần liên kết toàn cục: global navigation, dùng để chứa các liên kết đến những trang quan trọng trong toàn bộ trang, trong phần này có thể chứa thêm các liên kết con (sub navigation).
- Phần thân của trang: page body, phần này chứa phần nội dung chính (content) và phần nội dung phụ (sidebar).
- Phần nội dung chính: content, phần này chứa nội dung chính cần thể hiện cho người dùng xem.
- Phần nội dung phụ: sidebar, phần này có thể chứa liên kết phụ của từng trang (local navigation), hoặc các banner chứa liên kết liên quan, hoặc có thể dùng để chứa các liên kết quảng cáo,…
- Phần cuối trang web: footer, phần này thường chứa phần liên hệ như: tên công ty, địa chỉ, số điện thoại, mail liên hệ,… và đặc biệt là copyright, hoặc có thể chứa các liên kết toàn trang, các banner liên kết,…
Lời kết
Trên đây là những khái niệm cơ bản về HTML như HTML là gì? Cấu trúc cơ bản của HTML và cấu trúc cơ bản của trang web . Hẹn gặp lại các bạn vào các bài viết tiếp theo.
