Nostr WoT
AnkündigungWidgetsNostrEinbettbarSEO

Vorstellung der Nostr Widgets

Wir haben Nostr Widgets veröffentlicht: ein kleines Set einbettbarer, serverseitig gerenderter SVG-Komponenten für jede Website. Ein <a><img></a>-Snippet platziert eine Profilkarte, einen Follow-Button oder einen Live-Feed in deinem Blog, README oder Landing — und der Link zeigt zurück auf nostr-wot.com.

Leon Acosta

Leon Acosta

·4 min read
Vorstellung der Nostr Widgets

Du schreibst einen Blogpost. Du willst deine Leser auf dein Nostr-Profil verweisen. Heute hast du zwei Optionen: einen langen npub reinkopieren und hoffen, dass die Leute damit etwas anfangen können, oder ein JavaScript-SDK einbinden, das praktisch einen ganzen Nostr-Client laufen lässt, nur um einen Avatar zu zeigen.

Beides ist nicht ideal. Also haben wir Nostr Widgets gebaut.

Was es ist

Ein Widget ist ein serverseitig gerendertes SVG. Du bettest es mit einer HTML-Zeile ein:

html
<a href="https://nostr-wot.com/p/npub1gxdhmu9..." target="_blank" rel="noopener">
  <img
    src="https://nostr-wot.com/widgets/profile/npub1gxdhmu9..."
    alt="Leon Acosta auf Nostr"
    width="320"
    height="220"
  />
</a>

Das war's. Kein <script>-Tag, kein iFrame, kein JavaScript-Framework. Das Bild ist ein statisches SVG, das auf unserem Server aus aktuellen Nostr-Daten generiert, aggressiv gecacht und mit korrekten Cache-Control- und ETag-Headern ausgeliefert wird. Es funktioniert in Static-Site-Generatoren, in Notion, in Substack, in GitHub-READMEs und in jedem markdown-fähigen Editor, der Bilder erlaubt.

Drei Varianten, je ein Snippet

Jedes Widget ist ein echtes <img> eines echten SVG. Das macht es zugänglich, indexierbar und robust — falls der Widget-Service jemals offline ist, funktioniert das umgebende <a> immer noch.

1. Profilkarte

Eine in sich geschlossene Karte mit Avatar, Name, NIP-05, Bio und einem "Follow on Nostr"-CTA. 320×220, feste Maße, kein Layout-Sprung. Nutze sie in Autorenbios, Sidebars oder "Find me on Nostr"-Sektionen.

2. Follow-Button

Ein pillenförmiger Button, der direkt auf das Profil des Nutzers auf nostr-wot.com verweist. 220×44. Setze ihn neben deine anderen Social-Buttons (Twitter, LinkedIn, GitHub).

3. Feed-Strip

Die letzten 1–5 Kurznotizen des Autors, vertikal aufgelistet. Jede Notiz zeigt Avatar, Name, Zeitstempel und die erste Zeile des Inhalts. 320×variable Höhe. Setze es dorthin, wo du sonst "Latest Tweets" hättest — nur dezentral und mit Link zu einem Nostr-Profil, nicht zu einer Konzernplattform.

Warum das für SEO zählt

Wenn du ein Widget einbettest, zeigt das umgebende <a> auf nostr-wot.com. Für Suchmaschinen-Crawler ist das ein Inbound-Link von deiner Domain auf unsere. Je mehr Seiten Nostr Widgets adoptieren, desto mehr Link-Authority sammelt sich im Link-Graphen, der Web of Trust auf Nostr antreibt — was Nostr-Profile auch über Google leichter auffindbar macht, nicht nur in Nostr-Clients.

Das ist kein Zufall. Der ganze Punkt der Widgets ist, dass sie link-freundlich sind: echte Anchor-Tags, die auf echte URLs zeigen, keine iFrames, die das Ziel vor den Crawlern verstecken.

Was NICHT drin ist (mit Absicht)

Widgets sind statisches SVG. Es gibt keinen Tracking-Pixel, kein JavaScript-Fingerprinting, keinen Impressions-Counter. Wir wissen nicht, wer was eingebettet hat oder wie oft es angesehen wird — und das ist gut so.

  • Keine iFrames. iFrames vererben Crawlern keine Link-Authority, und sie führen ein Same-Origin-Risiko ein, das wir nicht eingehen wollen.
  • Kein JavaScript auf der Embed-Seite. Ein Drittanbieter-<script> auf deiner Seite ist ein Sicherheits- und Performance-Risiko. SVG ist ein <img>. Es kann keine Cookies lesen, keinen Code ausführen, nichts außer Pixel zeichnen.
  • Keine Theme-Parameter am ersten Tag. Ein durchdachter Default pro Widget-Variante. Vielleicht kommt ?theme=light|dark später, falls Nachfrage besteht.

Wie es unter der Haube funktioniert

Der Widget-Service ist ein kleiner Node-Prozess hinter nginx auf demselben VPS, der nostr-wot.com ausliefert. Wenn ein Crawler oder Browser /widgets/profile/<npub> anfordert:

  1. Wir lösen den npub zu einem Hex-Pubkey auf.
  2. Wir holen das letzte kind 0 (Profil) und kind 3 (Follow-Liste) des Nutzers aus einem SimplePool von Nostr-Relays.
  3. Wir rendern einen SVG-String mit den eingebetteten Daten — Text, Geometrie, eingebetteter Avatar (96×96 base64-PNG, mit sharp skaliert).
  4. Wir senden ihn zurück mit Cache-Control: public, max-age=300, stale-while-revalidate=86400 und einem ETag.

Ein kleiner In-Memory-LRU fängt doppelte Requests ab. Der Relay-Pool wird zwischen Widgets geteilt, sodass der zweite Request für dasselbe Profil praktisch kostenlos ist.

Open Source

Der Renderer (@nostr-widgets/renderer) und der Server (apps/server) sind beide MIT-lizenziert und liegen im nostr-widgets-Repository. Du kannst den Service selbst hosten, wenn du nicht von nostr-wot.com abhängig sein willst, oder eine neue Widget-Variante (Zap-Badge? Lightning-Address-Karte? Feed mit Tag-Filter?) per PR beitragen.

Loslegen

Such dir deinen npub aus, wähl ein Widget, kopier das Snippet:

  • Profilkarte — https://nostr-wot.com/widgets/profile/<npub>
  • Follow-Button — https://nostr-wot.com/widgets/follow/<npub>
  • Feed-Strip — https://nostr-wot.com/widgets/feed/<npub>?limit=3

Besuch die Widget-Galerie für Live-Previews und Copy-Paste-fertige Snippets.

Feedback? Antworte auf Nostr oder öffne ein Issue auf GitHub.

Leon Acosta

Geschrieben von

Leon Acosta

Auf Nostr ansehen →

Verwandte Beiträge

Stay Updated

Get the latest on new features, trust assertions, and services integration as they ship.

No spam, ever. Unsubscribe anytime.