Login

SEO cơ bản cho lập trình viên web: những việc bạn có thể làm trong code

  • author-image

    Nguyễn Đình Cường

  • blog-tag
  • blog-comment 0 comment
  • created-date 09 Nov, 2026
blog-thumbnail

SEO thường được xem là việc của đội nội dung và marketing, nhưng phần nền tảng kỹ thuật lại nằm trong tay lập trình viên. Một website tốt về mặt kỹ thuật giúp công cụ tìm kiếm tìm thấy, hiểu và hiển thị trang của bạn đúng cách. Bài này liệt kê những việc thiết thực bạn có thể làm trong mã nguồn, không hứa hẹn "lên top" mà chỉ tập trung vào nền móng đúng.

1. Thẻ title và meta description

Hai thẻ này nằm trong head và thường là thứ người dùng thấy đầu tiên ở kết quả tìm kiếm:

<title>Học Flexbox từ cơ bản đến thành thạo</title>
<meta name='description' content='Hướng dẫn Flexbox cho người mới, có ví dụ minh họa và bài tập thực hành.'>
  • Mỗi trang cần title và description riêng, mô tả đúng nội dung. Tránh dùng chung một title cho cả website.
  • Title nên ngắn gọn (thường dưới khoảng 60 ký tự để ít bị cắt) và đặt từ khóa chính ở đầu một cách tự nhiên.
  • Description không phải yếu tố xếp hạng trực tiếp, nhưng viết hấp dẫn giúp tăng khả năng người dùng nhấp vào.

2. Cấu trúc tiêu đề và HTML ngữ nghĩa

Mỗi trang một thẻ h1 mô tả chủ đề chính, các thẻ h2, h3 theo thứ bậc hợp lý. Dùng các thẻ main, article, nav thay cho toàn div giúp công cụ tìm kiếm hiểu bố cục trang. Văn bản của liên kết nên mô tả đích đến ("xem khóa học Flexbox") thay vì chỉ "bấm vào đây".

3. URL thân thiện

  • Ngắn, dễ đọc, viết thường, nối bằng dấu gạch ngang: /blog/flexbox-co-ban.
  • Tránh tham số dài và ký tự lạ nếu có thể.
  • Giữ URL ổn định. Khi buộc phải đổi, dùng chuyển hướng 301 từ địa chỉ cũ sang địa chỉ mới.

4. Cho phép thu thập: robots.txt và sitemap

File robots.txt ở thư mục gốc chỉ dẫn trình thu thập nên hay không nên truy cập đâu, và có thể trỏ đến sitemap:

User-agent: *
Disallow: /admin/
Sitemap: https://example.com/sitemap.xml

Sitemap XML liệt kê các URL quan trọng để công cụ tìm kiếm khám phá đầy đủ. Hầu hết framework (Next.js, Nuxt...) có cách tạo sitemap tự động. Cẩn thận: chặn nhầm toàn bộ website bằng Disallow: / là sự cố đã xảy ra với không ít dự án khi đưa môi trường thử nghiệm lên thật. Để ngăn một trang bị lập chỉ mục, hãy dùng thẻ <meta name='robots' content='noindex'> thay vì chỉ dựa vào robots.txt.

5. Canonical: tránh nội dung trùng lặp

Khi cùng một nội dung truy cập được qua nhiều URL (có hoặc không có tham số, có hoặc không có dấu gạch chéo cuối), hãy chỉ ra địa chỉ chính:

<link rel='canonical' href='https://example.com/blog/flexbox-co-ban'>

6. Hình ảnh có ý nghĩa

Thuộc tính alt mô tả ảnh vừa giúp khả năng tiếp cận vừa giúp công cụ tìm kiếm hiểu ảnh. Đặt tên file có nghĩa (so-do-flexbox.png thay vì IMG_0231.png) và nén ảnh để trang tải nhanh.

7. Hiển thị tốt khi chia sẻ: Open Graph

<meta property='og:title' content='Học Flexbox từ cơ bản'>
<meta property='og:description' content='Hướng dẫn Flexbox cho người mới'>
<meta property='og:image' content='https://example.com/anh/flexbox.jpg'>
<meta property='og:url' content='https://example.com/blog/flexbox-co-ban'>

Các thẻ này quyết định tiêu đề, mô tả và ảnh xem trước khi liên kết được chia sẻ trên mạng xã hội hay ứng dụng nhắn tin.

8. Dữ liệu có cấu trúc

Bạn có thể thêm dữ liệu có cấu trúc định dạng JSON-LD theo chuẩn schema.org để mô tả bài viết, khóa học, sản phẩm hay câu hỏi thường gặp, giúp công cụ tìm kiếm hiểu nội dung chính xác hơn và đôi khi hiển thị kết quả phong phú. Hãy kiểm tra bằng công cụ kiểm tra dữ liệu có cấu trúc mà các công cụ tìm kiếm cung cấp, và chỉ đánh dấu những gì thực sự có trên trang.

9. Tốc độ, thiết bị di động và HTTPS

  • Trang nhanh và ổn định về bố cục là trải nghiệm tốt, nên được công cụ tìm kiếm coi trọng (xem bài về Core Web Vitals).
  • Giao diện đáp ứng với thẻ viewport đúng.
  • Dùng HTTPS cho toàn bộ website.

10. Chú ý khi dùng framework JavaScript

Nếu nội dung chỉ xuất hiện sau khi JavaScript chạy ở trình duyệt, công cụ tìm kiếm và trình xem trước liên kết có thể khó đọc. Với website cần SEO, hãy ưu tiên render phía máy chủ hoặc dựng tĩnh (SSR, SSG) như đã nói ở bài về Next.js, và đảm bảo liên kết nội bộ là thẻ a với thuộc tính href thật.

Kết luận

SEO kỹ thuật là chuỗi những việc nhỏ làm đúng: title và description riêng cho từng trang, HTML ngữ nghĩa, URL sạch, sitemap, canonical, ảnh có alt, Open Graph và trang tải nhanh. Nhưng nội dung hữu ích và đáng tin vẫn là yếu tố quan trọng nhất, hãy xem kỹ thuật như nền tảng để nội dung tốt được tìm thấy.

Để học cách xây website đúng chuẩn từ đầu, bạn có thể tham khảo các khóa học trên codebem.com.

author_photo
Nguyễn Đình Cường

0 comment