Enhancing Search Results with Structured Data

Transcript

1. ENHANCING SEARCH RESULTS WITH STRUCTURED DATA Jan Hoffman, Frontend meeting Dec 11, 2019
3. EVOLUTION OF THE WEB 3 WEB PREHISTORY <frameset cols="25%,*,25%"> <frame src="frame_a.htm"> <frame src="frame_b.htm"> <frame src="frame_c.htm"> </frameset> Table, div, span HTML5 New HTML tags semantically defining structure of a page SEMANTIC WEB HTML5 + structured data
4. SEMANTIC WEB 4 In addition to the classic “Web of documents” W3C is helping to build a technology stack to support a “Web of data,” the sort of data you find in databases. The ultimate goal of the Web of data is to enable computers to do more useful work and to develop systems that can support trusted interactions over the network. The term “Semantic Web” refers to W3C’s vision of the Web of linked data. Semantic Web technologies enable people to create data stores on the Web, build vocabularies, and write rules for handling data. Linked data are empowered by technologies such as RDF, SPARQL, OWL, and SKOS. — W3C https://www.w3.org/standards/semanticweb/
5. @prefix rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#> . @prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#> . @prefix ex: <http://example.org/> . @prefix zoo: <http://example.org/zoo/> . ex:Rex rdf:type ex:animal . ex:Garfield rdf:type ex:cat . ex:cat rdfs:subClassOf ex:animal . zoo:host rdfs:range ex:animal . ex:zoo1 zoo:host ex:Garfield . SEMANTIC WEB 5 • RDF (Resource Description Framework) – an abstract system from which specific languages are derived, such as RDFS and RDFa • RDF Triples syntax – subject predicate object . ex:Rex ex:animal ex:Garfield ex:cat ex:zoo1 rdf:type rdfs:subClassOf rdf:type zoo:host rdfs:range
6. SEMANTIC WEB • Vocabulary ◦ defines the concepts and relationships (also referred to as “terms”) used to describe and represent an area of concern ◦ helps data integration (e.g. ambiguities on the terms from different data sets) 6
7. SCHEMA.ORG 7 • Schemas for structured data on the Internet, on web pages, in email messages, and beyond • Founded by Google, Microsoft, Yahoo and Yandex • 1000+ types • 3DModel • NewsArticle • Report • Book • MovieClip • VideoGame • HowTo • Map • Movie • Review • WebPage • Festival • ComedyEvent • Brand • DayOfWeek • ItemAvailability • Nerve • Muscle • Airline • Corporation • PostOffice • VeganDiet • Dentist • RecyclingCenter • TravelAgency • MusicStore • Apartment • Zoo • Vehicle • Electrician • Bakery • CreditCard • …
8. SCHEMA.ORG 8 • Schemas for structured data on the Internet, on web pages, in email messages, and beyond • Founded by Google, Microsoft, Yahoo and Yandex • 1000+ types
9. INTEGRATING STRUCTURED DATA 9
10. STRUCTURED DATA • Standardized format for providing information about a page and classifying the page content 10
11. INTEGRATING STRUCTURED DATA • 3 major formats – RDFa, Microdata, JSON-LD 11
12. INTEGRATING STRUCTURED DATA • 3 major formats – RDFa, Microdata, JSON-LD 12 <div vocab="https://schema.org/" typeof="SoftwareApplication"> <span property="name">Angry Birds</span> - REQUIRES <span property="operatingSystem">ANDROID</span> <link property="applicationCategory" href="https://schema.org/GameApplication" /> RATING: <div property="aggregateRating" typeof="AggregateRating"> <span property="ratingValue">4.6</span> ( <span property="ratingCount">8864</span> ratings ) </div> <div property="offers" typeof="Offer"> Price: $<span property="price">1.00</span> <meta property="priceCurrency" content="USD" /> </div> </div>
13. INTEGRATING STRUCTURED DATA • 3 major formats – RDFa, Microdata, JSON-LD 13 <div prefix="dc: https://schema.org/" typeof="dc:SoftwareApplication"> <span property="dc:name">Angry Birds</span> - REQUIRES <span property="dc:operatingSystem">ANDROID</span> <link property="dc:applicationCategory" href="https://schema.org/GameApplication" /> RATING: <div property="dc:aggregateRating" typeof="dc:AggregateRating"> <span property="dc:ratingValue">4.6</span> ( <span property="dc:ratingCount">8864</span> ratings ) </div> <div property="dc:offers" typeof="dc:Offer"> Price: $<span property="dc:price">1.00</span> <meta property="dc:priceCurrency" content="USD" /> </div> </div>
14. INTEGRATING STRUCTURED DATA 14 <div itemscope itemtype="https://schema.org/SoftwareApplication"> <span itemprop="name">Angry Birds</span> - REQUIRES <span itemprop="operatingSystem">ANDROID</span> <link itemprop="applicationCategory" href="https://schema.org/GameApplication"/> RATING: <div itemprop="aggregateRating" itemscope itemtype="https://schema.org/AggregateRating"> <span itemprop="ratingValue">4.6</span> ( <span itemprop="ratingCount">8864</span> ratings ) </div> <div itemprop="offers" itemscope itemtype="https://schema.org/Offer"> Price: $<span itemprop="price">1.00</span> <meta itemprop="priceCurrency" content="USD" /> </div> </div> • 3 major formats – RDFa, Microdata, JSON-LD
15. INTEGRATING STRUCTURED DATA 15 { "@context": "https://schema.org", "@type": "SoftwareApplication", "name": "Angry Birds", "operatingSystem": "ANDROID", "applicationCategory": "https://schema.org/GameApplication", "aggregateRating": { "@type": "AggregateRating", "ratingValue": 4.6, "ratingCount": 8864 }, "offers": { "@type": "Offer", "price": 1.00, "priceCurrency": "USD" } } • 3 major formats – RDFa, Microdata, JSON-LD <
16. 16 GOOGLE RICH RESULTS
17. GOOGLE RICH RESULTS 17 { "@context": "https://schema.org", "@type": "SoftwareApplication", "name": "Angry Birds", "operatingSystem": "ANDROID", "applicationCategory": "https://schema.org/GameApplication", "aggregateRating": { "@type": "AggregateRating", "ratingValue": 4.6, "ratingCount": 8864 }, "offers": { "@type": "Offer", "price": 1.00, "priceCurrency": "USD" } }
18. GOOGLE RICH RESULTS 18 <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "SoftwareApplication", "name": "Angry Birds", "operatingSystem": "ANDROID", "applicationCategory": "https://schema.org/GameApplication", "aggregateRating": { "@type": "AggregateRating", "ratingValue": 4.6, "ratingCount": 8864 }, "offers": { "@type": "Offer", "price": 1.00, "priceCurrency": "USD" } } </script>
19. GOOGLE RICH RESULTS • Support for RDFa, Microdata and JSON-LD ◦ JSON-LD is recommended • Uses a subset of schema.org vocabulary • A single page can have multiple definitions • Definitions can be anywhere in the document body 19
20. TYPES OF GOOGLE RICH RESULTS 20 BREADCRUMB ARTICLE SOFTWARE APP
21. TYPES OF GOOGLE RICH RESULTS 21 SITELINKS SEARCHBOX VIDEO REVIEW
22. TYPES OF GOOGLE RICH RESULTS 22 EVENT RECIPE GUIDANCE LOCAL BUSINESS LISTING All types can be found at Google Search Handbook
23. STRUCTURED DATA TESTING TOOL 23
24. DEBUGGING 24
25. CONCLUSION • Some carousels appear at the top of search results list
26. CONCLUSION • Some carousels appear at the top of search results list • Makes a page more easily indexable, provides more accurate and targeted metadata • Case studies show a significant growth of CTR and other metrics • Not only Google supports it
27. RESOURCES • Google Search Testing Tool ◦ https://search.google.com/structured-data/testing-tool/u/0/ • Google Search Console ◦ https://search.google.com/search-console • Search Gallery ◦ https://developers.google.com/search/docs/guides/search-gallery • Stand Out on Google Search Using Structured Data and Search Analytics (Google I/O '17) ◦ https://www.youtube.com/watch?v=B0BA7Tswavs 27
28. QUESTIONS
29. THANK YOU