Ruth Cheesley - Joomla!Day South Africa - Developments in Semantic HTML - Adding information to your search listings


Published on

A presentation on how to add semantic information to your website to improve your search engine listings and potentially develop your SEO, ranking position and visibility in search engines.

Published in: Technology, News & Politics
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Ruth Cheesley - Joomla!Day South Africa - Developments in Semantic HTML - Adding information to your search listings

  1. 1. Developments in Semantic HTML – Adding information to search listings Ruth Cheesley – Virya Technologies Autor: 18.10.12 Ruth Cheesley - @RCheesley -
  2. 2. Show me the money!
  3. 3. Good SEO = Reputation Management
  4. 4. Could do better!
  5. 5. Microdata Autor: 18.10.12 Ruth Cheesley - @RCheesley -
  6. 6. This made me pay attention!
  7. 7. Click-through rates 30% higher Potentially 3+ ranks higher Rich Snippets in action
  8. 8. So many things to do!
  9. 9. This turned into sales!
  10. 10. Semantics 101
  11. 11. Feed the machines!
  12. 12. I Iwant to know want to know about avatar about avatar Uhhh, which Uhhh, which one? one? Content + Context = King
  13. 13. One format to rule them all
  14. 14. Creative Work Creative Work Thing Thing Place Place Product Product Event Event Intangible Intangible Person Person Medical entity Medical entity Organisation Organisation Available Schemas
  15. 15. Creative Creative Work Work Article Article Blog Blog Book Book Comment Comment Diet Diet Exercise Plan Exercise Plan Item list Item list Map Map Media object Media object Movie Movie Music Playlist Music Playlist Music Recording Music Recording Painting Painting Photograph Photograph Recipe Recipe Review Review Sculpture Sculpture Software App Software App TV Episode TV Episode TV Season TV Season TV Series TV Series Webpage Webpage Webpage element Webpage element Creative Work Schema
  16. 16. Define the Define the schema schema Declare the Declare the property property itemscope & itemtype itemprop How to use markup
  17. 17. <div itemscope itemtype =""> <h1 itemprop="name">Avatar</h1> <div itemprop="director" itemscope itemtype=""> Director: <span itemprop="name">James Cameron</span> (born <span itemprop="birthDate">August 16, 1954)</span> </div> <span itemprop="genre">Science fiction</span> <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a> </div> markup
  18. 18. <h1>Pirates of the Carribean: On Stranger Tides (2011)</h1> Jack Sparrow and Barbossa embark on a quest to find the elusive fountain of youth, only to discover that Blackbeard and his daughter are after it too. Director: Rob Marshall Writers: Ted Elliott, Terry Rossio, and 7 more credits Stars: Johnny Depp, Penelope Cruz, Ian McShane 8/10 stars from 200 users. Reviews: 50. Movie listing - before Microdata
  19. 19. <div itemscope itemtype=""><h1 itemprop="name">Pirates of the Carribean: On Stranger Tides (2011)</h1> <span itemprop="description">Jack Sparrow and Barbossa embark on a quest to find the elusive fountain of youth, only to discover that Blackbeard & his daughter are after it too.</span> Director: <div itemprop="director" itemscope itemtype=""><span itemprop="name">Rob Marshall</span></div> Writers: <div itemprop="author" itemscope itemtype=""><span itemprop="name">Ted Elliott</span></div><div itemprop="author" itemscope itemtype=""><span itemprop="name">Terry Rossio</span></div>, and 7 more credits Stars: <div itemprop="actor" itemscope itemtype=""><span itemprop="name">Johnny Depp</span>, </div><div itemprop="actor" itemscope itemtype=""><span itemprop="name">Penelope Cruz</span>,</div><div itemprop="actor" itemscope itemtype=""><span itemprop="name">Ian McShane</span></div> <div itemprop="aggregateRating" itemscope itemtype= " > <span itemprop="ratingValue">8</span> / <span itemprop="bestRating">10</span> stars from <span itemprop="ratingCount">200 </span>users. Reviews: <span itemprop="reviewCount">50</span>.</div></div> Movie listing - after Microdata
  20. 20. Google search listings Google's “Knowledge Graph” And the results are ...
  21. 21. Authorship & Publisher Markup Autor: 18.10.12 Ruth Cheesley - @RCheesley -
  22. 22. Li nk t o pro file What is Authorship?
  23. 23. Why bother?
  24. 24. Google+ is where it starts
  25. 25. Step 1: Add link to your G+ Profile <a href="[profile_url]?rel=author">Google+</a> Step 2: Add link in 'contributor to' section on G+ Adding author markup
  26. 26. Step 1: Add link to your G+ Page on your site <a href="[profile_url]?rel=publisher">Google+</a> Step 2: Verify the website link on your G+ Page Adding publisher markup
  27. 27. Profile linking in action
  28. 28. Taken from your Google+ Profile View all by author
  29. 29. Knowledge Graph in action
  30. 30. Related people
  31. 31. Joomla! Autor: 18.10.12 Ruth Cheesley - @RCheesley - TM
  32. 32. Shops Contact page Resources Articles Directories Blogs Reviews Media Microdata opportunities
  33. 33. @MicrodataJoomla Here's one I made earlier ….
  34. 34. ? Extend Joomla! TM
  35. 35. GSOC Project
  36. 36. Pruteanu Alexandru @PAlexcom Microdata Library
  37. 37. Review Autor: 18.10.12 Ruth Cheesley - @RCheesley -
  38. 38. ● ● ● ● ● Microdata allows you to add context to your webbased content Search engines can use microdata to create 'rich snippets' in your listings Authorship is a type of microdata which links an author to their content on the web Many websites do not include microdata by default but you can add it manually (or with extensions) Joomla!TM will soon ship with a JMicrodata library Autor: 18.10.12 Ruth Cheesley - @RCheesley -
  39. 39. For more information Autor: 18.10.12 Ruth Cheesley - @RCheesley -