Skip links

Cấu trúc và công dụng các thẻ Meta cơ bản của webiste mà Marketer cần biết

Trong công tác thực hiện Online Markeitng, chia sẻ link (share link) Website hay các bài viết trong Website chiếm một phần rất quan trọng. Nhựng bài viết chia sẻ lên các kênh Digital nhằm hướng người dùng về một trang web cụ thể, từ đó thống kê bằng các công cụ tracking, analytics và đánh giá hiệu quả của chiến dịch chia sẻ này. Để các chiến dịch chia sẻ link trở nên hấp dẫn hơn, hướng đến đúng tối tượng hơn phụ thuộc nhiều vào kỹ thuật sử dụng thẻ Meta trên Website hay trang đích. Bài viết sau sẽ giúp các Marketer hay quản trị Website hiểu được nguyên lý cơ bản của các thẻ Meta để hình thành nên các bài chia sẻ link bắt mắt và hấp dẫn.

Thẻ Meta (<meta />) là gì?

Hiểu nôm na thẻ Mata hay Meta tag là thẻ code html dùng để cung cấp một cách tóm gọn các thông tin cụ thể về Website đối với trình duyệt, người dùng hay bot từ các Search Engines (Google, Ping, Yahoo…). Mặc định của các thẻ Meta này sẽ được đặt trong thẻ Head (<head>…</head>) nếu tinh ý các Marketer có thể thấy những hướng dẫn đều bắt buộc đặt các doạn code vào trong thẻ Head này.

Mọi người rất hay nghe về thẻ Meta Keyword, thẻ Meta Description, thẻ Meta Title,.. đó là một trong số rất nhiều các thẻ Meta phục vụ cho nhiều mục đích khác nhau. Thẻ Meta gán trên Website thể hiện dưới con mắt người dùng rõ nhất là các đoạn text hoặc hình ảnh. Tùy vào từng loại công dụng, kết hợp các cụm thẻ Meta không chỉ làm tăng sự phong phú nội dung hiển thị cho các chiến dịch Marketing.

Phân phân loại các cụm thẻ meta cơ bản

1. Thẻ Meta dành cho Search Engines (Google, Ping, Yahoo…)

<head>
...
<title>? Tiêu đề dành cho ?????? ???????</title>
<meta name="description" content="Nội dung tóm tắt dành cho ?????? ???????" />
<meta name="robots" content="index" />
...
</head>
  • Title: chứa phần tiêu đề mà bạn muốn thể hiện trên kết quả tìm kiếm
  • Description: chứa đoạn mô tả ngắn về nội dung sẽ được đề cấp đến bên trong đường link trên kết quả tìm kiếm, hiện tại đối với các kết quả tìm kiếm thể hiện trên Google đoạn Description được giới hạn ở mức 160 ký tự (bao gồm khoảng trắng)
  • Robots: được đặt trong trang nhằm để điều hướng bots của hệ thống Search Engines đọc nội dung của trang
    • index: cho phép Robots index (lưu trữ + xếp hạng) trang, trang sẽ xuất hiện trên kết quả tìm kiếm của Search Engines
    • follow: cho phép Robots đi theo các đường link đã được gán trong trang đến các trang của link đó, điều này giúp các trang khác mà bạn đã gán cũng được index kéo theo
    • all hoặc index,follow: cho phép Robts thực hiện cả hai thao tác index và  follow
    • noindex: Robots không được index trang này, điều này có nghĩa không tìm thấy trang trên kết quả tìm kiếm của Search Engines
    • nofollow: Robots không đi theo các đường link trong trang này để đến các trang khác
    • none hoặc noindex,nofollow: không cho phép Robts thực hiện cả hai thao tác index và  follow
    • noodp: Không sử dụng mô tả trong Open Directory Project (DMoz.org) để hiển thị trong kết quả tìm kiếm
    • nodir: Không sử dụng tiêu đề và mô tả trong Yahoo Directory để hiển thị trong kết quả tìm kiếm

2. Thẻ Meta dành cho Google+

Google+ là mạng xã hội của Google chính vì vậy các thẻ Meta dành cho Google Search Engine cũng được hỗ trợ trên mạng xã hội này, ngoài ra nếu muốn thể hiện nội dung được chia sẻ khác với kết quả tìm kiếm thì sử dụng các thẻ Meta sau:

<head>
...
<meta itemprop="name" content="? Tiêu đề dành cho ??????+" />
<meta itemprop="description" content="Nội dung tóm tắt dành cho ??????+" />
<meta itemprop="image" content="URL ảnh minh họa dành cho ??????+" />
...
</head>
  • NameDescription: công dụng tương tự như đối với Search Engies, nếu trên trang của Website không sử dụng 2 thẻ Mata này, bots của Google+ sẽ tự động lấy dữ liệu từ thẻ Meta dành cho Search Engies
  • Image: thẻ hình ảnh minh họa này gần như không thể thiếu đối với việc chia sẻ trên mạng xã hội, các chiến dịch Marketing thường tận dụng ảnh minh họa này để kích thích người dùng click vào đường link của chiến dịch. Nếu không có thẻ Meta Image, bots của Google+ sẽ tự động lấy hình ảnh khác nằm bên trong trang để thay thế

3. Thẻ Meta dành cho Facebook

Facebook sử dụng chuẩn của Open Graph (The Open Graph protocol), bao gồm những thẻ Meta quan trọng như sau:

<head>
...
<meta property="og:title" content="✌️ Tiêu đề dành cho Facebook" />
<meta property="og:description" content="Nội dung mô tả dành cho ????????" />
<meta property="og:url" content="Đường link của trang" />
<meta property="og:site_name" content="Tên của Website" />
<meta property="og:image" content="URL ảnh minh họa dành cho ????????" />
<meta property="og:type" content="article" />
<meta property="og:video" content="URL video ????????" />
<meta property="og:locale" content="vi_VN" />
...
</head>
  • Og:titleOg:description: tương tự với thẻ Meta của các loại khác, nếu trang web không xuât hiện các thẻ này dành riêng cho facebook thì bots của facebook cũng sẽ tự động lấy nội dung từ thẻ tương tự
  • Og:url: chứa đường link của trang, đường link này cần chính xác và duy nhất
  • Og:site_name: thường thể hiện dưới dạng ngắn gọn như slogan, domain, tên thương hiệu… Đặc biệt cần lưu ý về độ dài giữa Site name và Title, vì nếu cả hai quá dài sẽ bị cắt bớt khi thể hiện trên Facebook điều này làm mất đi nội dung cần thể hiện để người dùng có thể đọc được.
  • Og:image: hình ảnh minh họa của Facebook được khuyên dùng ở kích thước 1200×630 (px). Đây là nơi đễ các Marketer thể hiện nội dung nổi bật của chiến dịch vì vậy hãy thiết hinh ảnh mô tả này thật sinh động và đẹp mắt với các nút call to action
  • Og:type: kiểu của đối tượng mà trang web muốn trình bày, thông qua Type bost của Facebook sẽ thể hiện đường bài chia sẻ link với những kiểu khác nhau, thông thường là website hay article. Có những kiểu chính như sau: article / website / video.movie / music.song / profile…
  • Og:video: chứa URL của video có trong trang, với thẻ Meta này phần video sẽ thay thế cho ảnh minh họa với một nút play
  • Og:locale: vị trí địa lý của Website. Nếu ở Việt Nam thì sử dụng giá trị vi_VN

4. Thẻ Meta dành cho Twitter

Twitter hỗ trợ các thẻ Meta giống như Facebook tuy nhiên để làm phong phú hơn các chiến dịch chia sẻ link có thể sự dụng thẻ Meta riêng theo chuẩn của Twitter.

<head>
...
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:description" content="Nội dung mô tả dành cho ???????." />
<meta name="twitter:title" content="? Tiêu đề dành cho ???????" />
<meta name="twitter:image" content="URL ảnh minh họa dành cho ???????" />
<meta name="twitter:player" content="URL video dành cho ???????" />
...
</head>
  • Twitter:card: thẻ Meta này cho Twitter biết định hướng và cách thể hiện đường link trang web. Có các loại chính sau:
      • summary: thể hiện dưới dạng ảnh minh họa vuông nhỏ
      • summary_large_image: thể hiện dưới dạng ảnh minh họa hớn (tương tự Facebook)
      • app: thể hiện dưới dạng button dowload dành cho các app từ store
  • Twitter:titleTwitter:description: cách hoạt động cũng giống như đối với Facebook, có thể sử dụng chung hoặc riêng tùy độ sáng tạo của chiến dịch Marketing
  • Twitter:image: khuyên dùng là hình vuông (dối với Twitter:cardsummary) và 1200×672 (tỷ lệ 16:9 dối với Twitter:cardsummary_large_image)

Trên đây là một vài thẻ Meta cơ bản mà Marketer có thể biết đến. Đối với một Marketer am hiểu sâu về code và kỹ thuật Website có lẽ là một điều khó khăn nhưng hiểu bản chất của các thẻ Meta này giúp đưa ra các ý tưởng tốt hơn trong hoạt động Marketing. Bây giờ hãy kiểm tra các Website bạn dùng để thực hiện Marketing đã đầy củ các thẻ Meta cần thiết chưa (nhấn Ctrl + U để xem và tìm các thẻ Meta), nếu chưa hãy note ra và nhờ đến sự giúp đỡ của các thành viên am hiểu kỹ thuật để Website được chuẩn Marketing hơn nhé ?.

[tm_heading style=”modern-text” tag=”div” custom_google_font=”” align=”center” text_color=”primary_color” animation=”fall-perspective” text=”Cần cải thiện Website?”][tm_spacer size=”lg:20″][tm_heading tag=”h4″ custom_google_font=”” align=”center” text_color=”secondary_color” animation=”fall-perspective” text=”Đăng ký để kiểm tra ngay Website của Doanh nghiệp bạn!”][tm_spacer size=”lg:40″][tm_contact_form_7 id=”1938″ skin=”white”]

Bình luận

Chat qua Facebook Chat qua Viber Chat qua Whatapp Chat qua Zalo Nhắn tin SMS Gọi cho chuyên viên CSKH Gửi mail cho CSKH Chỉ đường đi