Add proper Open Graph image metadata

This replaces the placeholder Open Graph image with a dedicated 1200×630
asset and adds the SVG source for future edits.

The base metadata now describes the site and preview image more
accurately, while blog post timestamps use the local publishing timezone
instead of UTC.

2 files changed, 10 insertions, 10 deletions

diff --git a/templates/base.html b/templates/base.html
index 1000014..12e9803 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -8,21 +8,21 @@
         <meta name="viewport" content="width=device-width, initial-scale=1">
         <meta name="color-scheme" content="dark light">
         <meta name="generator" content="lektor">
-        <meta name="description"
-              property="og:description"
-              content="{{ bag('blog.tagline') }}">
-        <meta property="og:site_name" content="dennisfink.me">
+        <meta name="description" content="{{ bag('blog.tagline') }}">
+        <meta property="og:description"  content="{{ bag('blog.tagline') }}">
+        <meta property="og:site_name" content="{{ bag('blog.name') }}">
         <meta property="og:title"
-              content="{%- if (this.title or title) -%}{{ (this.title or title) | safe }} — {% endif -%}{{ bag('blog.name') }}">
+              content="{% if (this.title or title) %}{{ (this.title or title) | safe }}{% else %}{{ bag('blog.name') }}{% endif %}">
         <meta property="og:url"
               content="{{ this | url(absolute=True, external=True) }}">
+        <meta property="og:locale" content="en_US">
         <meta property="og:image"
               content="{{ '/static/images/opengraph.png' | url(absolute=True, external=True) }}">
         <meta property="og:image:type" content="image/png">
-        <meta property="og:image:width" content="32">
-        <meta property="og:image:height" content="32">
+        <meta property="og:image:width" content="1200">
+        <meta property="og:image:height" content="630">
         <meta property="og:image:alt"
-              content="Logo of the site showing a second-order Hilbert curve segment drawn as a continuous right-angled line inside a rounded square, with both colored in muted green">
+              content="Muted green Hilbert-curve logo beside the words “Still Thinking About It” on a dark blue background">
         <meta name="fediverse:creator" content="@me@dennisfink.me">
       {% endblock meta %}
       {% block styles %}
diff --git a/templates/blog-post.html b/templates/blog-post.html
index 6ffb600..0844351 100644
--- a/templates/blog-post.html
+++ b/templates/blog-post.html
@@ -8,11 +8,11 @@
   <meta property="article:author" content="https://dennisfink.me/about">
   {% if this.publication_date %}
     <meta property="article:published_time"
-          content="{{ this.publication_date }}T00:00:00Z">
+          content="{{ this.publication_date }}T00:00:00+02:00">
   {% endif %}
   {% if this.updated_date %}
     <meta property="article:modified_time"
-          content="{{ this.updated_date }}T00:00:0Z">
+          content="{{ this.updated_date }}T00:00:00+02:00">
   {% endif %}
   {% if this.category %}
     {% set category = site.get("/categories/" + this.category) %}