From 1b309a3a6db6faa124371293a37a85bd5a20a3d5 Mon Sep 17 00:00:00 2001
From: Anirudh Oppiliappan <anirudh@tangled.org>
Date: Mon, 9 Feb 2026 15:39:54 +0200
Subject: [PATCH] appview/pages: improved seo tags for home, repo and profile

Signed-off-by: Anirudh Oppiliappan <anirudh@tangled.org>
---
 appview/pages/templates/layouts/base.html     | 17 ++++++++++++--
 .../pages/templates/layouts/profilebase.html  | 20 +++++++++++++----
 .../pages/templates/repo/fragments/og.html    | 19 ++++++++++++++--
 appview/pages/templates/timeline/home.html    | 22 ++++++++++++++++---
 4 files changed, 67 insertions(+), 11 deletions(-)
diff --git a/appview/pages/templates/layouts/base.html b/appview/pages/templates/layouts/base.html
index 9a81126c..07d995d7 100644
--- a/appview/pages/templates/layouts/base.html
+++ b/appview/pages/templates/layouts/base.html
@@ -4,9 +4,22 @@
         <head>
             <meta charset="UTF-8" />
             <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-            <meta name="description" content="Social coding, but for real this time!"/>
+            <meta name="description" content="The next-generation social coding platform."/>
             <meta name="htmx-config" content='{"includeIndicatorStyles": false}'>
 
+            <!-- Open Graph defaults -->
+            <meta property="og:site_name" content="Tangled" />
+            <meta property="og:type" content="website" />
+            <meta property="og:locale" content="en_US" />
+
+
+            <!-- Keywords -->
+            <meta name="keywords" content="git, code collaboration, AT Protocol, open source, version control, social coding, code hosting" />
+
+            <!-- Author and copyright -->
+            <meta name="author" content="Tangled" />
+            <meta name="robots" content="index, follow" />
+
             <script defer src="/static/htmx.min.js"></script>
             <script defer src="/static/htmx-ext-ws.min.js"></script>
             <script defer src="/static/actor-typeahead.js" type="module"></script>
@@ -26,7 +39,7 @@
             <link rel="preload" href="/static/fonts/InterVariable.woff2" as="font" type="font/woff2" crossorigin />
 
             <link rel="stylesheet" href="/static/tw.css?{{ cssContentHash }}" type="text/css" />
-            <title>{{ block "title" . }}{{ end }} · tangled</title>
+            <title>{{ block "title" . }}{{ end }}</title>
             {{ block "extrameta" . }}{{ end }}
         </head>
         <body class="min-h-screen flex flex-col gap-4 bg-slate-100 dark:bg-gray-900 dark:text-white transition-colors duration-200">
diff --git a/appview/pages/templates/layouts/profilebase.html b/appview/pages/templates/layouts/profilebase.html
index 3c577865..30ee9622 100644
--- a/appview/pages/templates/layouts/profilebase.html
+++ b/appview/pages/templates/layouts/profilebase.html
@@ -3,18 +3,30 @@
 {{ define "extrameta" }}
     {{ $handle := resolve .Card.UserDid }}
     {{ $avatarUrl := profileAvatarUrl .Card.Profile "" }}
+    {{ $description := or .Card.Profile.Description (printf "%s on Tangled" $handle) }}
+    {{ $url := printf "https://tangled.org/%s" $handle }}
+
+    <!-- Open Graph Meta Tags -->
     <meta property="og:title" content="{{ $handle }}" />
     <meta property="og:type" content="profile" />
-    <meta property="og:url" content="https://tangled.org/{{ $handle }}?tab={{ .Active }}" />
-    <meta property="og:description" content="{{ or .Card.Profile.Description $handle }}" />
+    <meta property="og:url" content="{{ $url }}" />
+    <meta property="og:description" content="{{ $description }}" />
     <meta property="og:image" content="{{ $avatarUrl }}" />
     <meta property="og:image:width" content="512" />
     <meta property="og:image:height" content="512" />
-    
+    <meta property="og:image:alt" content="{{ $handle }}'s avatar" />
+    <meta property="profile:username" content="{{ $handle }}" />
+
+    <!-- Twitter Card Meta Tags -->
     <meta name="twitter:card" content="summary" />
     <meta name="twitter:title" content="{{ $handle }}" />
-    <meta name="twitter:description" content="{{ or .Card.Profile.Description $handle }}" />
+    <meta name="twitter:description" content="{{ $description }}" />
     <meta name="twitter:image" content="{{ $avatarUrl }}" />
+    <meta name="twitter:image:alt" content="{{ $handle }}'s avatar" />
+
+    <!-- Additional SEO -->
+    <meta name="description" content="{{ $description }}" />
+    <link rel="canonical" href="{{ $url }}" />
 {{ end }}
 
 {{ define "content" }}
diff --git a/appview/pages/templates/repo/fragments/og.html b/appview/pages/templates/repo/fragments/og.html
index ead2132d..968a7500 100644
--- a/appview/pages/templates/repo/fragments/og.html
+++ b/appview/pages/templates/repo/fragments/og.html
@@ -1,19 +1,34 @@
 {{ define "repo/fragments/og" }}
     {{ $title := or .Title .RepoInfo.FullName }}
-    {{ $description := or .Description .RepoInfo.Description }}
+    {{ $description := or .Description .RepoInfo.Description "A repository on Tangled" }}
     {{ $url := or .Url (printf "https://tangled.org/%s" .RepoInfo.FullName) }}
     {{ $imageUrl := printf "https://tangled.org/%s/opengraph" .RepoInfo.FullName }}
+    {{ $ownerHandle := resolve .RepoInfo.OwnerDid }}
 
+    <!-- Open Graph Meta Tags -->
     <meta property="og:title" content="{{ unescapeHtml $title }}" />
-    <meta property="og:type" content="object" />
+    <meta property="og:type" content="article" />
     <meta property="og:url" content="{{ $url }}" />
     <meta property="og:description" content="{{ $description }}" />
     <meta property="og:image" content="{{ $imageUrl }}" />
     <meta property="og:image:width" content="1200" />
     <meta property="og:image:height" content="600" />
+    <meta property="og:image:alt" content="{{ unescapeHtml $title }}" />
+    <meta property="article:author" content="{{ $ownerHandle }}" />
+    {{ if .RepoInfo.Topics }}
+        {{ range .RepoInfo.Topics }}
+    <meta property="article:tag" content="{{ . }}" />
+        {{ end }}
+    {{ end }}
 
+    <!-- Twitter Card Meta Tags -->
     <meta name="twitter:card" content="summary_large_image" />
     <meta name="twitter:title" content="{{ unescapeHtml $title }}" />
     <meta name="twitter:description" content="{{ $description }}" />
     <meta name="twitter:image" content="{{ $imageUrl }}" />
+    <meta name="twitter:image:alt" content="{{ unescapeHtml $title }}" />
+
+    <!-- Additional SEO -->
+    <meta name="description" content="{{ $description }}" />
+    <link rel="canonical" href="{{ $url }}" />
 {{ end }}
diff --git a/appview/pages/templates/timeline/home.html b/appview/pages/templates/timeline/home.html
index febf520e..995d18fa 100644
--- a/appview/pages/templates/timeline/home.html
+++ b/appview/pages/templates/timeline/home.html
@@ -1,10 +1,26 @@
 {{ define "title" }}tangled &middot; tightly-knit social coding{{ end }}
 
 {{ define "extrameta" }}
-    <meta property="og:title" content="timeline · tangled" />
-    <meta property="og:type" content="object" />
+    <!-- Open Graph Meta Tags -->
+    <meta property="og:title" content="tangled · tightly-knit social coding" />
+    <meta property="og:type" content="website" />
     <meta property="og:url" content="https://tangled.org" />
-    <meta property="og:description" content="tightly-knit social coding" />
+    <meta property="og:description" content="The next-generation social coding platform." />
+    <meta property="og:image" content="https://assets.tangled.network/what-is-tangled-repo.png" />
+    <meta property="og:image:width" content="1200" />
+    <meta property="og:image:height" content="630" />
+
+    <!-- Twitter Card Meta Tags -->
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="Tangled" />
+    <meta name="twitter:description" content="The next-generation social coding platform." />
+    <meta name="twitter:image" content="https://assets.tangled.network/tangled_og.png" />
+
+    <!-- Additional SEO -->
+    <meta name="description" content="The next-generation social coding platform. Host repos on your infrastructure with knots, use stacked pull requests, and run CI with spindles." />
+    <link rel="canonical" href="https://tangled.org" />
+
+
 {{ end }}
 
 
-- 
2.51.2

