Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

Thẻ <meta> trong HTML

Phần tử <meta> trong HTML được dùng để mô tả siêu dữ liệu (metadata) của trang web như: mô tả trang, từ khóa, tác giả, v.v. Siêu dữ liệu này không hiển thị trên giao diện trang web nhưng được các công cụ tìm kiếm (Google, Bing), trình duyệt và các dịch vụ khác sử dụng để hiểu nội dung trang.

Thiết lập viewport (quan trọng cho responsive)

Một trong những cách dùng phổ biến nhất của thẻ <meta> là thiết lập viewport cho thiết bị di động:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Các thuộc tính chính của <meta>

STT Thuộc tính & Mô tả
1 name
Tên thuộc tính siêu dữ liệu. Ví dụ: keywords, description, author, generator, v.v.
2 content
Giá trị của thuộc tính siêu dữ liệu.
3 scheme (đã lỗi thời)
Chỉ định lược đồ để giải thích giá trị thuộc tính.
4 http-equiv
Dùng cho tiêu đề phản hồi HTTP. Ví dụ: làm mới trang (refresh), đặt cookie (set-cookie), kiểu nội dung (content-type), hết hạn (expires).
5 charset
Khai báo mã ký tự của tài liệu (khuyên dùng: UTF-8).

Ví dụ hoàn chỉnh

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="description" content="Học lập trình miễn phí">
  <meta name="keywords" content="HTML, CSS, JavaScript, lập trình web, miễn phí">
  <meta name="author" content="Nguyễn Văn A">
  <meta http-equiv="refresh" content="30">
  <title>Trang web demo</title>
</head>
<body>
  <h2>Các khóa học</h2>
  <p>Danh sách khóa học lập trình miễn phí:</p>
  <ol>
    <li>HTML & CSS</li>
    <li>JavaScript</li>
    <li>React</li>
    <li>Node.js</li>
  </ol>
</body>
</html>

Mẹo SEO: Luôn khai báo description (150-160 ký tự) và keywords liên quan để cải thiện thứ hạng tìm kiếm.