SEO cho Developer: các thẻ HTML

Author Avatar
Dev Nhà Người Ta Mar 10, 2018

Hello, đây là bài đầu tiên trong loạt bài SEO cho developer.
Như đã nói thì có khá nhiều cách để tối ưu rank cho website của bạn, nhưng ở phạm vi bài này, chúng ta sẽ chỉ tìm hiểu về ảnh hưởng của các thẻ HTML trước thôi nhé.

Let’s go!
À, trong bài viết này mình nói Google thay cho search engine nhé (vì nó là search engine phổ biến, và viết nó ngắn hơn =)))

1.Title tag

Title là thẻ có sự ảnh hưởng quan trọng nhất. Nó mô tả chủ đề của trang đó, và sẽ được hiển thị trên Google search.

Đây là title của trang sẽ hiển thị trong search, ví dụ từ khoá sơn thùng ôm ti vi:
Ví dụ về title tag

Title thì phải để trong <head> rồi nha:

1
2
3
<head>
<title> Đây là một tiêu đề | của Dev Nhà Người Ta </title>
</head>

dev cần chú ý gì?
  • chắc chắn rằng mỗi trang chỉ có một title
  • không nên để các title của các trang giống nhau
  • lưu ý đến số lượng kí tự của title
  • đặt tên tiêu đề liên quan đến nội dung trang

2.Meta Description

Thẻ thứ 2, quan trọng không kém title là thẻ meta description (mô tả).
Hình dáng nó như vầy nè:

1
2
3
<head>
<meta name="description" content="Nội dung bạn muốn mô tả trang sẽ nằm ở đây, và nó sẽ được hiển thị ở google search."/>
</head>

Xem lại hình ở ví dụ trên để thấy phần description nó sẽ hiện ra trên trang kết quả google search như thế nào.

dev cần chú ý gì?
  • các trang khác nhau nên có nội dung mô tả khác nhau
  • cũng lưu ý đến số lượng kí tự luôn nhé

3.Thẻ H1

Thẻ H1 là heading chính của 1 trang. Nó sẽ là cái câu mang tính mời gọi, làm người đọc thích thú muốn đọc hết nội dung của trang.

Ví dụ: 1 trang job trên ITviec, thì cái title của Job đó là thẻ H1.

1
2
3
<h1>
Software Engineer ( Ruby on Rails )
</h1>

dev cần chú ý gì?
  • Mỗi trang chỉ nên có 1 thẻ h1
  • bạn có thể copy nội dung ở title cho h1

4.Image Alt Tags

Thẻ alt cho các hình ảnh, video là một thẻ khá quan trọng nữa. Nội dung trong thẻ alt của hình ảnh sẽ giúp cho search engine hiểu ảnh đó nói về cái gì, và sẽ giúp cho bạn có một thứ hạng cao hơn khi search bằng hình ảnh.
Ví dụ một hình sản phẩm trên Tiki, sẽ có thẻ alt như này:

1
2
3
4
<img
data-src="https://vcdn.tikicdn.com/ts/banner/a8/ab/e5/f8f84151a4d59d9038cc31f15099a6c8.jpg"
src="https://vcdn.tikicdn.com/assets/img/empty-lazy.gif"
alt="Sắm máy ảnh / Đi du hí" class="lazy">

Nếu bạn muốn mô tả một bức ảnh cho người khiếm thị thì bạn sẽ nói gì? Hãy mô tả nội dung cho thẻ alt của ảnh như cách vậy đó.

Nofollow là một thuộc tính bạn gán trong link nếu muốn cho search engine biết “không theo các links này” hoặc “không theo link cụ thể này”. Khi đó search engine sẽ không tính link đó vào link juice (link juice là một thuật ngữ của SEO, đại khái như là một tập hợp các liên kết trỏ đến trang web, Google để đọc thêm chi tiết :p)

Để sử dụng, gắn thêm rel=nofollow vào link như này:

1
<a href="signin.php" rel="nofollow">Sign in</a>

Bạn sẽ phải cần đến nó trong một số trường hợp như: những nội dung không đáng tin cậy (bình luận của người dùng, spam,..),.. bạn sẽ không muốn google đi theo các link đó và index nó

6.Canonical tag

Canonical tag là một thẻ rất quan trọng.
Nó quan trọng nếu site của bạn có nhiều trang có nội dung tương tự nhau, thẻ này sẽ giúp cho Google hiểu là chỉ có trang được gắn thẻ mới là trang mà Google nên tập trung vào. Điều này sẽ làm giảm được lỗi duplicate content (nội dung trùng lặp).

Sử dụng, gắn rel="canonical" vào link

1
<link rel="canonical" href="https://devnhanguoita.com" />


Tham khảo:
  1. Website Source Code SEO
  2. HTML Tags for SEO

This blog is under a CC BY-NC-ND 4.0 License
Link to this article: https://devnhanguoita.com/posts/SEO-cho-Developer-cau-truc-HTML/