mycelium
Relaunch für mycelium.lu, die Website von Katy Fox: Autorin, Künstlerin und Anthropologin aus Luxemburg. Sie arbeitet an der Schnittstelle von Kunst, Ökologie und Systemen, mit Graphic Recording, Katazome (japanischem Schablonenfärben), Texten und Vorträgen über Kollaps, Degrowth und mehr-als-menschliche Welten.
Die alte Seite lief auf WordPress mit dem Page-Builder Divi, im Grunde aber war sie aber eine einzige Seite. Dafür eine Datenbank, ein Theme und Plugins am Leben zu halten und regelmäßig zu aktualisieren, lohnte sich nicht, und jede WordPress-Installation ist heute ein Ziel für Bots, die rund um die Uhr nach veralteten Plugins und schwachen Logins suchen. Also habe ich die Seite statisch neu gebaut und die Gelegenheit für ein Facelift genutzt. Die alte Startseite brauchte 143 KB HTML für knapp 500 Wörter, 27 Skripte und 8 Stylesheets. Der gesamte Code der neuen Seite, inklusive aller 51 Publikationen, ist nur 81 KB.
Der Aufmacher. Die alte Seite öffnete mit Katys Satz in weißen, weit gesperrten Buchstaben über ein abstraktes Foto von aus meiner Makro-Flora Serie. Den Satz und das Bild habe ich behalten und beim Wort genommen: exploring the threads between image and word. Aus den Rändern des Fotos wächst ein Myzel über den Hintergrund, das Bild öffnet sich wie eine geschnittene Schablone, die Buchstaben landen wie Sporen, und ein roter Faden näht sich in Leserichtung durch sie hindurch, abwechselnd über und unter den Buchstaben, wie ein Vorstich. Wo er in die nächste Zeile springt, wird er blass und gestrichelt, wie die Rückseite einer Stickerei. Durch das Myzel laufen kleine rote Signale. Beim Scrollen lösen sich die Buchstaben in unterschiedlichen Tiefen und treiben davon, der Faden dehnt sich mit. Sie weichen dem Mauszeiger aus, und ein Klick auf den Grund lässt neues Myzel wachsen. Alles ist mit Canvas und ein wenig JavaScript gebaut, ohne Bibliotheken. Wer in seinem System „Bewegung reduzieren“ eingestellt hat, sieht das fertige, ruhende Bild.
Die Farben sind eine Variation aus Sanzo Wadas A Dictionary of Color Combinations: Lehm, Indigo und Zinnoberrot.
Der Lehmton war schon der Hintergrund der alten Seite, das Indigo greift Katys Katazome-Stoffe auf, das Rot das Farbband im Foto. Für Überschriften und den Aufmacher habe ich Baskervville gewählt, die nächste freie Verwandte der Mrs Eaves der alten Seite, für den Fließtext Karla. Alles hängt an einer Mittelachse: Ein gestrichelter Faden verbindet die Abschnitte, kleine römische Ziffern markieren sie wie Kapitel, die Zeichnungen tragen Abbildungsnummern wie in einer wissenschaftlichen Arbeit. Der Abschnitt über Indigofärben ist selbst indigo gefärbt.
Publikationen. Die Publikationsliste stand früher nur als PDF auf der Seite. Jetzt steht sie auf derselben Seite, sortiert in sieben Reiter. Sie wird aus einer einfachen Markdown-Datei gepflegt. Ein kleines Node-Skript schreibt sie als reines HTML in die Seite, damit Suchmaschinen und KI-Suchen sie ohne JavaScript lesen können. Ändert sich die Datei, ohne dass das Skript lief, bemerkt die Seite das an einem Fingerabdruck und lädt die neue Fassung nach.
Technik und SEO. Das Foto im Aufmacher wird sofort gemalt und von zwei Lehmflächen freigegeben statt beschnitten, so steht das größte Element nach 0,2 Sekunden. Strukturierte Daten beschreiben Katy als Person, Vorschaubild und Meta-Tags sorgen für ordentliche Links beim Teilen. Eine .htaccess leitet alte WordPress-Adressen um oder meldet sie als gelöscht (410). Die Schriften liegen auf dem eigenen Server, keine Anfrage geht an Google. Die Besucherstatistik läuft über Matomo ohne Cookies.
Zur Übergabe gab es einen Projektbericht als PDF, gesetzt in Farben und Schriften der Seite. Das Foto im Aufmacher ist Micro Flora Abstract (danielgruenfeld.de).
