Portfolio erstellen: Anleitung für Webdesign-Freelancer

- Ein Webdesign-Portfolio entsteht in fünf Schritten: Zielgruppe festlegen, Tool wählen, fünf bis acht starke Projekte kuratieren, Struktur mit Vorher-Nachher und Ergebnissen aufbauen, Kontakt-CTA einbinden. Ohne echte Kundenprojekte helfen klar gekennzeichnete Demo-Websites für lokale Betriebe, die sich mit KI-Tools in Minuten statt Wochen erstellen lassen.
Welche Art von Portfolio brauchst du wirklich?
Der Begriff „Portfolio" meint je nach Kontext etwas völlig anderes, und das sorgt für Verwirrung. Wer bei Google „Portfolio erstellen" eingibt, landet in Ergebnissen für Schulportfolios, Finanzportfolios und Design-Portfolios gleichzeitig. Dieser Guide behandelt genau einen Typ: das Webdesign-Portfolio, mit dem Freelancer und Agenturen Aufträge von lokalen Betrieben gewinnen wollen, nicht Jobs bei Agenturen.
Design- und Webdesign-Portfolio
Ein Design- oder Webdesign-Portfolio zeigt abgeschlossene Projekte, um neue zahlende Kunden zu überzeugen. Es ist Verkaufswerkzeug, kein Lebenslauf. Jedes gezeigte Stück muss eine Frage beantworten: Kann diese Person meiner Werkstatt, meinem Salon oder meinem Büro mehr Anfragen bringen? Darum geht es in diesem Artikel.
Bewerbungs- und Schulportfolio
Ein Bewerbungs- oder Schulportfolio dokumentiert Lernfortschritt oder Qualifikation für eine Bewerbung, eine Prüfung oder eine Mappe an Hochschulen. Die Struktur folgt curricularen Vorgaben, nicht den Erwartungen eines zahlenden Kunden. Wer nach „Portfolio erstellen Schule" oder „Portfolio erstellen Uni" sucht, braucht einen anderen Leitfaden als diesen.
Finanzportfolio kurz abgrenzen
Ein Finanzportfolio ist die Zusammenstellung von Wertpapieren, ETFs oder Vermögenswerten, etwa wie es Plattformen wie justETF abbilden. Mit Webdesign hat das nichts zu tun außer dem Wort selbst. Falls du danach gesucht hast: falscher Artikel, aber jetzt weißt du es.
Portfolio erstellen in 5 Schritten
Ein funktionierendes Portfolio entsteht nicht durch Sammeln, sondern durch gezieltes Weglassen. Fünf Schritte reichen, um von null zu einer veröffentlichbaren Seite zu kommen.
Schritt 1: Zielgruppe und Ziel definieren
Bevor du ein einziges Bild hochlädst, lege fest, wen du erreichen willst. Ein Portfolio für Agenturen, die dich als Freelancer buchen, sieht anders aus als eines für Handwerksbetriebe, Friseursalons oder Architekturbüros, die direkt bei dir kaufen wollen. Wer nebenberuflich in den Webdesign-Verkauf einsteigt, sollte diese Entscheidung ganz am Anfang treffen, wie auch der Leitfaden zum nebenberuflichen Einstieg ins Webdesign beschreibt. Zielgruppe unklar heißt Portfolio beliebig, und beliebig überzeugt niemanden.
Schritt 2: Tool und Vorlage wählen
Das Tool bestimmt, wie schnell du live gehst, nicht wie professionell das Ergebnis wirkt. Canva und Adobe Express reichen für ein sauberes Grid-Portfolio in unter einer Stunde. Wer Kontrolle über Code und Hosting will, baut mit Squarespace, Webflow oder einer eigenen Website. Details zum Tool-Vergleich folgen weiter unten.
Schritt 3: Projekte kuratieren
Fünf bis acht Projekte schlagen zwanzig mittelmäßige, jedes Mal. Jedes Stück im Portfolio sollte eine andere Fähigkeit oder Branche abdecken, nicht dieselbe Vorlage mit anderem Logo. Lieber drei starke Case Studies als zehn Screenshots ohne Kontext.
Schritt 4: Struktur und Storytelling
Jedes Projekt braucht drei Teile: Ausgangslage, Lösung, Ergebnis. Beschreib nicht, welche Schriftart du gewählt hast, sondern was sich für den Kunden geändert hat. „Der Friseursalon hatte keine Online-Terminbuchung, jetzt kommen 40 Prozent der Termine über die Website“ überzeugt mehr als drei Absätze über Farbpaletten.
Schritt 5: Kontakt und Call-to-Action
Ohne klaren Call-to-Action verpufft das beste Portfolio. Ein Button „Projekt besprechen" oder „Kostenloses Erstgespräch buchen" am Ende jeder Seite ist Pflicht, kein Nice-to-have. Viele Portfolios scheitern nicht an der Optik, sondern daran, dass niemand weiß, wie man den Ersteller kontaktiert.
Das Kaltstart-Problem: Portfolio ohne echte Kundenprojekte
Fehlende Referenzprojekte sind kein Grund, mit der Akquise zu warten. Die Lösung heißt: selbst gebaute Demo-Websites für reale lokale Betriebe, klar als solche gekennzeichnet.
Warum ein leeres Portfolio Kunden abschreckt
Ein leeres oder dünnes Portfolio signalisiert Unsicherheit, bevor du ein Wort gesagt hast. Ein Handwerksbetrieb, der eine Website kaufen soll, will sehen, wie eine fertige Website für einen ähnlichen Betrieb aussieht, nicht lesen, dass du „motiviert und lernbereit" bist. Das Problem lösen viele Einsteiger falsch, indem sie Wochen an einem einzigen Fantasieprojekt feilen, das am Ende trotzdem nach Übung aussieht.
Demo-Projekte mit KI-Tools erstellen
Schneller geht es, indem du mit einem KI-Tool wie LumaSite in Minuten eine fertige, hostbare Demo-Website für einen echten lokalen Betrieb generierst, zum Beispiel einen Malerbetrieb ohne eigene Website, den du in deiner Umgebung findest. Statt einer Woche Arbeit an einem fiktiven Café entsteht so in kurzer Zeit ein Preview-Link, den du im Portfolio zeigen und später bei genau diesem Betrieb für die Kaltakquise nutzen kannst. Wichtig dabei: Bevor ein Projekt überhaupt ins Portfolio passt, brauchst du passende Zielbetriebe, die der Leitfaden zum Finden von Betrieben ohne Website beschreibt.
Nimm als Beispiel einen Dachdeckerbetrieb mit sechs Mitarbeitern, der aktuell nur über ein veraltetes Branchenbucheintrag auffindbar ist. Eine in 15 Minuten generierte Demo-Website mit Leistungsübersicht, Referenzgalerie und Kontaktformular zeigt im Portfolio genau das, was ein ähnlicher Betrieb kaufen würde, ohne dass vorher ein echter Auftrag existiert hat.
Ehrliche Kennzeichnung von Showcase-Projekten
Demo-Projekte im Portfolio zu zeigen ist völlig legitim, solange sie klar als Konzept gekennzeichnet sind. Ein Zusatz wie „Konzeptprojekt, nicht im Auftrag des Betriebs erstellt" unter dem Projekttitel reicht aus. Was nicht geht: den Eindruck erwecken, ein echter Kunde habe das beauftragt und bezahlt, wenn das nicht stimmt. Das ist reine Spec Work mit Eigeninitiative, keine Täuschung, solange die Kennzeichnung sitzt. Sobald das erste echte Projekt abgeschlossen ist, ersetzt du das Demo-Stück und das Portfolio wird mit jedem Austausch glaubwürdiger.
Was ein Webdesign-Portfolio für lokale Betriebe enthalten muss
Lokale Betriebe kaufen keine Ästhetik, sie kaufen Ergebnisse. Ein Portfolio, das Handwerker, Friseursalons oder Architekturbüros überzeugen soll, braucht andere Inhalte als eines, das bei Design-Agenturen Eindruck machen will.
Branchenspezifische Beispiele statt generischer Mockups
Ein Friseursalon erkennt sich nicht in einem Tech-Startup-Mockup wieder. Zeig Projekte aus Branchen, die deiner Zielgruppe ähneln: Handwerk, Gastronomie, Gesundheit, lokale Dienstleister. Welche Pflichtelemente so eine Business-Website überhaupt braucht, von Öffnungszeiten bis Terminbuchung, beschreibt der Leitfaden zu Business-Webdesign im Detail.
Vorher-Nachher-Darstellung
Ein Vorher-Nachher-Vergleich ist das überzeugendste Element im gesamten Portfolio. Ein Screenshot der alten, oft veralteten Facebook-Seite oder der nicht-mobilen Website neben dem neuen responsiven Design macht den Nutzen in zwei Sekunden klar, ganz ohne Erklärtext.
Ergebnisorientierte Case Studies
Zahlen schlagen Adjektive. Statt „modernes, ansprechendes Design" schreib „Anfragen über das Kontaktformular stiegen von 2 auf 11 pro Monat" oder „Google-Auffindbarkeit für den Firmennamen plus Ort verbessert". Bei Demo-Projekten ohne echte Nutzungsdaten formulierst du stattdessen das Ziel: „Konzipiert, um Online-Terminbuchungen zu ermöglichen, die vorher nicht existierten."
*Weiterlesen: Website Inspiration für lokale Betriebe: 15 Quellen*
*Weiterlesen: Webdesign Kunden finden: Kundenakquise für Webdesigner und Agenturen mit echten Zahlen*
Tools im Vergleich: Wo du dein Portfolio erstellen kannst
Die Wahl des Tools hängt davon ab, wie viel Kontrolle du brauchst und wie viel Zeit du investieren willst. Für diesen Vergleich wurden die Preisseiten der Anbieter im aktuellen Stand geprüft, keine Affiliate-Bewertung, sondern ein nüchterner Blick auf Funktionsumfang und Grenzen der kostenlosen Stufen.
| Tool | Preis Einstieg | Stärke | Grenze |
|---|---|---|---|
| Canva | kostenlos, Pro ab ca. 12 Euro/Monat | riesige Vorlagenauswahl, schnell | wirkt oft austauschbar ohne Anpassung |
| Adobe Express | kostenlos, Premium ab ca. 10 Euro/Monat | gute Design-Werkzeuge, Adobe-Ökosystem | eingeschränktes Hosting unter eigener Domain |
| Figma | kostenlos für Einzelnutzer | präzise Gestaltung, ideal für UI/UX-Profis | kein echtes Website-Hosting, nur Prototyp |
| Wix | kostenlos mit Werbung, Premium ab ca. 17 Euro pro Monat (günstigster Tarif ohne Online-Zahlungen) | viele Layout-Optionen, eigenes Hosting | Premium für eigene Domain nötig |
| Squarespace | ab 12 bzw. 17 €/Monat (jährliche bzw. monatliche Zahlung), kein Dauer-Gratistarif | hohe Design-Qualität von Haus aus | kein kostenloser Einstieg |
| PowerPoint Portfolio Maker | kostenlos mit Microsoft 365 | schnell für PDF-Export | kein echtes Web-Hosting, wirkt wie eine Präsentation |
Für Einsteiger ohne Code
Canva und Adobe Express sind der schnellste Weg zu einem vorzeigbaren Portfolio ohne jede Vorkenntnis. Beide bieten kostenlose Stufen, die für ein erstes Portfolio reichen, solange du keine eigene Domain brauchst.
Für Design-fokussierte Profis
Figma eignet sich für alle, die ihr Portfolio selbst als Design-Beweis nutzen wollen, etwa bei Bewerbungen an Agenturen. Für den Verkauf fertiger Websites an lokale Betriebe ist Figma allein aber zu wenig, weil Prototypen keine echte Website sind, die ein Kunde sofort nutzen kann.
Für individuelle Websites mit eigenem Hosting
Wix und Squarespace bauen echte, live gehostete Websites, was für ein Webdesign-Portfolio glaubwürdiger wirkt als ein PDF oder eine Präsentation. Wer stattdessen schneller echte Demo-Projekte für konkrete Zielbetriebe generieren will, nutzt ein spezialisiertes Tool wie LumaSite, das direkt einen Preview-Link mit Hosting-Option liefert statt einer generischen Vorlage.
Häufige Fehler beim Portfolio erstellen
Die meisten schwachen Portfolios scheitern an denselben drei, vier Dingen, immer wieder.
- Zu viele Projekte: Zwanzig halbgare Stücke verwässern die drei wirklich guten. Streich kompromisslos.
- Fehlender Call-to-Action: Ein Portfolio ohne Kontaktmöglichkeit am Ende jeder Seite ist eine Sackgasse.
- Veraltete Inhalte: Ein Portfolio, das seit 18 Monaten nicht aktualisiert wurde, wirkt wie ein eingeschlafenes Geschäft.
- Generische Vorlagen ohne eigene Note: Austauschbares Design signalisiert austauschbares Ergebnis für den Kunden.
- Nur Screenshots ohne Kontext: Ein Bild ohne Ausgangslage und Ergebnis beantwortet keine einzige Kundenfrage.
Realistische Erwartungen: Was ein Portfolio bringt und was nicht
Ein Portfolio öffnet Türen, es tritt sie nicht ein. Es ersetzt keine Akquise und bringt allein keine einzige Anfrage, wenn niemand den Link sieht. Realistisch betrachtet ist das Portfolio ein Baustein im Verkaufsprozess, nicht der Prozess selbst, wie auch der Leitfaden zum Verkauf von Websites an lokale Betriebe in seinem 5-Schritte-Modell beschreibt, in dem das Portfolio erst nach Zielgruppenwahl und vor der Kontaktaufnahme kommt.
Wer per Telefon Erstkontakt zu Gewerbetreibenden sucht, bewegt sich rechtlich in einer Grauzone, die im Einzelfall unter mutmaßlicher Einwilligung zulässig sein kann. Kalte E-Mails an Betriebe ohne vorherige Geschäftsbeziehung sind dagegen nach § 7 UWG grundsätzlich unzulässig. Das ist kein Rechtsrat, nur ein Hinweis, der vor der ersten Akquise-Aktion gehört, nicht erst danach.
Pflege ist Pflicht, kein Extra. Ein Portfolio, das du einmal baust und nie wieder anfasst, verliert nach einem Jahr an Wirkung, weil Designtrends sich verschieben und alte Projekte abgenutzt wirken. Zwei bis drei neue Projekte pro Quartal halten es lebendig. Und: Ein Portfolio wirkt nicht sofort. Rechne mit mehreren Wochen zwischen erstem Kontakt und erstem Auftrag, selbst bei einem starken Portfolio.
FAQ: Portfolio erstellen
Wie mache ich ein gutes Portfolio?
Ein gutes Portfolio hat eine klare Struktur, fünf bis acht ausgewählte Projekte und zeigt Ergebnisse statt nur Optik. Eigenes Branding und regelmäßige Aktualisierung unterscheiden ein lebendiges Portfolio von einer verstaubten Visitenkarte.
Wie schreibe ich ein Portfolio richtig?
Jede Projektbeschreibung folgt dem Muster Ausgangslage, Lösung, Ergebnis, in maximal drei bis fünf Sätzen. Fachjargon über Technik oder Tools interessiert den Kunden nicht, der Nutzen für sein Geschäft schon.
Wie kann ich ein Portfolio kostenlos erstellen?
Canva, Adobe Express und Wix bieten kostenlose Stufen, die für ein erstes Portfolio ausreichen. Die Grenze liegt meist beim Hosting unter eigener Domain und beim Branding der Plattform, das auf der kostenlosen Version sichtbar bleibt.
Welche Beispiele gibt es für Portfolios?
Figma und Wix listen jeweils eigene Beispielsammlungen für klassische Design-Portfolios. Für den Verkauf an lokale Betriebe überzeugt ein konkretes Beispiel mehr als zehn generische Inspirationen, etwa eine fertige Handwerker-Website mit Vorher-Nachher-Vergleich und sichtbarem Ergebnis.
Wie baue ich ein Portfolio ohne eigene Kunden auf?
Mit KI-Tools lassen sich Demo-Websites für reale lokale Betriebe in Minuten generieren, die du als Showcase-Projekt ins Portfolio aufnimmst. Sobald die ersten echten Aufträge abgeschlossen sind, ersetzt du die Demo-Projekte nach und nach.
Darf ich Demo-Projekte als Portfolio zeigen?
Ja, solange sie klar als Konzept oder Demo gekennzeichnet sind und keine fremden Markenrechte oder Logos ohne Erlaubnis verwendet werden. Problematisch wird es erst, wenn der Eindruck entsteht, ein echter Kunde habe das Projekt beauftragt und bezahlt, obwohl das nicht stimmt.
Weiterlesen

Creative Portfolio: Aufbau, Beispiele, Tipps für Freelancer

Portfolio-Website erstellen: Leitfaden für Freelancer

Design Portfolio erstellen: Guide für Freelancer

Webdesign Portfolio: 15 Beispiele, die Kunden wirklich gewinnen
Jede Woche ein ehrlicher Ratgeber
Kostenlos in dein Postfach — Kunden finden, Websites verkaufen, sauber starten. Kein Spam, mit einem Klick abbestellbar.
✓ Schau in dein Postfach — ein Klick auf den Bestätigungslink, fertig.