![Lorem Ipsum](/_next/image?url=https%3A%2F%2Fd24rsy7fvs79n4.cloudfront.net%2Facademy.eraweb.net%2F1000x1000%2F20230426091048_29_1682475048.3112.webp&w=2048&q=75)
![Lorem Ipsum](/_next/image?url=https%3A%2F%2Fd24rsy7fvs79n4.cloudfront.net%2Facademy.eraweb.net%2F1000x1000%2F20230426135513_29_1682492113.6726.webp&w=2048&q=75)
Heading là gì?
![Lorem Ipsum](/_next/image?url=https%3A%2F%2Fd24rsy7fvs79n4.cloudfront.net%2Facademy.eraweb.net%2F1000x1000%2F20230426134727_29_1682491647.5894.webp&w=2048&q=75)
![Lorem Ipsum](/_next/image?url=https%3A%2F%2Fd24rsy7fvs79n4.cloudfront.net%2Facademy.eraweb.net%2F1000x1000%2F20230426134509_29_1682491509.3933.webp&w=2048&q=75)
Heading là những tiêu đề nổi bật trong 1 trang web. Việc hệ thống thẻ Heading tốt giúp nhanh chóng khái quát được nội dung cả trang web, SEO hiệu quả hơn, người dùng có trải nghiệm tốt hơn khi dễ dàng tìm kiếm nội dung. Có 6 thẻ Heading tương ứng với mức độ quan trọng giảm dần từ Heading 1 (h1) đến Heading 6 (h6):
Heading 1 (h1): Vì là thẻ quan trọng nhất, tóm tắt 1 cách ngắn gọn nội dung chính của cả trang web nên chỉ có duy nhất 1 thẻ Heading 1. Ví dụ: 1 trang web có nội dung tổng hợp các trận đấu Tennis ở Việt Nam chắc chắn phải có các cụm từ “Tennis” và “Việt Nam”, vậy thẻ Heading 1 ở đây có thể là “Cộng đồng Tennis Việt Nam”.
Heading 2 (h2): Nội dung thẻ này thể hiện các ý chính của thẻ Heading 1 và bạn có thể dùng nhiều thẻ Heading 2 trong trang web. Ví dụ: “Giải đấu sắp diễn ra”, “Giải đấu đã diễn ra”,...
Heading 3 - Heading 6 (h3 - h6): Các thẻ càng về sau thì càng có nội dung chi tiết hơn thẻ trước. Bạn có thể dùng thêm thẻ Heading 3 đến Heading 6 nếu cảm thấy cần thiết và phù hợp với trang web của mình.
Bài học liên quan
Container là một vùng vô hình nằm trong Section có chức năng cố định các Block ở bên trong nó
Border là đường viền bao quanh 1 thành phần. Có thể điều chỉnh độ dày/mỏng và màu sắc của đường...
Chủ đề liên quan