SEOhhhhh yeah!

I’ve thrown every Open Graph I can find at this thing. See you on the
SERPs!

Author: csswizardry

demo/index.html

@@ -193,13 +193,17 @@
     gtag('config', 'G-DNCL1RY4GT');
   </script>
 
+  <meta name=title content="Obs.js – context-aware web performance for everyone">
+  <meta name=description content="Obs.js reads device and network signals and allows you to build adaptive user experiences.">
+  <meta name=author content="Harry Roberts">
+  <meta name=theme-color content="#009aa2">
+  <meta name=robots content="index, follow, max-image-preview:large">
   <link rel=icon href=./assets/icon.png>
 
 
 
 
 
-
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510 164.36" role="img" aria-labelledby="logo-title">
     <title id="logo-title">Obs.js Logo</title>
     <defs>
@@ -490,3 +494,113 @@ <h2><code>&lt;video&gt;</code> Demo</h2>
       }
     })();
   </script>
+
+  <meta property=og:site_name content="CSS Wizardry">
+  <meta property=og:type content="website">
+  <meta property=og:locale content="en_GB">
+  <meta property=og:title content="Obs.js – context-aware web performance for everyone">
+  <meta property=og:description content="Obs.js reads device and network signals and allows you to build adaptive user experiences.">
+  <meta property=og:url content="https://csswizardry.com/Obs.js/demo/">
+  <meta property=og:image content="https://csswizardry.com/Obs.js/demo/assets/poster.png">
+  <meta property=og:image:width content="1500">
+  <meta property=og:image:height content="996">
+  <meta property=og:image:type content="image/png">
+  <meta property=og:image:alt content="Obs.js demo page with video poster frame showing context-aware performance demo">
+
+  <meta name=twitter:card content="summary_large_image">
+  <meta name=twitter:site content="@csswizardry">
+  <meta name=twitter:creator content="@csswizardry">
+  <meta name=twitter:domain content="csswizardry.com">
+  <meta name=twitter:title content="Obs.js – context-aware web performance for everyone">
+  <meta name=twitter:description content="Obs.js reads device and network signals and allows you to build adaptive user experiences.">
+  <meta name=twitter:image content="https://csswizardry.com/Obs.js/demo/assets/poster.png">
+  <meta name=twitter:image:alt content="Obs.js demo page with video poster frame showing context-aware performance demo">
+
+  <script type=application/ld+json>
+    {
+      "@context": "https://schema.org",
+      "@graph": [
+        {
+          "@type": "WebSite",
+          "@id": "https://csswizardry.com/#website",
+          "url": "https://csswizardry.com/",
+          "name": "CSS Wizardry",
+          "publisher": {
+            "@type": "Person",
+            "@id": "https://csswizardry.com/#harry"
+          }
+        },
+        {
+          "@type": "WebPage",
+          "@id": "https://csswizardry.com/Obs.js/demo/#webpage",
+          "url": "https://csswizardry.com/Obs.js/demo/",
+          "name": "Obs.js – context-aware web performance for everyone",
+          "inLanguage": "en-GB",
+          "isPartOf": {
+            "@id": "https://csswizardry.com/#website"
+          },
+          "primaryImageOfPage": {
+            "@type": "ImageObject",
+            "@id": "https://csswizardry.com/Obs.js/demo/assets/poster.png#primaryimage",
+            "url": "https://csswizardry.com/Obs.js/demo/assets/poster.png",
+            "width": 1500,
+            "height": 996,
+            "encodingFormat": "image/png"
+          },
+          "description": "Obs.js reads device and network signals and allows you to build adaptive user experiences.",
+          "breadcrumb": {
+            "@type": "BreadcrumbList",
+            "itemListElement": [
+              {
+                "@type": "ListItem",
+                "position": 1,
+                "name": "Home",
+                "item": "https://csswizardry.com/"
+              },
+              {
+                "@type": "ListItem",
+                "position": 2,
+                "name": "Obs.js",
+                "item": "https://github.com/csswizardry/Obs.js"
+              },
+              {
+                "@type": "ListItem",
+                "position": 3,
+                "name": "Demo",
+                "item": "https://csswizardry.com/Obs.js/demo/"
+              }
+            ]
+          }
+        },
+        {
+          "@type": "SoftwareSourceCode",
+          "@id": "https://github.com/csswizardry/Obs.js#code",
+          "name": "Obs.js",
+          "codeRepository": "https://github.com/csswizardry/Obs.js",
+          "programmingLanguage": "JavaScript",
+          "license": "https://opensource.org/license/mit/",
+          "author": {
+            "@id": "https://csswizardry.com/#harry"
+          },
+          "creator": {
+            "@id": "https://csswizardry.com/#harry"
+          },
+          "publisher": {
+            "@id": "https://csswizardry.com/#harry"
+          },
+          "image": "https://csswizardry.com/Obs.js/demo/assets/poster.png",
+          "url": "https://csswizardry.com/Obs.js/demo/"
+        },
+        {
+          "@type": "Person",
+          "@id": "https://csswizardry.com/#harry",
+          "name": "Harry Roberts",
+          "url": "https://csswizardry.com/",
+          "sameAs": [
+            "https://twitter.com/csswizardry",
+            "https://github.com/csswizardry"
+          ]
+        }
+      ]
+    }
+  </script>