List thẻ Meta dạng HTML và XHTML Google hiểu được cần cho SEO

Tài liệu SEO 2 bình luận
List thẻ Meta dạng HTML và XHTML Google hiểu được cần cho SEO

Có rất nhiều loại thẻ meta tag trong quá trình thiết kế web bạn cần để giúp Google cũng như các công cụ tìm kiếm khác hiểu được.

Thẻ meta là gì?

Thẻ meta là cách giúp cho các quản trị viên web khai bao với các công cụ tìm kiếm về thông tin nội dung trang web của họ.

Tuỳ theo mỗi loại công cụ tìm kiếm hoặc ứng dụng (chia sẻ mạng xã hội) mà sử dụng (xử lý) các loại thẻ meta mà hệ thống của nó có thể hiểu. Chúng sẽ bỏ qua những những thẻ còn lại.

Thẻ meta được thêm vào phần <head>…</head> trên trang HTML

Thẻ meta được thêm vào phần <head>...</head> trên trang HTML

Thẻ meta được thêm vào phần <head>…</head> trên trang HTML

Đây là phần mà người dùng không nhìn thấy, khi bạn view source (Ctrl+U hoặc cmd + U trên firefox),  (Ctrl+alt+U  hoặc alt+cmd+U trên Google Chorme).

Các thẻ meta mà Google hiểu:

1.  Thẻ meta name=”description

<meta name=”description” content=”Đây là đoạn mô tả vắn tắt nội dung của landingpage (url) của bạn.” />

Đây là phần nội dung sẽ được hiển thị trên Google khi bạn xác định từ khóa chính và chưa từ khóa đó trong thẻ meta description.

Xem thêm bài viết chi tiết về Meta Description là gì? Tại sao Description quan trọng cho SEO?

2. Thẻ title <title>

<title>Tiêu đề trang của bạn</title>

Thẻ meta title hay thẻ tiêu đề của trang, nếu xét về mặt kỹ thuật thì nó không được gọi là thẻ meta nhưng thẻ title thường được dùng kết hợp với thẻ meta “description”.

Đây là thẻ được hiển thị trên kế quả tìm kiếm của các công cụ tìm kiếm tự nhiên và sẽ hiển thị trên trình duyệt của người dùng.

Xem thêm chi tiết:  Tiêu đề SEO là gì? Cách viết tiêu đề SEO hiệu quả.

3. Thẻ meta robots

<meta name=”robots” content=”,…” />
<meta name=”googlebot” content=”,” />

Các thẻ này nhằm khai báo với bot của các công cụ tìm kiếm hay trình thu thập dữ liệu có nên thu thập, bỏ qua, hay có hiển thị một đoạn trích trong kết quả tìm kiếm…

Trong 2 thẻ trên thì thẻ meta name=”googlebot” chỉ dành cho Google.

Có rất nhiều loại giá trị và cách nhau bằng dấu phẩy (,) mình list ra những giá trị mà Google có thể hiểu:

  • noindex: ngăn lập chỉ mục một trang
  • nofollow: ngăn chặn các Googlebot đi theo các liên kết từ trang này
  • nosnippet: ngăn chặn việc hiển thị một đoạn trích trong kết quả tìm kiếm
  • noodp: ngăn chặn việc sử dụng mô tả thay thế từ ODP/DMOZ (1)
  • noarchive: ngăn chặn Google hiển thị liên kết được lưu trong bộ nhớ cache của một trang.
  • unavailable_after:[date]: cho phép bạn chỉ định thời gian và ngày chính xác mà bạn muốn dừng thu thập dữ liệu và lập chỉ mục trang này
  • noimageindex: cho phép bạn chỉ định rằng bạn không muốn trang của bạn xuất hiện dưới dạng một trang tham khảo cho một hình ảnh xuất hiện ở kết quả tìm kiếm của Google.
  • none: tương đương với noindex, nofollow.

Để giúp các bạn có thể hiểu hơn mình sẽ lấy ví dụ và các bạn có thể dựa vào các giá trị ở trên mình bôi đậm sử dụng cho hiệu quả:

<meta name=”robots” content=”noindex,nofollow” />

Mình dùng giá trị noindex,nofollow thay cho dấu ba chấm () phía trên và name là robots: Google và các công cụ tìm kiếm khác không lập chỉ mục và chặn bot đi theo các liên kết từ trang này.

Sử dụng thẻ meta noindex, nofollow đúng cách

Sử dụng thẻ meta noindex, nofollow đúng cách

4. Thẻ meta nositelinkssearchbox

<meta name=”google” content=”nositelinkssearchbox” />

Thẻ meta này khai báo cho Google biết không được hiển thị hộp tìm kiếm và liên kết trang web (site link).

5. The meta notranslate

<meta name=”google” content=”notranslate” />

Đây là thẻ sẽ khai báo với Google không muốn dịch trang web của chúng ta. Viêc sử dụng thẻ này nhiều khi Google dịch sẽ không được chuẩn, vì thế hạn chế dùng.

6. Thẻ meta verify

<meta name=”google-site-verification” content=”” />

Đây là thẻ chúng ta sẽ sử dụng để verify trang web của chúng ta với Google Search Console. Lưu ý ở đây giá trị trong phần (): content=”có phân biệt chữ hoa và chữ thường.

Đôi khi chúng ta hay dùng luôn Google Analytics để verify website và khi đó không cần thêm thẻ này.

7. Thẻ meta Content-Type và charset

<meta http-equiv=”Content-Type” content=”…; charset=…” />
<meta charset=”…” >

Các thẻ meta này nhằm xác định loại nội dung và bộ ký tự của trang.

8. Thẻ meta refresh

<meta http-equiv=”refresh” content=”…;url=…” />

Thẻ này nhằm đưa người dùng tới 1 trang nhất định trong 1 khoảng thời gian, Google cũng khuyến nghị sử dụng chuyển hướng 301.

Trên đây là những thẻ meta cần thiết mà Google có thể đọc và hiểu bên cạnh đó phía dưới đây mình sẽ list thêm các thẻ trong phần <head>…</head> khi làm SEO cần lưu ý.

9. Thẻ rel=”canonical”

<link rel="canonical" href="URL" />

Thẻ này thực sự cần thiết và nên có trên mỗi landing page SEO của bạn. Bạn có thể xem thêm Thẻ Rel=canonical là gì? Tác dụng và những lưu ý trong SEO.

10. Open Graph Protocol

Đây cũng là các thẻ khá quan trọng, nhằm mục đích khi chia sẻ trang web lên các mạng xã hội:

Open Graph Protocol

Open Graph Protocol

Để xem chi tiết các bạn truy cập website chính thức của Open Graph Protocol (2).

11. Favicon

Đây là hình ảnh nhỏ thương có đuôi dạng .ico hoặc có thể hình ảnh dạng .png. jpg, nó được hiển thị trên trình duyệt của bạn (3) bạn có thể dùng công cụ miễn phí tạo nhanh (4).

12. Next và Prev
<link rel=’prev’ title=’Tiêu đề URL1′ href=’URL1′ />
<link rel=’next’ title=’Tiêu đề URL3′ href=’URL3′ />

Đây là thẻ khai báo cho các công cụ tìm kiếm biết vị trí bạn đang xem và trang trước nó hay trang sau nó (danh mục) hoặc như ví dụ trên thì bài viết trước đó và bài tiếp.

13. Thẻ meta Viewport

<meta name=”viewport” content=”user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1,target-densitydpi=medium-dpi;width=device-width;height=device-height” />

Đây là thẻ thường khi dùng thiết kế web Responsive, thẻ này nhằm khai báo với trình duyệt hiển thị giao diện tương ứng với kích thước trình duyệt của thiết bị.

14. Thẻ Hreflang

Sử dụng hreflang cho URL ngôn ngữ và khu vực

Sử dụng hreflang cho URL ngôn ngữ và local

Đây là thẻ nhằm khái báo URL ngôn ngữ của trang đối với từng khu vực địa lý. Mình được hỏi khá nhiều về thẻ này. Dựa vào hình trên các bạn có thể hiểu.

Thẻ này thường sử dụng với website có nhiều ngôn ngữ và làm SEO ở nhiều khu vực địa lý khác nhau. Chúng ta có thể kiểm tra được trong phần Nhằm mục tiêu địa lý trong Search Console.

Trên đây là những thẻ thường dùng, bên cạnh đó khi bạn sử dụng các công cụ hay website hỗ trợ trực tuyến người ta thường yêu cầu bạn thêm thẻ để verify trang web của bạn.

Lưu ý: Các bạn cũng không quá lo lắng về vấn đề code hoặc thêm các thẻ meta này, các đơn vị thiết kế web hiện giờ cũng khá rõ và khi bạn thiết kế web dùng wordpress đã có các plugin hỗ trợ.

List thẻ Meta dạng HTML và XHTML Google hiểu được cần cho SEO
5 (100%) 7 votes

Tác giả

Thuy Cuong là biệt danh của anh ấy. Tên thật của anh ấy là Trần Ngọc Thùy một người đam mê SEO, Marketing. Bạn có thể tìm thấy anh ấy @tranngocthuycom, Trần Thùy.

Bài viết khác

Bình luận

2 bình luận

  • Hoàng Yến - 10/02/2017

    Great!

    • Thuy Cuong - 12/02/2017

      Cảm ơn bạn, hi vọng sẽ nhận được góp ý của bạn nhiều hơn :v