1. Hiện tại có một số member mạo danh BQT để giao dịch trên diễn đàn và đã LỪA ĐẢO khá nhiều tại chuyên mục Adwords... Mọi người cảnh giác và đọc bài: Giới thiệu giao dịch đảm bảo bởi @Admin

Tìm hiểu về Structured Data trong Seo và thiết kế web

Thảo luận trong 'Thảo luận, giải đáp chung Webmaster' bắt đầu bởi seotadien, 5/11/14.

Lượt xem: 4,485
  1. seotadien

    seotadien Top 7

    Gia nhập:
    30/10/12
    Bài viết:
    1,721
    Đã được thích:
    496
    Nơi ở:
    Tân Bình
    Đây là thắc mắc của một bạn gì đó về Microformats... mình đã đọc nhiều tài liệu thấy bài viết này hay nên post lại cho anh em tham khảo nhá :p

    Structured data là gì? và tại sao nó lại quan trọng trong thiết kế web hiện nay. Câu trả lời sẽ được giải đáp ngay sau đây.

    Structured Data – Dữ liệu có cấu trúc là những thông tin đã được định dạng. Các search engines như Google, Bing hay Yahoo sử dụng dữ liệu có cấu trúc để lọc kết quả tìm kiếm, đưa ra những kết quả chính xác và có nghĩa hơn với người dùng.

    Tại sao chúng ta lại cần Structured Data – Dữ liệu có cấu trúc?

    Bình thường thì con người ta khi lướt web, đọc báo thì không nói làm gì, vì những thông tin dó chúng ta có thể hiểu được. Nhưng với search engine thì sao, chúng đâu thể hiểu được bài viết đang nói về vấn đề gì. Ví dụ như bài viết nói về ‘jaguar’ và một con spider tiến hành duyệt qua trang báo đó, và nó không thể biết nghĩa của từ ‘jaguar’ là gì, có thể là một loài động vật, cũng có thể là một loại máy móc. Điều đó gây ra khó khăn cho Search Engine để hiển thị chính xác kết quả tìm kiếm cho người dùng. Google đã tuyên bố như sau:
    Mã:
    Structured data đã trở thành một phần quan trọng của hệ thống website
    Structured data is becoming an increasingly important part of the web ecosystem – Google
    
    Structure data
    Do đó, với structured data, bạn có thể giúp cho các search engine hiểu được nội dung của bạn và hiển thị một cách tích cực hơn.

    Structure data có những loại nào?

    Chúng có 3 dạng như sau
    • Microdata
    • Microformats
    • RFDa
    Trước khi đi sâu vào từng dạng, bạn cần chú ý rằng: bạn không thể sử dụng nhiều hơn một loại structured data ở bên trên, vì sẽ gây nhầm lẫn cho các search engines. Vì vậy chúng ta cần chọn cho mình một loại trong số 3 loại trên mà thôi.

    I. Microdata

    Microdata
    là kiểu cấu trúc được sử dụng phổ biến nhất, nó được thiết kế bởi Schema.org,
    Microdata có 3 thành phần là: itemscope, itemtype itemprops. Itemscope là thuộc tính bao quanh thông tin về item đó. Bằng cách thêm thuộc tính Itemscope này vào mã HTML của bạn, bạn đã quy định rằng nội dung trong đó là một nội dung đặc biệt.
    Mã:
    <div itemscope>
    Foo Fighters Concert
    </div>
    Thêm thuộc tính Itemtype để xác định kiểu của dữ liệu. Sử dụng thuộc tính này ngay sau Itemscope.
    Mã:
    <div itemscope itemtype=”http://schema.org/Event”>
    Foo Fighters Concert
    <div>
    Ngay bây giờ, các search engines có thể đã hiểu một phần nào đó về nội dung mà bạn muốn truyền tải. Và chúng ta có thể cung cấp thông tin cho nó một cách rõ ràng hơn bằng thuộc tính Itemprop. Ở ví dụ dưới đây, nếu bạn muốn mô tả vị trí cho Foo Fighters Concert thì bạn có thể sử dụng cấu trúc itemprop=”location” để định vị trí cho nó hoặc itemprop=”name” để thông báo sự kiện này tên là gì?
    Mã:
    <div itemscope itemtype=”http://schema.org/Event”>
    <span itemprop=”name”>Foo Fighters Concert</span>.
    Concert will take place at <span itemprop=”location”>Madison Square Garden</span>.
    <div>
    Để biết thêm các kiểu dữ liệu được phép khai báo, bạn có thể đọc bài viết danh sách các itemtypes của Schema

    1. Dates and Times

    Ngày tháng và thời gian là loại khó có thể phân định rạch ròi được. Ví dụ như 08/10/12 thì có nhiều nơi là 8 October 2012 hoặc 10 August 2012… và đó cũng là vấn đề đối với các search engines.

    Để cung cấp thông tin chính xác về thời gian chúng ta cần thêm một thuộc tính ‘datetime’. Thuộc tính này có định dạng mặc định là ‘YYYY-MM-DD’.
    Mã:
    <time datetime="2011-04-01">04/01/11</time>
    Đoạn code trên sẽ có định dạng là 1 April 2011

    Thuộc tính datetime có thể sử dụng được cho cả thời gian.
    Mã:
    <time datetime="2011-05-08T19:30">May 8, 7:30pm</time> 
    Đoạn code bên trên sẽ hiển thị kết quả là: May 8th 2011, 7.30pm. Và nếu bạn muốn thêm vào mã HTML của mình thì bạn có thể thêm như sau:
    Mã:
    <div itemscope itemtype=”http://schema.org/Event”>
    <span itemprop=”name”>Foo Fighters Concert</span>.
    Concert will take place at <span itemprop=”location”>Madison Square Garden</span>
    on <time datetime="2011-05-08T19:30">May 8, 2011 at 7:30pm</time>.
    <div>
    2. Implicit Information Implicit Information

    Implicit Information Implicit Information tạm hiểu là thông tin ngầm. Đây là thông tin mà nó sẽ không được hiển thị cho cả người dùng và các search engines. Một vài thông tin được chèn ẩn vào các đối tượng đa phương tiện như video, movie…Để hiểu rõ hơn về cái này, thì mình có một ví dụ thế này. Giả sử bạn có 1 đoạn mã để chạy video, và bạn muốn video đó xuất hiện như một rich snippet thì làm thế nào. OK chỉ cần thêm một chút thông tin cho nó như sau:
    Mã:
    <meta itemprop=”Duration” content=”T2M40S” />
    
    Đoạn mã trên nói cho các search engines rằng video này dài 2 phút 40s. (T2M40S – là định dạng ngày tháng và thời gian theo chuẩn ISO8601.

    II. MicroFormat

    MicroFormat
    là sự mở rộng các thẻ HTML với các thông tin ngữ nghĩa. Và chúng có các kiểu phổ biến là hCard, hCalendar, hReview. hCard được sử dụng cho người, công ty hoặc tổ chức. hCalendar được sử dụng cho các thông tin về sự kiện. và hReview được sử dụng cho nhà hàng, sách, phim….

    Khi chúng ta nói về một trận đấu bóng. Điều đầu tiên là chúng ta cần phải nói cho các search engines rằng trang web đó đang có một sự kiện bằng thuộc tính hCalendar trong thẻ
    Mã:
    <head profile=”http://microformats.org/hcalendar”>
    Tiếp theo chúng ta nói cho search engines về 1 phần của event.
    Mã:
    <div class=”vevent”>
    Và mọi thứ nằm trong thẻ div này sẽ biểu diễn cho search engine thêm thông tin về event đó. Nếu bạn muốn thêm tiêu đề cho event, chúng ta sử dụng thuộc tính sumary.
    Mã:
    <div class=”vevent”>
    <span class=”summary”>Real Madrid-FC Barcelona</span>
    </div>
    Bằng cách sử dụng thuộc tính location, chúng ta khai báo là event đó được tổ chức ở đâu.
    Mã:
    <div class=”vevent”>
    <span class=”summary”>Real Madrid-FC Barcelona</span>
    at<span class=”location”>Camp Nou</span>
    </div>
    Tiếp theo là thời gian diễn ra sự kiện bên trên chúng ta sử dụng thuộc tính dtstart.
    Mã:
    <div class=”vevent”>
    <span class=”summary”>Real Madrid - FC Barcelona</span>
    at <span class=”location”>Camp Nou</span>
    on <time class=”dtstart” title=”2012-10-22T20:30”>October 22, 2012 at 8:30pm</time>
    </div>
    Các thông tin thêm về MicroFormat bạn có thể tìm hiểu ở microformat wiki

    III. RFDa

    Về cái này tôi cũng không có nhiều kiến thức lắm. chỉ biết rằng nó có 4 loại cơ bản như sau: voctype, typeof, property resource.

    Vậy là bài viết đã kết thúc. bạn có thể ứng dụng ngay vào website của mình, sau đó sử dụng công cụ Google’s Rich Snippet Testing Tool để kiểm tra.

    Theo Nguyễn Trung Hiếu (sharecodeweb)​

    nongdanseoThe Sun Pro thích bài này.
  2. sim3gviettel.net

    sim3gviettel.net Top 9

    Gia nhập:
    11/7/12
    Bài viết:
    231
    Đã được thích:
    18
    Web:
    Chắc phải học thêm 1 khóa về cấu trúc web mới này, nó có tác dụng khá đẹp trên google search
  3. justlife84

    justlife84 Top 9

    Gia nhập:
    31/8/12
    Bài viết:
    241
    Đã được thích:
    8
    Có lẽ phải học thêm một khóa về cấu trúc web thôi.

Nội quy khi thảo luận:

Dù bạn có cố tình spam bằng cách nào khi BQT diễn đàn phát hiện sẽ lập tức banned nick và xoá toàn bộ bài viết của bạn. Ngoài ra khi phát hiện ra Spam hãy gửi thông báo cho BQT diễn đàn. Hãy suy nghĩ trước khi hành động..!
✓ Khi muốn trả lời ai đó, bạn gõ @ cộng thêm nick diễn đàn của người đó phía sau @, giống như tag tên trên Facebook.
✓ Yêu cầu khi bình luận, bạn phải gõ chữ rõ ràng, không viết tắt, gõ tiếng Việt đầy đủ dấu câu.
✓ Nên dùng font chữ mặc định của diễn đàn, không tô màu lòe loẹt hay dùng size chữ quá lớn khi bình luận.
✓ Bài viết, comment... không được phép quảng cáo dịch vụ, rao vặt, pr... Loại trừ ở chuyên mục Rao vặt đã cho phép.
✓ Nghiêm cấm các chủ đề dạng: Cứu em với, help me, giật tít, câu view... dưới mọi hình thức.
✓ Tất cả các thành viên tham gia diễn đàn cần đọc kỹ Nội quy chung và nghiêm túc tuân thủ.


Chia sẻ trang này

Đang tải...