Korzystanie ze Schema.org do blogowania: Artykuł VS BlogPosting

23

Od jakiegoś czasu zmieniam swoją stronę internetową i chcę ją uruchomić tak szybko, jak to możliwe, ale chcę, aby była to wiodąca pozycja, jeśli to możliwe. Obecnie używam zmodyfikowanego szablonu (wiem! Projektant stron internetowych korzystający z szablonu tut tut… ale w skrócie miałem 1 tydzień na stworzenie strony internetowej na żywo, a także sporządzenie biznesplanu w celu uzyskania grantu biznesowego i od czasu pracy pracuję mieszkanie do ostatnich 2 miesięcy i jego chillzor! co jest miłe!). Iść dalej!

Chociaż projekt jest ważny, chciałbym również zainteresować się użyciem znaczników, ale napotykam problem, że Schema.org to SOOOO VAGUE! i to absolutnie rozbija mój mózg.

Pytanie jest raczej proste, ale jednocześnie złożone, które uważasz za najlepsze:

  1. itemtype = "http://schema.org/Article"
  2. itemtype = "http://schema.org/BlogPosting"

Warto wspomnieć, że przeprowadziłem już pewne badania i podobno różnica między postem na blogu a artykułem z definicji poza Schema.org jest taka, że ​​blogowanie zwykle zawiera od 50 do 400 słów, podczas gdy ogólnie artykuły są bardziej szczegółowe i zawierają 500 słów w górę. Ale patrząc na Schema.org kojarzą artykuł z czasopismami i gazetami, na pewno to nie jest w porządku?

Czy dobrym pomysłem jest też używanie kategorii jako schematu „słów kluczowych”?

To jest mój obecny znacznik i cieszę się z wszelkiej dodatkowej krytyki lub porady na temat ulepszenia obecnego znacznika, być może nawet wskazując złe nawyki <p>, dodatkowo możesz go zobaczyć online tutaj i jak Google to widzi tutaj .

<article itemscope itemtype="http://schema.org/Article">
  <header>
    <hgroup>
        <h1 itemprop="name"><a rel="bookmark" title="Why all of your website designs should be responsive" href="#just-a-test3">Why all of your website designs should be responsive</a></h1>
        <h6>Publish Date: <span itemprop="datePublished">2013-01-25</span> by: <a rel="author" href="http://plus.google.com/104670346136364130203/">Simon Hayter</a></h6>
    </hgroup>
  </header>
  <p><img itemprop="image" src="http://www.bybe.net/downloads/markup3.png" alt="markup3"></p>
  <p itemprop="description">This is a very long sentence to demonstrate a snippet of a blog article, blah blah blah blah blah blah blah blah blah blah blah blah blah da da da da di di di dim dim dim di</p>
  <footer>
    <p class="right"><a itemprop="url" class="more-link" href="#just-a-test3">Read the full article...</a></p>
    <p class="left">Filed Under: <span itemprop="keywords"><a href="#">Responsive Design</a>, <a href="#">Website Design</a></span></p>
  </footer>
</article>

<article itemscope itemtype="http://schema.org/Article">
  <header>
    <hgroup>
        <h1 itemprop="name"><a rel="bookmark" title="101 Ways of Grabbing Your Audience Less than 0.1secs" href="#just-a-test2">101 Ways of Grabbing Your Audience Less than 0.1secs</a></h1>
        <h6>Publish Date: <span itemprop="datePublished">2013-01-12</span> by: <a rel="author" href="http://plus.google.com/104670346136364130203/">Simon Hayter</a></h6>
    </hgroup>
  </header>
  <p><img itemprop="image" src="http://www.bybe.net/downloads/markup2.png" alt="markup2"></p>
  <p itemprop="description">This is a very long sentence to demonstrate a snippet of a blog article, blah blah blah blah blah blah blah blah blah blah blah blah blah da da da da di di di dim dim dim di</p>
  <footer>
    <p class="right"><a itemprop="url" class="more-link" href="#just-a-test2">Read the full article...</a></p>
    <p class="left">Filed Under: <span itemprop="keywords"><a href="#">Responsive Design</a>, <a href="#">Website Design</a></span></p>
  </footer>
</article>

<article itemscope itemtype="http://schema.org/Article">
  <header>
    <hgroup>
        <h1 itemprop="name"><a rel="bookmark" title="10 Top Design Tips" href="#just-a-test1">10 Top Design Tips</a></h1>
        <h6>Publish Date: <span itemprop="datePublished">2013-01-11</span> by: <a rel="author" href="http://plus.google.com/104670346136364130203/">Simon Hayter</a></h6>
    </hgroup>
  </header>
  <p><img itemprop="image" src="http://www.bybe.net/downloads/markup1.png" alt="markup1"></p>
  <p itemprop="description">This is a very long sentence to demonstrate a snippet of a blog article, blah blah blah blah blah blah blah blah blah blah blah blah blah da da da da di di di dim dim dim di</p>
  <footer>
    <p class="right"><a itemprop="url" class="more-link" href="#just-a-test1">Read the full article...</a></p>
    <p class="left">Filed Under: <span itemprop="keywords"><a href="#">Responsive Design</a>, <a href="#">Website Design</a></span></p>
  </footer>
</article>

EDYTOWAĆ:

Teraz używam:

<article itemscope itemtype="http://schema.org/BlogPosting">

    <header>
        <h1 itemprop="name"><a rel="bookmark" title="Title Description" href="#">Article Header</a></h1>
        <dl>
            <dt>Publish Date:</dt>
            <dd><time itemprop="datePublished">2013-01-25</time></dd>
            <dt>Authors:</dt>
            <dd><a rel="author" href="#">Author Name</a></dd>
        </dl>
    </header>  

    <div class="blog-container">
        <a title="Title Description" class="th" href="#">
            <img width="870" height="400" itemprop="image" alt="Alt Text here" class="post" src="#">
        </a>
        <p itemprop="description">A long but not to long decription</p>
        <a itemprop="url" title="Title Description" href="#" class="creading">Continue Reading</a>
    </div>

    <footer>
        <dl>
            <dt>Filed Under:</dt> 
            <dd itemprop="keywords"><a rel="category" title="Title Description" href="#">Responsive Design</a></dd>
            <dd itemprop="keywords"> <a rel="category" title="View all posts in Website Design" href="#">Website Design</a></dd>
        </dl>
    </footer>

</article>
Simon Hayter
źródło

Odpowiedzi:

24

schema.org: Artykuł, BlogPosting

Jeśli coś jest schematem: BlogPosting, jest to schemat: Artykuł też, prawda? Jako schemat: BlogPosting jest bardziej szczegółowym schematem: Artykuł :

Bardziej szczegółowe typy

  • BlogPosting
  • Artykuł informacyjny
  • Artykuł naukowy

Masz więc schemat: Artykuł, a teraz możesz zdecydować, czy jeden z tych bardziej szczegółowych typów dotyczy Twoich treści. Jeśli nie, pozostań przy schemacie: art.

HTML5

  • Nie ma potrzeby używania titleatrybutu w bookmarklinku (ponieważ zawiera tę samą treść).

  • Możesz użyć tego timeelementu do dat publikacji.

  • Nie użyłbym podtytułu dla daty publikacji i autora, ponieważ nie sądzę, że jest to alternatywny tytuł lub slogan (może być jednak odpowiedni dla twojej aktualnej treści). Zamiast tego umieściłem je w footerelemencie :

    footerZwykle zawiera informacje o swojej sekcji, takie jak kto to napisał ...

  • Nie zawarłbym obrazu w pelemencie . Możesz pominąć dowolny element „pojemnik” lub użyć, divjeśli go potrzebujesz.

  • Link „Przeczytaj cały artykuł ...” nie powinien znajdować się w footer. Użyłbym tego navelementu , ponieważ jest to główna nawigacja dla tego elementu podziału (→ article).

  • Użyłbym dlelementu (lub a ul) dla słów kluczowych.

Artykuł może wyglądać następująco:

<article itemscope itemtype="http://schema.org/Article">

  <h1 itemprop="name headline"><a rel="bookmark" href="#just-a-test3">Why all of your website designs should be responsive</a></h1> 
  <!-- no need for 'header', but can be added if needed -->

  <footer>
    Publish Date: <time itemprop="datePublished">2013-01-25</time> by: <a rel="author" href="http://plus.google.com/104670346136364130203/">Simon Hayter</a>
    <!-- 'dl' could be used if you use "Author:" instead of "by:" -->
  </footer>

  <img itemprop="image" src="http://www.bybe.net/downloads/markup3.png" alt="markup3">

  <p itemprop="description">This is a very long sentence to demonstrate a snippet of a blog article, blah blah blah blah blah blah blah blah blah blah blah blah blah da da da da di di di dim dim dim di</p>

  <nav>
    <a itemprop="url" class="more-link" href="#just-a-test3">Read the full article...</a>
  </nav>

  <footer>
    <dl>
      <dt>Filed Under</dt>
      <dd itemprop="keywords"><a href="#">Responsive Design</a></dd>
      <dd itemprop="keywords"><a href="#">Website Design</a></dd>
    </dl>
  </footer>

</article>
unor
źródło
1
+1 to rodzaj informacji i sugestii, których szukam! Nie mam nic przeciwko użyciu dodatkowych mikrodanych, jeśli ludzie mają jakieś pomysły!
Simon Hayter
Myślę, że możesz się mylić z zakładką rel, o ile jestem przekonany, że tytuł działa jak najechanie myszką, pozwalając na dostarczenie dodatkowych informacji, podczas gdy zakładka definiuje bezpośredni link. Usunięcie tagu tytułu wyłącza najechanie kursorem - przynajmniej w przeglądarce Firefox.
Simon Hayter
1
Na pierwszy rzut oka wydaje się, że wiele słów kluczowych jest dozwolone: stackoverflow.com/a/8050088/1892635
Simon Hayter
Właśnie zaktualizowałem nowy kod, co myślisz?
Simon Hayter
@bybe: Odnośnie titleatrybutu: Tak, brakuje wtedy podpowiedzi. Ale chodzi o to, że podpowiedź nie jest tu potrzebna, ponieważ ta sama treść jest już obecna w kotwicy linku. Treść titleatrybutu nie podaje tutaj żadnych nowych informacji. Na przykład dla niektórych użytkowników czytników ekranu ta sama treść zostałaby odczytana dwukrotnie.
lub
4

Moim zdaniem i schematów postów na blogu należy używać do postów na blogu. Zawiera wszystkie właściwości, których możesz potrzebować do postów na blogu (choć tak samo jak schemat artykułu).

Im bardziej wyszukiwarka wykorzystuje informacje dostarczone za pomocą schematu, tym bardziej trafna staje się twoja treść, jeśli można ją poprawnie zidentyfikować (jest oznaczona). Schemat artykułów kojarzyłbym z treściami publikowanymi przez organizację informacyjną lub edukacyjną oraz podobnymi dokumentami lub artykułami.

To pytanie można również uznać za duplikat tego pytania .

zigojacko
źródło