HTML/CSS | Thẻ tiêu đề - Những sai lầm thường gặp

Học HTML, CSS từ Zero Tới Hero

Sử dụng nhiều h1 trong cùng một trang

Thẻ <h1> nên được sử dụng cho tiêu đề chính cho trang web hiện tại của bạn và nên đặt ở đầu phần nội dung của bạn. Nếu bạn có một trang nói chi tiết về sản phẩm Laptop DELL Precision 5540 thì bạn nên sử dụng thẻ <h1> với tên sản phẩm đó:

<h1>Laptop DELL precision 5540</h1>

Nếu sau đó bạn có đề cập tới một chiếc laptop khác là Laptop Razer 15 2022 thì bạn nên có một trang riêng cho sản phẩm đó với tên của nó nằm trong thẻ <h1>.

Sử dụng thẻ h vì nó phù hợp với kích thước phông chữ

Lỗi này gặp chủ yếu do các nhà phát triển trang web chưa biết cách sử dụng đúng các thẻ tiêu đề. Ví dụ họ không sử dụng thẻ <h1> chỉ vì nó quá lớn so với thiết kế mà họ đang tìm kiếm, nên họ chọn sử dụng thẻ <h2> hoặc <h3>.

Tuy nhiên, bạn chỉ cần sử dụng CSS để tạo kiểu cho các tiêu đề theo cách chúng ta muốn, vì vậy kích thước phông chữ không nên được dùng để xem xét khi quyết định lựa chọn các thẻ tiêu đề.

Không tuân thủ cấu trúc tiêu đề

Tất cả các tiêu đề nên tuân theo một cấu trúc rõ ràng. Vì vậy, một <h2> phải theo sau một <h1>, một <h3> phải theo sau một <h2>, … Bạn tránh quên điều này và hãy nhớ thêm rằng bạn có thể dễ dàng thay đổi kích thước của các thẻ tiêu đề bằng CSS.

Ví dụ, sau đây là một cấu trúc tiêu đề tốt:

• <h1>Thú cưng phổ biến ở Việt Nam</h1>
  • <h2>Chó Husky ở Việt Nam</h2>
    • <h3>Chế độ ăn kiêng của chó Husky</h3>
    • <h3>Đặc điểm của chó Husky</h3>
  • <h2>Chuột Hamster ở Việt Nam</h2>
    • <h3>Chế độ ăn kiêng cho chuột Hamster</h3>
    • <h3>Đặc điểm của chuột Hamster</h3>

Ví dụ trên có thể không chính xác khi nói chó Husky và chuột Hamster ở Việt Nam. Nó chỉ là ví dụ, chúng ta sẽ không xét về việc 2 loài này có ở Việt Nam thật hay không nhé.

Hoàn toàn không sử dụng thẻ tiêu đề

Điều này thường xảy ra khi nhà phát triển web chưa hiểu được ý nghĩa và tầm quan trọng của việc sử dụng các thẻ tiêu đề.

Kết hợp sử dụng các thẻ tiêu đề giúp tạo ra cấu trúc phân cấp nội dung. Giúp người dùng và công cụ tìm kiếm dễ dàng nắm bắt được nội dung trang web của bạn.

Sử dụng thẻ tiêu đề cho nội dung không phải tiêu đề

Điều này thường xảy ra trong quá khứ, các nhà phát triển trang web thường sử dụng các “tricks” để “đánh lừa” công cụ tìm kiếm. Bởi vì họ biết rằng các công cụ tìm kiếm sẽ ưu tiên cho các nội dung trong thẻ h, họ thường spam các từ khóa cần SEO trong các thẻ h trên trang web.

Ngày nay, các công cụ tìm kiếm đã rất thông minh. Các “tricks” spam từ khóa trong các thẻ h không mang lại tác dụng, thậm chí còn phản tác dụng.

Nếu bạn cần lời khuyên cho việc làm SEO tốt. Mình khuyên các bạn nên chú trọng tới việc mang lại nội dung có giá trị cho người sử dụng. Các công cụ tìm kiếm ngày nay đủ thông minh để đánh giá được trang web có thực sự tốt cho người dùng hay không, từ đó nâng cao thứ hạng của trang web trong kết quả tìm kiếm.

Tóm tắt

• Nên sử dụng tối đa một thẻ <h1> trong cùng một trang
• Không sử dụng thẻ h chỉ vì nó phù hợp với kích thước phông chữ
• Nên tuân thủ cấu trúc các thẻ h để tạo ra cấu trúc phân cấp cho nội dung trang web
• Làm SEO tốt là mang lại giá trị nội dung đích thực cho người sử dụng. Không nên spam các từ khóa trong các thẻ tiêu đề nhắm “đánh lừa” công cụ tìm kiếm