Breadcrumb sử dụng đoạn trích phong phú Schema.org

9

Tôi đang gặp vấn đề khi triển khai đoạn trích giàu bánh mì từ lược đồ.org. Khi tôi xây dựng đường dẫn bánh mì của mình bằng tài liệu và chạy qua công cụ kiểm tra Google Rich Snippet , đường dẫn bánh mì được xác định nhưng không được hiển thị trong bản xem trước.

<!DOCTYPE html>
<html>
  <head>
    <title>My Test Page</title>
  </head>
  <body itemscope itemtype="http://schema.org/WebPage">     
      <strong>You are here: </strong>
      <div itemprop="breadcrumb">
        <a title="Home" href="/">Home</a> >
        <a title="Test Pages" href="/Test-Pages/">Test Pages</a> >
      </div>
  </body>
</html>

Nếu tôi thay đổi để sử dụng đoạn trích từ data-vocellect.org, đoạn trích phong phú sẽ hiển thị chính xác trong bản xem trước.

<!DOCTYPE html>
<html>
  <head>
    <title>My Test Page</title>
  </head>
  <body>
      <strong>You are here: </strong>
      <ol itemprop="breadcrumb">
        <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
          <a href="/" itemprop="url">
            <span itemprop="title">Home</span>
          </a>
        </li>
        <li itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
          <a href="/Test-Pages/" itemprop="url">
            <span itemprop="title">Test Pages</span>
          </a>
        </li>
      </ol>
  </body>
</html>

Tôi muốn mẩu bánh mì được hiển thị trong kết quả tìm kiếm thay vì URL tới trang.

Cho rằng Schema.org là cách được khuyến nghị sử dụng đoạn trích phong phú, tôi muốn sử dụng điều này, tuy nhiên vì mẩu bánh mì không hiển thị trong bản xem trước kết quả tìm kiếm bằng phương pháp này, tôi không tin rằng nó hoạt động chính xác.

Tôi có đang làm gì đó sai trong đánh dấu cho ví dụ Schema.org không?

— Adam Jenkin
nguồn

Google khuyến nghị sử dụng định dạng microdata hơn các định dạng khác. Breadcrumbs họ hỗ trợ microdata và RDFa support.google.com/webmasters/bin/ nam tôi sẽ sử dụng định dạng được đề xuất của họ nếu bạn muốn nó xuất hiện trong kết quả tìm kiếm.

— Anagio

Liên quan: Schema.org hoặc Data-Vocellect.org cho vụn bánh mì?

— unor

3

Với việc thực hiện này:

<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
      <a href="http://www.example.com/dresses" itemprop="url">
    <span itemprop="title">Dresses</span>
  </a> &gt;
</div>  
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <a href="http://www.example.com/dresses/real" itemprop="url">
    <span itemprop="title">Real Dresses</span>
  </a> &gt;
</div>  
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
  <a href="http://www.example.com/clothes/dresses/real/green" itemprop="url">
    <span itemprop="title">Real Green Dresses</span>
  </a>
</div>

Bạn sẽ có mẩu bánh mì sau trong Google:

Dresses > Real Dresses > Real Green Dresses

— Ranaivo
nguồn

1

Tôi sẽ +1 cho tài liệu tham khảo Barenaken Ladies của bạn, nhưng buồn thay, tôi nghĩ rằng tôi đang lạm dụng hệ thống bỏ phiếu :-) VÌ VẬY, tôi sẽ +1 bạn cho một giải pháp thực sự hiệu quả.

— Paulizedoust

1

Dường như với tôi rằng vấn đề là do chính tài liệu lược đồ.org. Dưới đây là một số liên kết giáo dục:

Tôi đã xếp những thứ đó là hữu ích nhất trước tiên, về cơ bản tất cả chúng đều liên kết với nhau. Hành động này là do vào cuối tháng này nhưng có vẻ như kết quả sẽ giống như trong ví dụ thứ hai của bạn.

Thật đáng tiếc vì html kết thúc phức tạp hơn thực tế, nhưng chúng ta đang ở đó.

Mong rằng sẽ giúp!

— Stuart Burrows
nguồn

1

Tôi đã làm một số nghiên cứu về điều này gần đây.

Hóa ra, những gì Google khuyến nghị cho vụn bánh mì không hoạt động. Khi tôi xem xét một vài tuần trước, ví dụ của chính họ đã thất bại trong Công cụ Rich Snippet của Google. Có vẻ như Google đang bị tụt lại phía sau một chút nhưng vẫn đi trước những người khác.

Data-vocellect.org là tiêu chuẩn được chấp nhận và không thực tế mặc dù Schema.org được cho là đã thay thế nó bằng Data-vocellect.org như bị khấu hao. Tuy nhiên, thực tế không phù hợp với những lời hoa mỹ. Mục đích là Schema.org sẽ thay thế Data-vocellect.org và điều đó có thể sẽ xảy ra. Tuy nhiên, tôi đã tìm thấy một đoạn trích (ý định chơi chữ) ở đâu đó đề cập rằng Google chưa sửa đổi mã của họ để nhận ra Schema.org.

Phải nói rằng, đây là ví dụ tôi thấy hoạt động trong Google và Bing, mặc dù Bing đã thay đổi mọi thứ gần đây một chút vì vậy hãy thận trọng nếu Bing quan trọng với bạn.

<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" href="http://www.example.com/"><span itemprop="title">Home</span></a> &gt; </span>
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" href="http://www.example.com/marvel/"><span itemprop="title">Marvel Comics</span></a> &gt; </span>
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" href="http://www.example.com/fantastic-four/"><span itemprop="title">Fantastic Four</span></a> &gt; </span>
<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a itemprop="url" href="http://www.example.com/fantastic-four/58/"><span itemprop="title">Fantastic Four #48: The Coming of Galactus</span></a></span>

Hi vọng điêu nay co ich.

— tủ quần áo
nguồn

1

(Bỏ qua hỗ trợ người tiêu dùng.)

Từ vựng Schema.org cung cấp hai cách để cung cấp mẩu bánh mì cho một WebPage(và các loại phụ của nó):

breadcrumbtài sản có giá trị văn bản
breadcrumbtài sản có BreadcrumbListgiá trị

Sử dụng văn bản là dễ dàng, nhưng không có cấu trúc (khó phân tích hơn cho người tiêu dùng).
Việc sử dụng BreadcrumbListphức tạp hơn, nhưng cho phép chỉ định rõ ràng mọi thứ cần thiết (dễ phân tích hơn cho người tiêu dùng).

Lấy ví dụ của bạn, sử dụng BreadcrumbListcó thể trông như thế này:

<body itemscope itemtype="http://schema.org/WebPage">     
  <strong>You are here: </strong>
  <div itemprop="breadcrumb" itemscope itemtype="http://schema.org/BreadcrumbList">

    <span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
      <meta itemprop="position" content="1" />
      <a itemprop="item" href="/">
        <span itemprop="name">Home</span>
      </a>
    </span> 

    &gt;

    <span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
      <meta itemprop="position" content="2" />
      <a itemprop="item" href="/Test-Pages/">
        <span itemprop="name">Test Pages</span>
      </a>
    </span>

  </div>
</body>

(Bạn có thể phải di chuyển các phần tử nếu khoảng trắng là một mối quan tâm.)

— unor
nguồn