Fünf-Minuten-Fixes, die dich wie einen Profi aussehen lassen

Manche Dinge dauern fünf Minuten, machen aber einen unverhältnismäßig großen Unterschied. Das hier sind die, die ich immer mache — Low-Effort, High-Impact Verbesserungen, die „sieht aus wie ein Wochenendprojekt" von „sieht aus, als wüsste jemand, was er tut" trennen.

Ein richtiges Favicon setzen

Nichts schreit „unfertig" lauter als das Standard-Browser-Icon in einem Tab. Deine Seite kann wunderschön designt sein, aber das fehlende Favicon lässt sie wie einen Entwurf wirken.

Nimm dein Logo (oder auch nur einen einzelnen Buchstaben), jag es durch einen Favicon-Generator, und füge die Dateien ein. Zwei Minuten, und deine Seite wirkt sofort seriöser.

Optimiere deine SVGs

Wenn du SVG-Icons oder Illustrationen verwendest, sind sie wahrscheinlich aufgebläht mit Editor-Metadaten, unnötigen Elementen und redundanten Attributen.

Eine typische SVG-Datei, die aus einem Design-Tool exportiert wurde, ist vielleicht 15KB groß. Nach der Optimierung sind es 3KB. Gleiches visuelles Ergebnis, 80% weniger Daten.

Jag deine SVGs durch einen Optimierer und ersetze die Originale. Deine Seite lädt schneller und niemand merkt den Unterschied.

Minifiziere dein CSS und JavaScript

In der Entwicklung hat dein Code Kommentare, Leerzeichen und beschreibende Variablennamen. Super für die Lesbarkeit.

Für die Produktion? Streiche das alles raus. Minifizierung entfernt alles, was der Browser nicht braucht, und reduziert Dateigrößen um 30-60%.

Die meisten Build-Tools machen das automatisch. Aber wenn du mit Rohdateien arbeitest oder eine einfache Seite ohne Build-Schritt hast, erledigt das ein schneller Code-Minifier.

Fix dein OpenGraph-Bild

Teile die URL deiner Seite auf Slack, Twitter oder iMessage. Was wird angezeigt?

Wenn es eine leere Vorschau oder ein zufälliger Screenshot ist, fehlt dir ein OpenGraph-Bild. Das ist das Bild, das erscheint, wenn jemand deinen Link teilt.

Erstelle ein einfaches 1200x630-Bild mit deinem Seitennamen und einer kurzen Beschreibung. Setze es in deinen HTML-Head. Dauert fünf Minuten und sorgt dafür, dass jeder geteilte Link beabsichtigt aussieht statt kaputt.

Richte ordentliche Fehlerseiten ein

Klick auf einen kaputten Link auf deiner Seite. Was passiert?

Wenn es die Standard-Server-Fehlerseite ist oder ein weißer Bildschirm, behebe das. Eine eigene 404-Seite mit einem Link zurück zur Startseite dauert zehn Minuten und rettet Besucher, die auf toten Links landen.

Halt es einfach: „Diese Seite existiert nicht. Hier sind ein paar Seiten, die es tun."

Komprimiere deine Bilder (nochmal)

Ja, ich weiß, du hast das schon gemacht. Aber hast du die Bilder komprimiert, die du letzte Woche hinzugefügt hast? Und das Kunden-Logo, das als 4MB-PNG per E-Mail kam?

Bildkomprimierung ist keine einmalige Sache. Jedes neue Bild braucht die gleiche Behandlung. Wenn du dich dabei ertappst, es zu überspringen, mach es zu einem Teil deines Workflows — komprimieren vor dem Upload, jedes Mal.

Einen Ladezustand hinzufügen

Wenn deine Seite Daten abruft oder schwere Inhalte lädt, zeig etwas während der Wartezeit. Einen Spinner. Ein Skeleton-Screen. Oder einfach nur „Laden..." in Klartext.

Eine leere Seite für 2 Sekunden fühlt sich kaputt an. Eine Seite mit Spinner für 2 Sekunden fühlt sich normal an. Gleiche Wartezeit, komplett andere Erfahrung.

Prüfe deine Mobile-Ansicht

Öffne deine Seite auf deinem Handy. Schau sie dir wirklich an. Tippe auf die Buttons. Fülle ein Formular aus.

Ich habe wunderschön responsive Seiten gesehen, bei denen der „Absenden"-Button auf dem Handy teilweise hinter der Tastatur versteckt war. Niemand hat es bemerkt, weil niemand auf einem echten Handy getestet hat.

---

Feinschliff bedeutet nicht Perfektion. Es geht darum, die Dinge zu eliminieren, die Leute denken lassen „irgendwas stimmt hier nicht". Ein Favicon, optimierte Assets, saubere Fehlerseiten und eine ordentliche Mobile-Erfahrung. Nichts davon dauert mehr als fünf Minuten, und zusammen sorgen sie dafür, dass alles gewollt wirkt.