🔍 robots and other optimizations

templates/archive.html

@@ -24,7 +24,8 @@
                 <a href="{{ url_for('comic', comic_id=comic.number) }}">
                     <img src="{{ url_for('static', filename='images/thumbs/' + comic.filename) }}"
                          onerror="this.onerror=null; this.src='{{ url_for('static', filename='images/thumbs/default.jpg') }}';"
-                         alt="{{ comic.title if comic.title else '#' ~ comic.number }}">
+                         alt="{{ comic.title if comic.title else '#' ~ comic.number }}"
+                         loading="lazy">
                     <div class="archive-info">
                         {% if not archive_full_width %}
                         <h3>#{{ comic.number }}{% if comic.title %}: {{ comic.title }}{% endif %}</h3>

templates/base.html

@@ -7,6 +7,7 @@
 
     <!-- SEO Meta Tags -->
     <meta name="description" content="{% block meta_description %}A webcomic about life, the universe, and everything{% endblock %}">
+    <link rel="canonical" href="{% block canonical %}{{ site_url }}{{ request.path }}{% endblock %}">
 
     <!-- Open Graph / Facebook -->
     <meta property="og:type" content="website">

templates/comic.html

@@ -4,6 +4,27 @@
 
 {% block og_image %}{{ site_url }}/static/images/thumbs/{{ comic.filename }}{% endblock %}
 
+{% block extra_css %}
+<script type="application/ld+json">
+{
+  "@context": "https://schema.org",
+  "@type": "ComicStory",
+  "name": "{{ comic.title if comic.title else '#' ~ comic.number }}",
+  "datePublished": "{{ comic.date }}",
+  "image": "{{ site_url }}/static/images/comics/{{ comic.filename }}",
+  "thumbnailUrl": "{{ site_url }}/static/images/thumbs/{{ comic.filename }}",
+  "description": "{{ comic.alt_text }}",
+  "isPartOf": {
+    "@type": "ComicSeries",
+    "name": "{{ comic_name }}",
+    "url": "{{ site_url }}"
+  },
+  "position": "{{ comic.number }}",
+  "url": "{{ site_url }}/comic/{{ comic.number }}"
+}
+</script>
+{% endblock %}
+
 {% block content %}
 <!-- ARIA live region for screen reader announcements -->
 <div aria-live="polite" aria-atomic="true" class="sr-only" id="comic-announcer"></div>
@@ -29,7 +50,8 @@
             {% else %}
             <img src="{{ url_for('static', filename='images/comics/' + comic.filename) }}"
                  alt="{{ comic.title if comic.title else '#' ~ comic.number }}"
-                 title="{{ comic.alt_text }}">
+                 title="{{ comic.alt_text }}"
+                 loading="eager">
             {% endif %}
         </a>
         {% else %}
@@ -43,7 +65,8 @@
             {% else %}
             <img src="{{ url_for('static', filename='images/comics/' + comic.filename) }}"
                  alt="{{ comic.title if comic.title else '#' ~ comic.number }}"
-                 title="{{ comic.alt_text }}">
+                 title="{{ comic.alt_text }}"
+                 loading="eager">
             {% endif %}
         {% endif %}
     </div>