SEO optimizations

rraue · mrstegeman · commit 4da90c24ebff · 2020-01-08T10:14:04.000-09:00
References #49
diff --git a/about/index.html b/about/index.html
@@ -2,7 +2,8 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Mozilla IoT - About</title>
+    <title>About - Mozilla IoT</title>
+    <link rel="canonical" href="https://iot.mozilla.org/about/">
     <link rel="icon" href="../images/icon.png" type="image/png" />
     <link rel="stylesheet" type="text/css" href="/protocol/protocol/css/protocol.css" />
     <link rel="stylesheet" type="text/css" href="/protocol/protocol/css/protocol-extra.css" />
@@ -26,7 +27,7 @@
     <div class="mzp-c-navigation">
       <div class="mzp-c-navigation-l-content">
         <div class="mzp-c-navigation-container">
-          <div class="mzp-c-navigation-logo"><a id="wordmark" href="/">Mozilla</a></div>
+          <div class="mzp-c-navigation-logo"><a id="wordmark" href="https://iot.mozilla.org">Mozilla</a></div>
           <button class="mzp-c-navigation-menu-button" type="button" aria-controls="patterns.organisms.navigation.navigation">Menu</button>
 
           <div class="mzp-c-navigation-items" id="patterns.organisms.navigation.navigation">
@@ -35,16 +36,16 @@
               <nav class="mzp-c-menu mzp-is-basic">
                 <ul class="mzp-c-menu-category-list">
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/about"><strong>About</strong></a>
+                    <a class="mzp-c-menu-title" href="/about/"><strong>About</strong></a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/gateway">Gateway</a>
+                    <a class="mzp-c-menu-title" href="/gateway/">Gateway</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/framework">Framework</a>
+                    <a class="mzp-c-menu-title" href="/framework/">Framework</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/community">Community</a>
+                    <a class="mzp-c-menu-title" href="/community/">Community</a>
                   </li>
                   <li class="mzp-c-menu-category">
                     <a class="mzp-c-menu-title" href="https://hacks.mozilla.org/category/web-of-things/">Blog</a>
@@ -91,10 +92,10 @@ <h2>WebThings Gateway</h2>
         <p>It provides a web-based user interface to monitor and control smart home devices, a rules engine to automate them and an add-ons system to extend the gateway with support for a wide range of existing smart home devices.</p>
 
         <h2>WebThings Framework</h2>
-        <p><a href="/framework">WebThings Framework</a> is a collection of re-usable software components to help developers build their own web things which directly expose the <a href="/wot/">Web Thing API.</a></p>
+        <p><a href="/framework/">WebThings Framework</a> is a collection of re-usable software components to help developers build their own web things which directly expose the <a href="/wot/">Web Thing API.</a></p>
         <img class="illustration" src="images/framework.png" alt="framework" />
         <p>It includes implementations in a range of programming languages including Node.js, Python, Java, Rust and C++ (for Arduino).</p>
-        <p>You can learn more about Mozilla WebThings in our <a href="/docs">online documentation</a>.</p>
+        <p>You can learn more about Mozilla WebThings in our <a href="/docs/">online documentation</a>.</p>
     </main>
 
     <footer class="mzp-c-footer">
diff --git a/community/index.html b/community/index.html
@@ -2,7 +2,8 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Mozilla IoT - Community</title>
+    <title>Community - Mozilla IoT</title>
+    <link rel="canonical" href="https://iot.mozilla.org/community/">
     <link rel="icon" href="../images/icon.png" type="image/png" />
     <link rel="stylesheet" type="text/css" href="/protocol/protocol/css/protocol.css" />
     <link rel="stylesheet" type="text/css" href="/protocol/protocol/css/protocol-extra.css" />
@@ -26,7 +27,7 @@
     <div class="mzp-c-navigation">
       <div class="mzp-c-navigation-l-content">
         <div class="mzp-c-navigation-container">
-          <div class="mzp-c-navigation-logo"><a id="wordmark" href="/">Mozilla</a></div>
+          <div class="mzp-c-navigation-logo"><a id="wordmark" href="https://iot.mozilla.org">Mozilla</a></div>
           <button class="mzp-c-navigation-menu-button" type="button" aria-controls="patterns.organisms.navigation.navigation">Menu</button>
 
           <div class="mzp-c-navigation-items" id="patterns.organisms.navigation.navigation">
@@ -35,16 +36,16 @@
               <nav class="mzp-c-menu mzp-is-basic">
                 <ul class="mzp-c-menu-category-list">
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/about">About</a>
+                    <a class="mzp-c-menu-title" href="/about/">About</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/gateway">Gateway</a>
+                    <a class="mzp-c-menu-title" href="/gateway/">Gateway</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/framework">Framework</a>
+                    <a class="mzp-c-menu-title" href="/framework/">Framework</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/community"><strong>Community</strong></a>
+                    <a class="mzp-c-menu-title" href="/community/"><strong>Community</strong></a>
                   </li>
                   <li class="mzp-c-menu-category">
                     <a class="mzp-c-menu-title" href="https://hacks.mozilla.org/category/web-of-things/">Blog</a>
diff --git a/framework/index.html b/framework/index.html
@@ -2,7 +2,8 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Mozilla IoT - WebThings Framework</title>
+    <title>WebThings Framework - Mozilla IoT</title>
+    <link rel="canonical" href="https://iot.mozilla.org/framework/">
     <link rel="icon" href="../images/icon.png" type="image/png" />
     <link rel="stylesheet" type="text/css" href="/protocol/protocol/css/protocol.css" />
     <link rel="stylesheet" type="text/css" href="/protocol/protocol/css/protocol-extra.css" />
@@ -15,7 +16,7 @@
     <meta property="og:title" content="WebThings Framework by Mozilla" />
     <meta property="og:description" content="Build your own web things" />
     <meta property="og:type" content="website" />
-    <meta property="og:url" content="https://iot.mozilla.org/framework" />
+    <meta property="og:url" content="https://iot.mozilla.org/framework/" />
     <meta property="og:image" content="https://iot.mozilla.org/framework/images/webthings_framework_banner.png" />
     <script src="/protocol/protocol/js/protocol-base.js"></script>
     <script src="/protocol/protocol/js/protocol-utils.js"></script>
@@ -29,7 +30,7 @@
     <div class="mzp-c-navigation">
       <div class="mzp-c-navigation-l-content">
         <div class="mzp-c-navigation-container">
-          <div class="mzp-c-navigation-logo"><a id="wordmark" href="/">Mozilla</a></div>
+          <div class="mzp-c-navigation-logo"><a id="wordmark" href="https://iot.mozilla.org">Mozilla</a></div>
           <button class="mzp-c-navigation-menu-button" type="button" aria-controls="patterns.organisms.navigation.navigation">Menu</button>
 
           <div class="mzp-c-navigation-items" id="patterns.organisms.navigation.navigation">
@@ -38,16 +39,16 @@
               <nav class="mzp-c-menu mzp-is-basic">
                 <ul class="mzp-c-menu-category-list">
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/about">About</a>
+                    <a class="mzp-c-menu-title" href="/about/">About</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/gateway">Gateway</a>
+                    <a class="mzp-c-menu-title" href="/gateway/">Gateway</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/framework"><strong>Framework</strong></a>
+                    <a class="mzp-c-menu-title" href="/framework/"><strong>Framework</strong></a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/community">Community</a>
+                    <a class="mzp-c-menu-title" href="/community/">Community</a>
                   </li>
                   <li class="mzp-c-menu-category">
                     <a class="mzp-c-menu-title" href="https://hacks.mozilla.org/category/web-of-things/">Blog</a>
diff --git a/gateway/index.html b/gateway/index.html
@@ -2,7 +2,8 @@
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Mozilla IoT - WebThings Gateway</title>
+    <title>WebThings Gateway - Mozilla IoT</title>
+    <link rel="canonical" href="https://iot.mozilla.org/gateway/">
     <link rel="icon" href="../images/icon.png" type="image/png" />
     <link rel="stylesheet" type="text/css" href="/protocol/protocol/css/protocol.css" />
     <link rel="stylesheet" type="text/css" href="/protocol/protocol/css/protocol-extra.css" />
@@ -14,7 +15,7 @@
     <meta property="og:title" content="WebThings Gateway by Mozilla" />
     <meta property="og:description" content="Build your own Web of Things gateway" />
     <meta property="og:type" content="website" />
-    <meta property="og:url" content="https://iot.mozilla.org/gateway" />
+    <meta property="og:url" content="https://iot.mozilla.org/gateway/" />
     <meta property="og:image" content="https://iot.mozilla.org/gateway/images/webthings_gateway_banner.png" />
     <script src="/protocol/protocol/js/protocol-base.js"></script>
     <script src="/protocol/protocol/js/protocol-utils.js"></script>
@@ -44,7 +45,7 @@
     <div class="mzp-c-navigation">
       <div class="mzp-c-navigation-l-content">
         <div class="mzp-c-navigation-container">
-          <div class="mzp-c-navigation-logo"><a id="wordmark" href="/">Mozilla</a></div>
+          <div class="mzp-c-navigation-logo"><a id="wordmark" href="https://iot.mozilla.org">Mozilla</a></div>
           <button class="mzp-c-navigation-menu-button" type="button" aria-controls="patterns.organisms.navigation.navigation">Menu</button>
 
           <div class="mzp-c-navigation-items" id="patterns.organisms.navigation.navigation">
@@ -53,16 +54,16 @@
               <nav class="mzp-c-menu mzp-is-basic">
                 <ul class="mzp-c-menu-category-list">
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/about">About</a>
+                    <a class="mzp-c-menu-title" href="/about/">About</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/gateway"><strong>Gateway</strong></a>
+                    <a class="mzp-c-menu-title" href="/gateway/"><strong>Gateway</strong></a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/framework">Framework</a>
+                    <a class="mzp-c-menu-title" href="/framework/">Framework</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/community">Community</a>
+                    <a class="mzp-c-menu-title" href="/community/">Community</a>
                   </li>
                   <li class="mzp-c-menu-category">
                     <a class="mzp-c-menu-title" href="https://hacks.mozilla.org/category/web-of-things/">Blog</a>
diff --git a/index.html b/index.html
@@ -3,6 +3,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>Mozilla IoT</title>
+    <link rel="canonical" href="https://iot.mozilla.org">
     <link rel="icon" href="images/icon.png" type="image/png" />
     <link rel="stylesheet" type="text/css" href="/protocol/protocol/css/protocol.css" />
     <link rel="stylesheet" type="text/css" href="/protocol/protocol/css/protocol-extra.css" />
@@ -25,7 +26,7 @@
     <div class="mzp-c-navigation">
       <div class="mzp-c-navigation-l-content">
         <div class="mzp-c-navigation-container">
-          <div class="mzp-c-navigation-logo"><a id="wordmark" href="/">Mozilla</a></div>
+          <div class="mzp-c-navigation-logo"><a id="wordmark" href="https://iot.mozilla.org">Mozilla</a></div>
           <button class="mzp-c-navigation-menu-button" type="button" aria-controls="patterns.organisms.navigation.navigation">Menu</button>
 
           <div class="mzp-c-navigation-items" id="patterns.organisms.navigation.navigation">
@@ -34,16 +35,16 @@
               <nav class="mzp-c-menu mzp-is-basic">
                 <ul class="mzp-c-menu-category-list">
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/about">About</a>
+                    <a class="mzp-c-menu-title" href="/about/">About</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/gateway">Gateway</a>
+                    <a class="mzp-c-menu-title" href="/gateway/">Gateway</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/framework">Framework</a>
+                    <a class="mzp-c-menu-title" href="/framework/">Framework</a>
                   </li>
                   <li class="mzp-c-menu-category">
-                    <a class="mzp-c-menu-title" href="/community">Community</a>
+                    <a class="mzp-c-menu-title" href="/community/">Community</a>
                   </li>
                   <li class="mzp-c-menu-category">
                     <a class="mzp-c-menu-title" href="https://hacks.mozilla.org/category/web-of-things/">Blog</a>
@@ -75,27 +76,27 @@ <h1 class="mzp-c-hero-title">
           </div>
 
           <p class="mzp-c-hero-cta">
-            <a id="cta-button" class="mzp-c-button" href="/about">Learn More</a>
+            <a id="cta-button" class="mzp-c-button" href="/about/">Learn More</a>
           </p>
         </div>
       </div>
     </section>
 
     <section id="gateway-section">
       <h2><strong>WebThings</strong> Gateway</h2>
-      <a href="/gateway"><img src="images/gateway.png" alt="Illustration showing a Raspberry Pi" /></a>
+      <a href="/gateway/"><img src="images/gateway.png" alt="Illustration showing a Raspberry Pi" /></a>
       <p>A software distribution for smart home gateways focused on privacy, security and interoperability </p>
-      <a href="/gateway" class="mzp-c-button mzp-t-secondary mzp-t-small">
+      <a href="/gateway/" class="mzp-c-button mzp-t-secondary mzp-t-small">
         Learn More
       </a>
     </section>
 
     <section id="framework-section">
       <h2><strong>WebThings</strong> Framework</h2>
-      <a href="/framework"><img src="framework/images/things.png" alt="A collection of things" /></a>
+      <a href="/framework/"><img src="framework/images/things.png" alt="A collection of things" /></a>
       <p>A collection of re-usable software components to help
 developers build their own web things</p>
-      <a href="/framework" class="mzp-c-button mzp-t-secondary mzp-t-small mzp-t-dark">
+      <a href="/framework/" class="mzp-c-button mzp-t-secondary mzp-t-small mzp-t-dark">
         Learn More
       </a>
     </section>
