Portfolio-Website ohne Programmierung erstellen: Schritt-für-Schritt-Anleitung

Was du bauen wirst und warum es wichtig ist

Eine Portfolio-Website ist ein einfacher, professioneller Ort für deine Arbeit — ein Link, den du überall teilen kannst. Gut gemacht erfüllt sie drei Aufgaben gleichzeitig: sie schafft Vertrauen, zeigt echte Belege und macht es leicht, dich zu kontaktieren.

Was eine Portfolio-Seite erreichen sollte

Glaubwürdigkeit: Wenn jemand deinen Namen sucht oder auf deinen Link klickt, sollte er sofort eine saubere, konsistente Präsentation sehen, die „echt“ wirkt. Eine persönliche Website signalisiert, dass du deine Arbeit ernst nimmst.

Anfragen (Chancen): Deine Seite sollte Besucher zu einem klaren nächsten Schritt führen — dir eine E-Mail zu schicken, einen Call zu buchen, ein Angebot anzufragen oder den Lebenslauf herunterzuladen. Wenn Leute deine Arbeit mögen, aber nicht wissen, wie sie dich erreichen, erfüllt die Seite ihre Aufgabe nicht.

Arbeitsnachweis: Social Feeds und Marktplätze sind nützlich, zeigen aber nicht immer deine beste Arbeit im Kontext. Dein Online-Portfolio erlaubt es dir, Ziel, Rolle und Ergebnis zu erklären — so verstehen Besucher, was du tatsächlich leisten kannst.

Für wen dieser Leitfaden ist

Dieser Schritt-für-Schritt-Ansatz richtet sich an Menschen, die eine No‑Code-Portfolio-Website schnell veröffentlichen wollen:

• Designer und Fotografen, die ein visuelles Online-Portfolio brauchen
• Texter und Marketer, die Proben und Case Studies zeigen wollen
• Studierende und Jobsuchende, die eine polierte persönliche Website benötigen
• Freelancer, die Anfragen ohne private DMs erhalten möchten

Wenn du ziehen, ablegen und Text bearbeiten kannst, kannst du einen Portfolio-Website-Builder oder ein Drag-and-Drop-Tool nutzen, um das zu erledigen.

Hinweis: Wenn du etwas flexibleres willst als klassisches No‑Code (aber immer noch nicht manuell coden möchtest), kann eine „Chat-to-app“-Plattform wie Koder.ai eine starke Option sein. Du beschreibst per Chat, was du willst, und sie erzeugt eine echte Web-App, die du veröffentlichen kannst — nützlich, wenn dein Portfolio custom Seiten, Formulare oder interaktive Bereiche jenseits typischer Templates braucht.

Was du am Ende haben wirst

Bis du alle Abschnitte durcharbeitest, wirst du haben:

• Eine live Portfolio-Site (Startseite, Projektseiten, About-Seite und Kontakt)
• Eine klare Struktur, die du später erweitern kannst, ohne alles neu zu machen
• Eine leichte Routine für Updates, damit die Seite aktuell bleibt (neue Projekte, aktualisierte Bio, Links)

Zeit- und Budget-Erwartungen

Die meisten Menschen können eine erste Version in einem Wochenende (oder ein paar fokussierten Abenden) veröffentlichen, wenn die Inhalte bereit sind.

Das Budget hängt von deiner Wahl ab:

• Gratispläne: Gut zum Testen einer Portfolio-Vorlage und zum Lernen des Builders, aber du hast eventuell eine Plattform-Subdomain und eingeschränkte Funktionen.
• Bezahlpläne: Oft nötig für eine eigene Domain und eine professionellere Präsentation.
• Domain-Kosten: Rechne mit grob 10–20 $/Jahr für eine Standard-Domain (z. B. yourname.com). Manche Builder bündeln Domain und Hosting in ihren Plänen, was die Einrichtung vereinfacht.

Das Ziel ist nicht Perfektion — es geht darum, eine saubere, klare Seite zu veröffentlichen, die du später verbessern kannst.

Lege Ziel und Zielgruppe fest, bevor du beginnst

Bevor du einen Portfolio-Website-Builder öffnest oder Templates durchstöberst, kläre zwei Dinge: Was soll die Seite für dich tun und wen musst du in den ersten 30 Sekunden überzeugen.

Eine No‑Code-Portfolio-Website lässt sich am einfachsten bauen, wenn jede Entscheidung (Layout, Projekte, Texte, Buttons) durch einen einfachen Filter geht: „Hilft das meinem idealen Besucher, den nächsten Schritt zu machen?“

Wähle ein primäres Ziel

Entscheide dich für das wichtigste Ergebnis gerade jetzt:

• Einen Job bekommen (Festanstellung oder Vertrag)
• Kunden gewinnen (Dienstleistung verkaufen)
• Projekte zeigen (Glaubwürdigkeit aufbauen, Kooperationen anziehen)

Sekundäre Ziele sind ok, aber gib einem Ziel Priorität, damit die Startseite nicht wie ein Menü ungeordneter Optionen wirkt.

Definiere deine Zielgruppe (und was sie zuerst braucht)

Deine Zielgruppe kann ein Recruiter, Hiring Manager, potenzieller Kunde oder ein Kooperationspartner sein. Jede Gruppe sucht nach anderen Beweisen.

Frage dich:

• Welche Frage versucht diese Person zu beantworten? („Kann diese Person den Job?“ „Kann ich ihnen mein Budget anvertrauen?“)
• Welche Beweise sind am wichtigsten: Resultate, Prozess, visuelle Arbeit, Testimonials, Zertifikate?
• Was sollten sie zuerst sehen: 2–3 beste Projekte, eine klare Service-Liste oder eine kurze Positionierungsbotschaft?

Fokus einschränken: 1–2 Rollen oder Services

„Für alles offen“ zu sein, macht deine persönliche Website vergesslich. Wähle eine Zielrolle (z. B. „Junior UX Designer“) oder eine Kernleistung (z. B. „Brand Identity für Startups“) und optional eine zweite, eng verwandte Option.

Entscheide deine Call-to-Action (CTA)

Deine Drag-and-Drop-Website sollte Besucher zu einem klaren nächsten Schritt leiten:

• E-Mail-Link (am schnellsten)
• Kontaktformular (organisierter)
• Buchungslink (ideal für Kunden-Calls)

Platziere diese CTA in der Kopfzeile und wiederhole sie gegen Ende der Startseite (z. B. verlinkt zu /contact).

Plane die Seitenstruktur (Seiten und Navigation)

Bevor du ein Template anfasst, entscheide, was deine Seite tun muss: jemandem schnell zeigen, wer du bist, was du kannst und wie man dich kontaktiert. Eine einfache Struktur macht jeden No‑Code-Builder leichter bedienbar und verhindert, dass Besucher mobil verloren gehen.

Beginne mit den essentiellen Seiten

Die meisten Portfolio-Sites funktionieren am besten mit einem kleinen Kern, der in eine Top-Navigation passt:

• Home: kurze Zusammenfassung und ein klarer nächster Schritt (Arbeit ansehen, Kontakt, Lebenslauf herunterladen).
• Work / Projects: deine Hauptgalerie oder Projektliste.
• About: deine Story, Fähigkeiten und wonach du suchst.
• Contact: Formular oder E-Mail-Link plus Social Links.

Wenn du unsicher bist, beginne mit diesen vier Seiten. Du kannst jederzeit mehr hinzufügen, ohne alles neu zu bauen.

Optionale Seiten nur, wenn sie dein Ziel unterstützen

Optionale Seiten helfen nur, wenn sie Entscheidungen für Besucher leichter machen:

• Services (wenn du freiberuflich arbeitest): was du anbietest, typische Pakete, wie man startet
• Resume / CV: eigene Seite oder downloadbares PDF
• Blog: nützlich, wenn du regelmäßig veröffentlichen willst
• Case Studies: tiefere Beiträge zu deinen stärksten Projekten

Navigations-Labels und Klick-Reihenfolge wählen

Verwende Labels, die Besucher erwarten: „Work“ oder „Projects“, nicht kreative Namen. Platziere den wichtigsten Link früh (oft Work) und den Conversion-Link zuletzt (Contact). Ein gängige Reihenfolge:

Home → Projects → About → Contact

Mobile einfach halten

Auf Handys wird dein Menü zu einem kleinen Icon, also beschränke Top-Level-Items auf 4–6. Wenn du mehr Inhalte hast, gruppiere sie unter einem Punkt (z. B. „Mehr“ oder „Ressourcen“) oder verlinke sie aus dem Footer.

Wähle einen No‑Code-Builder, der zu dir passt

Bevor du Farben oder Templates auswählst, entscheide dich für das Tool. Der „beste" Builder ist der, den du tatsächlich aktualisieren wirst — also priorisiere Einfachheit und Passung, nicht Features, die du nie nutzt.

Die Haupttypen von No‑Code-Optionen

Website-Builder (am flexibelsten): Wix, Squarespace, Webflow, Framer, WordPress.com. Vollwertige Websites mit Seiten, Menüs und Publishing.

Portfolio-Plattformen (am schnellsten): Behance, Dribbble, Adobe Portfolio. Gut, wenn du Arbeit schnell posten und von Communities profitieren willst, aber mit weniger Struktur- und Branding-Kontrolle.

All-in-one / Minimalistische Tools (gut für einfache Portfolios): Notion-basierte Sites, Carrd oder One-Page-Builder. Perfekt für eine schlanke Präsenz, besonders am Anfang.

Chat-to-app Builder (schnell, individueller als Templates): Wenn dein Portfolio sich eher wie eine kleine Web-App verhalten soll (custom Formulare, dynamische Projektseiten, geschützte Case Studies oder einzigartige Layouts), erwäge eine Chat-getriebene Plattform wie Koder.ai. Du beschreibst, was du willst, iterierst im Gespräch und veröffentlichst — ohne bei Null in einem visuellen Editor zu starten.

Kriterien, die sicher entscheiden helfen

Achte auf diese Basics (wichtigere als ausgefallene Animationen):

• Einfachheit beim Bearbeiten: Kannst du Texte ändern und Bilder in Minuten austauschen?
• Templates, die dir gefallen: Wenn das Startdesign zu deinem Stil passt, bist du schneller fertig.
• Mobile-Design: Sieht es automatisch gut auf Handys aus und kannst du mobile Layouts bei Bedarf anpassen?
• SEO-Einstellungen: Seitentitel, Meta-Beschreibungen, saubere URLs und Bild-Alt-Text sollten leicht zu setzen sein.
• Formulare und Kontaktoptionen: Eingebaute Formulare oder einfache Integrationen (E-Mail, Kalender) sind nützlich.

Kostenlose Pläne verstehen

Gratispläne sind nützlich zum Testen, bringen aber oft mit sich:

• Builder-Branding (Logo oder Banner der Plattform)
• Keine eigene Domain (Subdomain wie deinname.builder.com)
• Begrenzter Speicher oder Seitenanzahl
• Weniger SEO-Kontrollen und Integrationen

Wenn du dich bewirbst oder Kunden pitchst, ist ein bezahlter Plan mit eigener Domain meist sinnvoll.

Kurzliste erstellen (dann wählen)

Wähle 2–3 Tools, erstelle in jedem eine schnelle Entwurfs-Startseite und entscheide dann basierend auf deinem Ziel:

• Bewerbungsfokus: den einfachsten Editor + starke Templates wählen
• Designlastige Arbeit: Layout-Kontrolle und Typografie priorisieren
• Einfache Präsenz: die schnellste One-Page-Option wählen

Wenn du dich entschieden hast, bleib dabei — Tool-Wechsel während des Baus verlangsamt dich am meisten.

Wähle ein Template, das du schnell anpassen kannst

Ein Template ist dein Shortcut zu einem bewusst wirkenden Portfolio von Anfang an. Ziel ist nicht „das perfekte Design“ zu finden, sondern ein Layout, das dem entspricht, wie Leute in deinem Bereich Arbeit erwarten — und es dann so anzupassen, dass es nach dir aussieht.

Beginne mit Templates für dein Feld

Die meisten Builder filtern Templates nach Use Case. Das spart Zeit, weil Sektionen und Seiten bereits auf deine Bedürfnisse abgestimmt sind.

• Kreative (Design, Foto, Video): große Visuals, einfache Navigation, projektzentrierte Startseiten
• Business (Consulting, Marketing, Freelance): klare Services, Testimonials, kontaktfokussierte Layouts
• Tech (Developer, Product, Data): Case Studies, Rollenklarheit, Links zu GitHub/LinkedIn, einfache Struktur
• Studierende / Einsteiger: Projekte + Skills + starke About-Sektion, ohne jahrelange Kundenerfahrung vorauszusetzen

Was du prüfen solltest, bevor du dich festlegst

Öffne die Template-Vorschau und bewerte sie wie ein Besucher:

Achte auf:

• Starke Typografie: Überschriften sind klar vom Fließtext unterscheidbar und alles ist gut scannbar
• Ein klares Projekt-Grid: deine Arbeiten sollten innerhalb des ersten Scrolls sichtbar sein, mit konsistenten Thumbnails und Titeln
• Lesbares Mobil-Layout: Tap-Flächen sind nicht winzig, Text ist nicht zusammengedrängt und das Grid bricht sauber um

Wenn möglich, sieh dir die Vorschau auf dem Handy an (oder ziehe das Browserfenster schmal), bevor du wählst.

Was du vermeiden solltest (auch wenn es beeindruckend aussieht)

Einige Templates wurden gebaut, um Effekte zu zeigen, nicht deine Arbeit.

Vermeide Templates mit überladenen Animationen, versteckter Navigation, Autoplay-Video oder hellgrauem Text auf weißem Hintergrund. Wenn Besucher erst „herausfinden“ müssen, wie man die Seite liest, gehen sie meist weiter — besonders mobil.

Bestätige, dass die Anpassung einfach ist

Bevor du Zeit ins Befüllen steckst, prüfe, ob du die Elemente schnell anpassen kannst, die deine persönliche Marke ausmachen:

• Farben: Kannst du eine Primärfarbe setzen und sie auf Buttons/Links anwenden?
• Schriften: Kannst du Überschriften- und Fließtext-Schriftart ändern, ohne jeden Block anzupassen?
• Sektionen: Kannst du Abschnitte neu anordnen, löschen oder hinzufügen, ohne das Layout zu zerstören?

Eine gute Faustregel: Wenn du das Template nicht in 15–20 Minuten nach deinem Stil (Farben, Schriften, Abstände, ein paar Sections tauschen) anpassen kannst, wähle ein einfacheres Template. Dein Portfolio soll deine Projekte hervorheben — nicht das Template.

Sammle Inhalte: Texte, Bilder und deine persönliche Marke

Bevor du den Builder öffnest, sammle, was wirklich auf die Seite soll. Das spart später Stunden, weil du nicht alle paar Minuten nach einem Foto, einer Bio oder einem Screenshot suchen musst.

Schreibe eine klare Headline (und bleib menschlich)

Deine Headline ist das Erste, was Leute lesen — mach sie sofort verständlich. Eine Satzformulierung, die was du machst und wem du hilfst kombiniert, reicht.

Beispiele zum Anpassen:

• „UX-Designer, der Startups hilft, chaotische Ideen in einfache Flows zu verwandeln.“
• „Freier Fotograf für Hochzeiten, Marken und Editorial-Shootings.“
• „Front-End-Entwickler, der schnelle Marketing-Seiten für kleine Unternehmen baut.“

Wenn du vielseitig bist, liste nicht alles auf. Wähle den Service, den du jetzt öfter willst.

Sammle deine wichtigsten Assets in einem Ordner

Lege einen Ordner mit Unterordnern an, sodass der Aufbau eher Assemblieren als Suchen ist.

Was du zusammentragen solltest:

• Logo (optional): Ein Wortmarke reicht. Blockiere dich nicht hier.
• Headshot: Freundlich, gut beleuchtet, zugeschnitten für quadratische und breite Formate.
• Projektbilder: Screenshots, Fotos, Mockups — alles, was Ergebnisse zeigt.
• Testimonials: Sogar 1–2 kurze Zitate helfen. Nenne wenn möglich Name, Rolle und Firma.

Tipp: Exportiere Bilder in webfreundlichen Formaten (JPG/PNG; WebP, wenn dein Tool es unterstützt) und gib beschreibende Dateinamen (z. B. brand-redesign-homepage.jpg).

Bereite 3–6 beste Projekte vor (Qualität > Quantität)

Eine kleine Auswahl starker Projekte überzeugt mehr als eine lange Liste „okay“er Projekte. Für jedes Projekt schreibe 3–5 Bullet-Punkte in klarem Deutsch:

• Was war das Ziel?
• Was hast du gemacht (deine Rolle)?
• Welche Tools/Fähigkeiten kamen zum Einsatz?
• Was hat sich durch deine Arbeit verändert (Ergebnis)?

Wenn du Anfänger bist, nutze:

• Ein persönliches Projekt mit klarer Aufgabenstellung
• Ein Redesign-Konzept („Vorher/Nachher“)
• Ein freiwilliges oder studentisches Projekt

Erstelle ein einfaches Markenbild (damit alles absichtlich wirkt)

Du brauchst keinen vollständigen Brand-Guide. Konsistenz reicht.

• Schriften: Wähle 1–2 (eine für Überschriften, eine für Fließtext) aus den Standardfonts deines Builders.
• Farben: Wähle 2–3 (Primär, Neutral, Akzent). Nutze den Akzent sparsam für Buttons/Links.
• Abstände: Entscheide dich für ein „Default“-Spacing (z. B. großzügige Abstände und klare Abschnittstrennung) und bleib dabei.

Sind die Inhalte fertig, wird der No‑Code-Bau größtenteils Drag-and-Drop — denn die echte Arbeit (Klarheit) ist schon erledigt.

Baue die Startseite, die Leute zum Klicken bringt

Deine Startseite hat eine Aufgabe: innerhalb weniger Sekunden zeigen, wer du bist, was du tust und was der nächste Schritt ist. Wenn Besucher dich „herausfinden“ müssen, verschwinden sie meist.

Beginne mit einem scharfen Hero-Abschnitt

Starte mit einer kurzen Intro, die Rolle + Spezialität + Outcome kombiniert. Ziel: ein Satz, den ein Kunde oder Hiring Manager suchen würde.

Beispiel:

„Product Designer mit Fokus auf B2B SaaS — ich helfe Teams, klarere Workflows zu liefern und die Aktivierung zu steigern.“

Füge eine zweite Zeile hinzu, die das unterstützt (deine Nische, Tools oder typische Projekte). Halte es knapp.

Zeige ausgewählte Projekte (mit klaren Labels)

Mach es Besuchern nicht schwer, deine Arbeit zu finden. Platziere einen kleinen Bereich „Featured Projects“ direkt auf der Startseite.

Halte jede Projektkarte scannbar:

• Projektname + Label (z. B. „UX Case Study“, „Brand Identity“, „Web Redesign")
• Eine Ein-Zeilen-Aussage zum Ergebnis oder Fokus (z. B. „Onboarding-Abschlussrate verbessert")
• Ein klarer Link zur vollständigen Projektseite

Bist du am Anfang, präsentiere persönliche Projekte, freiwillige Arbeit, Redesign-Konzepte oder Klassenprojekte — Klarheit und Präsentation zählen mehr als ein großes Logo.

Nutze eine primäre CTA (und mache sie offensichtlich)

Wähle einen Haupt-Button und wiederhole ihn 1–2 Mal (oben und gegen Ende): Kontakt oder Call buchen. Verlinke ihn zu /contact.

Vermeide konkurrierende Buttons wie „CV herunterladen“, „E-Mail“, „Folgen“ und „Buchen“ gleichzeitig — wähle eine primäre Aktion und mache alles andere sekundär.

Mach die Seite scannbar

Nutze kurze Sektionen, klare Überschriften und Weißraum. Eine einfache Homepage-Struktur reicht oft:

Intro → Featured Projects → Kurzes About → Testimonials/Kunden (optional) → CTA

Erstelle Projektseiten (auch als Anfänger)

Projektseiten sind der Ort, an dem dein Portfolio Vertrauen verdient. Ein simples, wiederholbares Format hilft Besuchern zu verstehen, was du getan hast — ohne sie zu überfordern.

Nutze ein wiederholbares Layout (so wirst du schneller)

Erstelle eine Projektseiten-Vorlage in deinem Builder und dupliziere sie für jedes neue Projekt. Strebe diesen Ablauf an:

• Überblick: was das Projekt ist und für wen (auch „persönliches Projekt“)
• Deine Rolle: welche Verantwortung du hattest (Research, Design, Text, Fotografie etc.)
• Tools: Apps, Materialien oder Methoden
• Schritte: was du getan hast, in Reihenfolge
• Ergebnisse: was sich verändert hat, was geliefert wurde oder was du beim nächsten Mal anders machen würdest

Zeige deinen Prozess (nicht nur das finale Ergebnis)

Anfänger denken oft, sie hätten „nicht genug“ zu zeigen. Prozess füllt diese Lücke und signalisiert echte Fähigkeiten. Zeige schnelle Einblicke in dein Denken — Skizzen, Entwürfe, Schlüsselentscheidungen oder Vorher/Nachher-Vergleiche.

Regel: Wenn jemand fragt „Wie bist du von Idee zum Ergebnis gekommen?", sollte deine Seite die Antwort liefern.

Füge Kontext hinzu, der dich einprägsam macht

Ein paar Sätze Kontext können ein kleines Projekt groß wirken lassen:

• Einschränkungen (kurze Frist, kleines Budget, Markenregeln)
• Zeitrahmen (z. B. „Weekend sprint")
• Zusammenarbeit (wer war beteiligt und wie)
• Was du gelernt hast (eine ehrliche Erkenntnis)

Wenn du Details nicht teilen kannst, teile das, was geht

Bei Kunden- oder Firmenprojekten schreibe eine „gesäuberte" Case Study: erkläre Ziel, deine Verantwortung, deinen Ansatz und die Wirkung in allgemeinen Begriffen. Du kannst sensible Visuals durch vereinfachte Versionen (Wireframes, redigierte Screenshots oder nachgestellte Beispiele) ersetzen und vermerken, was entfernt wurde.

Beende jedes Projekt mit einer kleinen CTA: „Möchtest du so etwas? Kontaktiere mich über /contact."

Schreibe eine About-Seite und klare Kontaktoptionen

Auf der About-Seite entscheidet ein Besucher, ob du „die richtige Person" bist. Halte sie warm, konkret und einfach zu überfliegen — besonders mobil.

Eine Bio, die nach dir klingt (4–6 Sätze)

Schreibe einen kurzen Absatz, der beantwortet: was du tust, wem du hilfst und welche Ergebnisse du anstrebst. Füge ein Detail hinzu, das dich erinnerungswürdig macht (Nische, Methode oder Wert).

Beispielstruktur: „Ich bin [Rolle], die [Zielgruppe] bei [Art der Arbeit] unterstützt. Ich spezialisiere mich auf [Fokus]. Kürzlich habe ich an [Art von Projekten/Ergebnissen] gearbeitet. Ich bin ansässig in [Ort/Zeitzone] und verfügbar für [Festanstellung/Freelance/Kooperationen]."

Glaubwürdigkeit hinzufügen ohne Lebenslauf zu werden

Wähle 3–6 Glaubwürdigkeits-Signale, die für deine Arbeit relevant sind:

• Kernfähigkeiten (die sich aus deinen Projekten ableiten lassen)
• Kunden oder Firmen (auch kleine)
• Ausbildung, Zertifikate oder relevante Trainings
• Auszeichnungen, Publikationen oder Vorträge

Bist du am Anfang, nutze vorhandene Nachweise: Kursarbeiten, freiwillige Projekte, Praktika oder einen klar beschriebenen Prozess.

Wenn du freiberuflich arbeitest: Services kurz auflisten

Eine kurze Service-Liste reduziert unnötige Rückfragen. Halte es konkret und nenne typischerweise enthaltene Leistungen (und was nicht).

• Service-Name (z. B. „Brand Design")
• Was enthalten ist (Deliverables, Anzahl Revisionen, typische Dauer)
• Startpreis oder „Ab …" (optional)

Mach die Kontaktaufnahme mühelos

Biete mehrere Kontaktmöglichkeiten und setze Erwartungen:

• E-Mail (klickbar)
• Ein kurzes Kontaktformular (Name, E-Mail, Nachricht)
• Social Links, auf denen du wirklich antwortest

Füge eine Zeile hinzu wie: „Ich antworte innerhalb von 1–2 Werktagen“ plus wofür du offen bist („Freelance, Festanstellungen, Kooperationen"). Dieses kleine Detail schafft Vertrauen und spart beiden Seiten Zeit.

Füge SEO- und Accessibility-Basics hinzu (ohne Technikstress)

Du musst kein SEO-Profi sein, um deine Portfolio-Seite auffindbar zu machen. Ein paar Einstellungen helfen Suchmaschinen und echten Menschen.

Seitentitel + Meta-Beschreibungen (schnelle Gewinne)

Jede Seite sollte einen eigenen Seitentitel und eine Meta-Beschreibung haben. Denk an den Titel wie an die Headline in Google und an die Meta-Beschreibung als kurzen Pitch.

• Titel: Rolle + Spezialität zuerst (z. B. „UX Designer für Mobile Apps | Sam Lee").
• Meta-Beschreibung: Ein Satz, wer du unterstützt und was du machst (z. B. „Portfolio von Sam Lee, UX-Designer mit Fokus auf Onboarding-Flows, Prototyping und Usability-Tests.").

Wenn dein Builder SEO-Einstellungen pro Seite anbietet, ist dort der richtige Ort.

Überschriften + URLs, die Sinn machen

Nutze Überschriften, um eine klare Struktur zu schaffen:

• Verwende H1 nur einmal pro Seite (meist die Haupt-Headline).
• Verwende H2/H3 für Sektionen wie „Selected Work“, „Process“ oder „Results".

Halte URLs lesbar und konsistent, z. B.:

• / (Home)
• /about
• /work/project-name
• /contact

Vermeide unlesbare, automatisch generierte Slugs wie /page123.

Bilder: schnellere Seiten und bessere Zugänglichkeit

Portfolios sind bildlastig — sorge für schnelle Ladezeiten:

• Bilde komprimieren vor dem Upload (viele Builder optimieren zusätzlich automatisch).
• Füge Alt-Text hinzu, der beschreibt, worauf es ankommt: „Vorher/Nachher-Redesign des Checkout-Screens" ist besser als „image1".

Alt-Text hilft Screenreadern und macht deine Arbeit für Suchmaschinen klarer.

Footer: kleine Details, große Klarheit

Füge in jeden Footer:

• Kurze Navigation (Home, Work, About, /contact)
• Eine klare Kontaktmethode (E-Mail oder Formular)
• Optional: Standort/Zeitzone und relevante Social Links

Das verbessert die Usability und macht es Kunden leichter, dich von jeder Seite aus zu erreichen.

Domain einrichten und sicher veröffentlichen

Eine eigene Domain (z. B. yourname.com) macht dein Portfolio professioneller und leichter zu teilen (Lebenslauf, LinkedIn, Signatur). Ziel: einen leicht eingabbaren Namen wählen, ihn mit dem Builder verbinden und nach einer kurzen Qualitätskontrolle veröffentlichen.

Wähle eine einprägsame Domain

Prüfe den „laut aussprechen"-Test: Kann jemand, der den Namen einmal hört, ihn korrekt buchstabieren?

Gute Optionen:

• vornamefamilienname.com (am üblichsten)
• familienname.design / familienname.dev / familienname.photo (falls passend)
• vornamecreates.com (falls dein Name vergeben ist)

Vermeide Bindestriche, doppelte Buchstaben, die Tippfehler verursachen, und zu clevere Wortspiele.

In deinem Builder verbinden (DNS einfach erklärt)

Wenn du eine Domain kaufst, liegt sie beim Registrar. Deine Portfolio-Seite liegt beim Builder (Squarespace, Wix, Webflow, Framer, Carrd usw.). DNS sind die „Wegweiser", die dem Internet sagen, wohin Besucher gesendet werden. Praktisch fügst du ein paar Records vom Builder im Registrar ein:

• A-Record: zeigt die Domain auf eine IP-Adresse
• CNAME: zeigt eine Subdomain wie www auf deine Seite

Die meisten Builder zeigen Schritt-für-Schritt-Anweisungen und bestätigen, wenn alles verbunden ist. Änderungen brauchen Minuten bis ein paar Stunden, bis sie weltweit wirksam sind.

Wenn du mit einer Plattform baust, die Hosting und Deployment beinhaltet (z. B. Koder.ai unterstützt Deployment/Hosting und Custom Domains), kann das Veröffentlichen noch einfacher sein — besonders, wenn du die Option willst, später Quellcode zu exportieren.

Überall previewen, bevor du veröffentlichst

Vor dem Publish prüfe:

• Mobil-, Tablet- und Desktop-Layouts
• Navigation und Buttons (mobil einfach zu tippen)
• Schriftgrößen und Zeilenabstände (lesbar ohne reinzoomen)

Eine einfache Pre-Launch-Checkliste

Mach einen finalen Sweep auf:

• Defekte Links (vor allem Projekt-Buttons und Social-Icons)
• Tippfehler und inkonsistente Großschreibung
• Funktionierendes Kontaktformular (Testeingabe + Bestätigungsnachricht)
• Bildqualität (nicht unscharf, nicht verzerrt, angemessene Dateigröße)

Wenn das alles passt, veröffentliche — und teile deine Domain überall, wo Menschen dich finden sollen.

Pflegen, messen und mit der Zeit verbessern

Veröffentlichen ist nicht das Ende — es ist der Moment, ab dem die Seite für dich arbeitet. Kleine Pflege hält sie aktuell, benutzerfreundlich und auf die Ergebnisse fokussiert, die du möchtest (Anfragen, Calls, Bewerbungen).

Leichte Analytics hinzufügen (um zu wissen, was passiert)

Die meisten No‑Code-Builder bieten eingebaute Statistiken oder einfache Integrationen. Schalte Basis-Analytics an, damit du beantworten kannst:

• Welche Seiten werden am meisten besucht (Homepage, About, bestimmte Projekte)?
• Woher kommen Besucher (LinkedIn, Suche, Empfehlungen)?
• Erreichen Besucher das Kontakt-Element — oder springen sie vorher ab?

Wenn du willst, verbinde Google Analytics oder eine datenschutzfreundliche Alternative. Halte es simpel: Einmal im Monat prüfen und nach Trends suchen, nicht täglichem Rauschen.

Konversionen tracken, nicht nur Views

Pageviews sind nett, Konversionen zeigen Wert. Wähle 1–3 Aktionen, die zählen, und tracke sie:

• Kontaktformular-Einsendungen
• Klicks auf E-Mail (mailto)
• Klicks auf Buchungslinks (Calendly o.Ä.)

Führe notfalls ein kleines Spreadsheet: Datum, Änderung, Ergebnis nach ein paar Wochen. Das reicht, um zu lernen, was Anfragen verbessert.

Leichte Update-Routine setzen

Pflege ist am einfachsten, wenn sie geplant ist:

• Monatlich (15 Minuten): veraltete Infos korrigieren, Links prüfen, ein Testimonial oder eine Metrik hinzufügen.
• Quartalsweise (30–60 Minuten): ein stärkeres Projekt ergänzen, Homepage-Text straffen, Featured-Arbeit aktualisieren.

Strebe „aktuell und klar" an, nicht „perfekt".

Promote es, wo Leute sowieso hinschauen

Mach dein Portfolio sichtbar:

• Füge es in dein LinkedIn-Profil (Featured-Sektion + Link in der Headline)
• Setze es in deine E-Mail-Signatur
• Nenne es als ersten Link in Bewerbungen
• Falls du regelmäßig veröffentlichst, erwäge ein einfaches /blog für Updates, Case Studies oder Prozessnotizen

Kleine Verbesserungen summieren sich — besonders, wenn du misst, anpasst und regelmäßig präsent bist.