Post view

Hướng dẫn đánh dấu Schema markup bằng Microdata

Microdata là một tập hợp các thẻ HTML5 và là một giải pháp đơn giản hơn để giải thích các thành phần HTML bằng các thẻ mà công cụ tìm kiếm có thể đọc được.

Microdata là một mã đánh dấu tương đối dễ sử dụng và phù hợp với người mới. Nhược điểm là bạn phải đánh dấu từng mục riêng lẻ trong phần nội dung chính của trang web. Khi đánh dấu Schema markup bằng Microdata sẽ rất mất công so với việc đánh dấu bằng JSON-LD. Trong đó bạn có thể chỉ cần sử dụng mã ở phần tiêu đề.

Hướng dẫn tạo schema CHUẨN cho website trong SEO cho người mới

>> Tìm hiểu: Schema markup là gì

Trước khi bắt đầu, bạn cần tìm hiểu xem nội dung trang web của bạn thuộc “loại nội dung” nào. Đó là một công thức? Một bài đánh giá? Một tác phẩm âm nhạc hay một sự kiện? Việc này sẽ quyết định bạn sẽ đánh dấu nội dung đó như thế nào.

Giả sử bạn có một website về một nhà hàng có tên Noodle Paradise. Trang chủ của website này có thể có dạng sau:

<div>
<h1>Noodle Paradise</h1>
<h2>The best noodles in all of London!</h2>
<p>Address:</p>
<p>260 Elephant Road</p>
<p>London, UK</p>
<p>Tel: 01234 567890</p>
<p><a href=”http://www.noodleparadise.com/menu”>Click here to view our tasty range of dishes!</a></p>
<p>We’re open: </p>
<p>Mon-Sat 12pm – 9:30pm</p>
<p>Sun: 1pm – 8pm</p>
</div>

Hướng dẫn tạo schema CHUẨN cho website trong SEO cho người mới

Đầu tiên, bạn cần xác định phần nào của trang web nói về nhà hàng đó. Với chúng tôi, đó là tất cả những thứ nằm giữa hai thẻ <div>. Vì vậy, ta thêm “itemscope” vào thẻ <div>:

<div itemscope>

Khi thêm thẻ itemscope, chúng ta xác định rằng mã HTML có trong khối <div>…</div> nói đến một nội dung cụ thể. Tuy nhiên, nội dung đó là gì? Tiếp theo chúng ta cần sử dụng thuộc tính itemtype để xác định loại nội dung của trang, tức là, một nhà hàng.

<div itemscope itemtype=”http://schema.org/restaurant”>

Loại nội dung được đưa ra dưới dạng các URL, trong trường hợp này là http://schema.org/restaurant. Nếu trang của bạn nói về một bộ phim, bạn có thể sử dụng URL http://schema.org/movie. Bạn có thể duyệt danh sách đầy đủ các loại nội dung cộng với các phần đuôi mở rộng (extension) để tìm loại nội dung phù hợp với bạn.

Tiếp theo chúng ta cần đánh dấu schema trong seo. Phần nằm giữa thẻ <h1> của chúng ta. Thẻ này được gọi là một thẻ itemprop, như bạn có thể đoán, để dán nhãn các đặc tính của một nội dung.

<h1 itemprop=”name”>Noodle Paradise</h1>

Chúng ta có thể tiếp tục và đánh dấu phần còn lại của trang theo cách này. Khi đánh dấu đặc tính của nội dung, bạn không cần đánh dấu cả dòng, chỉ đoạn nào thuộc đặc tính liên quan thôi. Nếu bạn có một dòng như Phone number: 01234 567890, bạn chỉ cần đặt thẻ ở hai đầu của chuỗi số mà thôi.

<h2 itemprop=”description”>The best noodles in all of London!</h2>
<p>Address:</p>
<span itemprop=”address” itemscope itemtype=”http://schema.org/PostalAddress”>
<p itemprop=”streetAddress”>260 Elephant Road</p>
<p itemprop=”addressLocality”>London, UK</p></span>
<p>Tel: <span itemprop=”telephone”>01234 567890</span></p>
<p><a itemprop=”menu” href=”http://www.noodleparadise.com/menu”>Click here to view our tasty range of dishes!</a></p>
<p>We’re open:</p>
<p itemprop=”openingHours”>Mon-Sat 12pm – 9:30pm</p>
<p itemprop=”openingHours”>Sun: 1pm – 8pm</p>
</div>

>>> TÌM HIỂU THÊM: PLUGIN SCHEMA PRO

Nếu các đoạn mã này trông quá phức tạp thì bạn cũng đừng quá lo lắng. Bởi mỗi trang trên Schema.org cho các loại nội dung khác nhau đều có ví dụ hướng dẫn cách sử dụng, nên bạn có thể tham khảo mã ở phần đó.

hoangpr · 855 days ago
Comments
Order by: 
Per page: 
 
  • There are no comments yet
Post info
19.02.2019 (855 days ago)
Actions
Rate
0 votes
Recommend
 
Categories
Entertainment Blogs (1 posts)
Miền Bắc (1 posts)
Miền Trung (1 posts)
Tech News (2 posts)
Thủ thuật hay (117 posts)
Tin tức (647 posts)
Tags
Empty
Hướng dẫn đánh dấu Schema markup bằng Microdata