Eigener Suchtitel, Schriften lokal, Bilder in Anzeigegroesse

Getrennter Titel fuer Suchergebnisse je Seite und Beitrag (Migration
20260913000100): auf der Seite steht "Leistungen", im Suchergebnis darf
der lange Titel stehen. Leer heisst weiterhin: der Titel der Seite.

Schriften kommen jetzt vom eigenen Server. Ein Knopf im Designbereich
oder cms:fonts:fetch holt die gewaehlten Google-Schnitte als WOFF2 nach
public/assets/fonts. Das spart zwei fremde Verbindungen nacheinander
(gemessen 820 ms) und die IP-Weitergabe an Google. Ohne Dateien bleibt
es beim bisherigen Verweis - eine Seite ohne Schrift waere schlimmer.

Ein Stylesheet statt vier, mit Pruefsumme im Namen und ohne Kommentare,
dazu eine .htaccess mit Kompression, Cache und Schutz interner Dateien.
Der Entwicklungsserver sendet dieselben Kopfzeilen, sonst misst man
lokal etwas, das es im Betrieb nicht gibt.

Bilder in der Groesse, in der sie erscheinen: ein nur fuer Desktop
gesetztes Hintergrundbild gilt auf dem Telefon in Telefongroesse
(189 KB -> 40 KB), img nennt seine feste Breite oder sizes="auto", und
fetchpriority liegt auf dem ersten Bild des Inhalts statt auf dem Logo.

Neu: npm run test:links prueft jeden internen Verweis auf seine
Antwort. Lighthouse gegen den Nachbau: Barrierefreiheit, Best
Practices und SEO 100 auf allen vier geprueften Adressen, Performance
100 ausser auf der bilderreichen Startseite (98 mobil, 96 Desktop).

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

templates/page.html.twig

@@ -3,11 +3,13 @@
 <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>{{ page.document.title }}</title>
+    {# Der Titel fuer die Suche, sonst der Titel der Seite. #}
+    {% set seoTitle = page.seo_title|default('') ?: page.document.title %}
+    <title>{{ seoTitle }}</title>
     <meta name="description" content="{{ page.document.description }}">
     <link rel="canonical" href="{{ canonical }}">
     {% if page.robots|default('index') != 'index' %}<meta name="robots" content="noindex, follow">{% endif %}
-    <meta property="og:title" content="{{ page.document.title }}">
+    <meta property="og:title" content="{{ seoTitle }}">
     <meta property="og:description" content="{{ page.document.description }}">
     <meta property="og:type" content="{{ page.type|default('page') == 'post' ? 'article' : 'website' }}">
     <meta property="og:url" content="{{ canonical }}">
@@ -23,14 +25,24 @@
     <meta name="twitter:card" content="summary">
     {% endif %}
     {% include 'favicon.html.twig' %}
-    <link rel="stylesheet" href="/assets/site.css">
-    {% if googleFonts|default(null) %}<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link rel="stylesheet" href="{{ googleFonts }}">{% endif %}
+    {# Ein Bündel statt vier Dateien: jede einzelne hält das Zeichnen der Seite auf. Fehlt es
+       (kein Schreibrecht im Ordner), werden die Quellen einzeln geladen - langsamer, aber heil. #}
+    {% if styleBundle|default(null) %}
+    <link rel="stylesheet" href="{{ styleBundle }}">
+    {% else %}
+    <link rel="stylesheet" href="/assets/site.css?v={{ kant_version() }}">
+    {% if localFonts|default([]) %}<link rel="stylesheet" href="/assets/fonts/fonts.css?v={{ kant_version() }}">{% endif %}
+    {% if page.document.schemaVersion >= 2 %}<link rel="stylesheet" href="/assets/design.css?v={{ kant_version() }}">{% endif %}
+    {% if page.document.schemaVersion >= 3 %}<link rel="stylesheet" href="/assets/enhancements.css?v={{ kant_version() }}">{% endif %}
+    {% endif %}
+    {% if localFonts|default([]) %}
+    {# Die wichtigsten Schnitte vorab, damit die erste Zeile in der richtigen Schrift steht. #}
+    {% for font in localFonts %}<link rel="preload" href="{{ font }}" as="font" type="font/woff2" crossorigin>{% endfor %}
+    {% elseif googleFonts|default(null) %}<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link rel="stylesheet" href="{{ googleFonts }}">{% endif %}
 {% if hasPosts|default(false) %}    <link rel="alternate" type="application/rss+xml" title="Beiträge" href="/feed.xml">
 {% endif %}
-    {% if page.document.schemaVersion >= 2 %}<link rel="stylesheet" href="/assets/design.css">{% endif %}
-    {% if page.document.schemaVersion >= 3 %}<link rel="stylesheet" href="/assets/enhancements.css">{% endif %}
-    {% if needsTabs|default(false) %}<script src="/assets/tabs.js" defer></script>{% endif %}
-    {% if needsSlider|default(false) %}<script src="/assets/slider.js" defer></script>{% endif %}
+    {% if needsTabs|default(false) %}<script src="/assets/tabs.js?v={{ kant_version() }}" defer></script>{% endif %}
+    {% if needsSlider|default(false) %}<script src="/assets/slider.js?v={{ kant_version() }}" defer></script>{% endif %}
     {# Own scripts of this page, as a file. Never rendered in the editor preview: the preview must
        show the layout, not run code that could change the page under the editor's hands. #}
     {% if pageScript|default(null) and not editing|default(false) %}<script src="{{ pageScript }}" defer></script>{% endif %}
@@ -52,7 +64,7 @@
        instead of being written into this template. #}
     {% if areas.header|default(null) %}
     <header class="site-header{{ siteSettings.load().stickyHeader ? ' is-sticky' : '' }}">
-        {% for block in areas.header.blocks %}{% include 'blocks/block.html.twig' with {block: block, editing: editing|default(false), postLists: {}, forms: {}, breadcrumbs: [], navigation: navigation|default({}), sections: sections|default({}), richText: areas.header.schemaVersion|default(1) >= 12, richHeadings: areas.header.schemaVersion|default(1) >= 17, eagerImage: eagerImage|default(null)} only %}{% endfor %}
+        {% for block in areas.header.blocks %}{% include 'blocks/block.html.twig' with {block: block, editing: editing|default(false), postLists: {}, forms: {}, breadcrumbs: [], navigation: navigation|default({}), sections: sections|default({}), richText: areas.header.schemaVersion|default(1) >= 12, richHeadings: areas.header.schemaVersion|default(1) >= 17, eagerImage: eagerImage|default(null), inHeader: true} only %}{% endfor %}
     </header>
     {% endif %}
     <main id="main" tabindex="-1">