TopDev
#HTML CSS

Cấu trúc HTML chuẩn SEO

minhu 📖 3 phút đọc

Cấu trúc HTML chuẩn SEO không chỉ giúp cải thiện khả năng tìm thấy trang của bạn trên công cụ tìm kiếm mà còn đảm bảo rằng nội dung của bạn được trình bày một cách rõ ràng và có tổ chức. Dưới đây là các yếu tố cơ bản để tối ưu hóa HTML cho SEO:

1. Khẩu lệnh DOCTYPE#

<!DOCTYPE html>

2. Thẻ <html> và <head>#

  • Thẻ <html>: Thêm thuộc tính lang để chỉ định ngôn ngữ của trang.

<html lang="vi">

  • Thẻ <head>: Bao gồm các yếu tố quan trọng cho SEO.

<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Tiêu đề của Trang - Từ Khóa Chính</title> <meta name="description" content="Mô tả ngắn gọn về nội dung trang web, bao gồm từ khóa chính."> <meta name="robots" content="index, follow"> <link rel="canonical" href="URL-canonical-của-trang-web"> <link rel="stylesheet" href="styles.css"> <!-- Các thẻ meta khác nếu cần --> </head>

<meta charset="UTF-8">: Thiết lập mã hóa ký tự.

  • <meta name="viewport" content="width=device-width, initial-scale=1.0">: Đảm bảo trang web hiển thị đúng trên các thiết bị di động.

  • <title>: Tiêu đề của trang, nên chứa từ khóa chính và không quá 60 ký tự.

  • <meta name="description" content="...">: Mô tả ngắn gọn, hấp dẫn về nội dung trang, giúp cải thiện tỷ lệ nhấp chuột từ trang kết quả tìm kiếm.

  • <link rel="canonical" href="...">: Ngăn ngừa nội dung trùng lặp bằng cách chỉ định URL chính thức của trang.

3. Thẻ <body>#

`

Tiêu đề chính của Trang

 <nav>
   <!-- Điều hướng phụ hoặc liên kết đến các phần khác của trang web -->
 </nav>

 <main>
   <section>
     <h2>Tiêu đề phụ 1</h2>
     <p>Nội dung của phần này...</p>
   </section>
   
   <section>
     <h2>Tiêu đề phụ 2</h2>
     <p>Nội dung của phần này...</p>
   </section>
 </main>
 
 <aside>
   <!-- Thông tin phụ hoặc liên kết liên quan -->
 </aside>

 <footer>
   <p>&copy; 2024 Công ty của bạn. Tất cả quyền được bảo lưu.</p>
   <!-- Liên kết đến các trang pháp lý, liên hệ, v.v. -->
 </footer>
`

  • <header>: Thường chứa tiêu đề chính và điều hướng chính của trang.

  • <nav>: Điều hướng chính hoặc phụ, giúp cải thiện khả năng truy cập và SEO.

  • <main>: Nội dung chính của trang. Sử dụng các thẻ <section>, <article>, và <h2> để tổ chức nội dung rõ ràng.

  • <aside>: Nội dung phụ hoặc liên kết liên quan không phải là phần chính.

  • <footer>: Thông tin liên hệ, bản quyền, và các liên kết pháp lý.

4. Thẻ H1, H2, H3, ...#

  • Sử dụng thẻ tiêu đề <h1> cho tiêu đề chính của trang và các thẻ tiêu đề phụ <h2>, <h3>, v.v. để tổ chức nội dung theo thứ tự quan trọng.

<h1>Tiêu đề Chính</h1> <h2>Tiêu đề Phụ 1</h2> <h3>Tiêu đề Phụ 1.1</h3>

5. Thẻ <a> và <img>#

  • Thẻ <a>: Đảm bảo các liên kết có văn bản liên kết mô tả rõ ràng và chứa từ khóa liên quan.

<a href="link-to-page" title="Mô tả liên kết">Văn bản liên kết</a>

  • Thẻ <img>: Sử dụng thuộc tính alt để mô tả hình ảnh cho các công cụ tìm kiếm và người dùng gặp khó khăn với thị giác.

<img src="image.jpg" alt="Mô tả hình ảnh">

6. Tối ưu hóa tốc độ tải trang#

  • Tối ưu hóa hình ảnh: Sử dụng định dạng và kích thước hình ảnh hợp lý.

  • Nén CSS và JavaScript: Đảm bảo các tệp CSS và JavaScript được nén để giảm thời gian tải trang.

Tối ưu hóa HTML cho SEO giúp công cụ tìm kiếm hiểu rõ nội dung của bạn và cải thiện trải nghiệm người dùng. Nếu bạn cần thêm thông tin hoặc có câu hỏi cụ thể, đừng ngần ngại hỏi!

Bài liên quan trong #HTML CSS

✓ Đã sao chép link