Zurück zum Blog
18. Oktober 20269 Min. LesezeitKarriere

Persönliche Websites: 6 Beispiele für deine eigene Seite

Entdecke sechs persönliche Websites für unterschiedliche Berufe. Mit Vorlagenvorschau, konkreten Inhaltsideen und Anregungen für deinen eigenen Auftritt.

Porträt von Javier Martínez Samblas

Javier Martínez Samblas

Gründer von Self · Lebenslauf-Websites mit KI

Bleistiftillustration einer persönlichen Website mit Projektkarten, Gestaltungswerkzeugen und einer mobilen Ansicht.

Eine gute persönliche Website beantwortet drei Fragen: Was machst du, wie sieht deine Arbeit aus und wie kann man dich erreichen? Die Gestaltung hilft dabei, diese Antworten zu vermitteln. In der Forschung schafft ein klarer Werdegang Platz für fachliche Details. Wer schreibt, braucht eine gut lesbare Vorstellung und Links zu ausgewählten Texten. Im Projektmanagement geht es darum, Verantwortung und Umsetzung nachvollziehbar zu machen.

Diese sechs Website-Beispiele zeigen, wie du das mit Self-Vorlagen umsetzen kannst. Zu jedem Design findest du eine Vorschau, eine Erklärung der wichtigsten Gestaltungsentscheidungen und Ideen für deine eigenen Inhalte. Beginne mit dem Beispiel, das zu deiner Arbeit passt, und nimm passende Anregungen aus den anderen mit.

Wähle einen Aufbau, der zu deiner Arbeit passt

Überlege zuerst, welche Informationen Besucher für ihre Einschätzung brauchen. Danach lassen sich Farben und Layout gezielter auswählen. Die Übersicht zeigt, welchen Schwerpunkt die einzelnen Designs unterstützen. Eine Vorlage kann zu mehreren Berufen passen; entscheidend ist, welche Informationen besonders gut sichtbar sein sollen.

Sechs Designs für persönliche Websites und die Inhalte, die sie hervorheben.

Softwareentwicklung

Design

8Bit

Was leicht auffindbar sein sollte

Technische Ausrichtung, ausgewählte Projekte und Links zu Code oder Produkten

Projektmanagement

Design

Bento

Was leicht auffindbar sein sollte

Projektumfang, Verantwortung, Entscheidungen und Ergebnisse

Forschung und Wissenschaft

Design

Dossier

Was leicht auffindbar sein sollte

Forschungsschwerpunkte, Methoden, Werdegang und weiterführende Arbeiten

Schreiben und freie Mitarbeit

Design

Editorial

Was leicht auffindbar sein sollte

Themen, eigener Stil, ausgewählte Veröffentlichungen und Kontakt

Personalwesen und betriebliche Abläufe

Design

Minimalistic

Was leicht auffindbar sein sollte

Fachliche Ausrichtung, Prozessverbesserungen und relevante Erfahrung

UI/UX- und Produktdesign

Design

Brutalist

Was leicht auffindbar sein sollte

Gestaltungsansatz, Projektkontext und eigener Beitrag

1. Eine Entwickler-Website mit klarer technischer Ausrichtung

8Bit verbindet pixelartige Schrift, einen dunklen Hintergrund und leuchtende Akzente zu einem eigenständigen Auftritt. Gleichzeitig erfüllt der Einstieg eine konkrete Aufgabe: Er nennt den technischen Schwerpunkt, beschreibt die entwickelten Systeme und macht berufliche Links direkt zugänglich. So bekommt dein Portfolio für Softwareentwicklung Persönlichkeit und bleibt übersichtlich.

8Bit-Website für Softwareentwicklung mit dunklem Hintergrund, fachlicher Vorstellung und gut sichtbaren GitHub- und Kontaktlinks.
8Bit verbindet einen markanten Stil mit einer konkreten Vorstellung und direkten beruflichen Links.

Beschreibe deine Projekte genauso präzise. Ein Titel wie "API für eine gemeinsame Arbeitsumgebung" vermittelt mehr als "Backend-Projekt". Ergänze die Aufgabe, deinen Verantwortungsbereich, eine wichtige technische Entscheidung und einen Link zum Ergebnis. Ein Repository, eine Produktdemo, ein Diagramm oder eine kurze technische Erläuterung können deine Arbeit nachvollziehbar machen.

  • Nenne in deiner Vorstellung die Systeme, Nutzer oder Probleme, mit denen du arbeitest.
  • Gib zwei oder drei relevanten Projekten genug Kontext, damit dein Beitrag deutlich wird.
  • Verbinde Werkzeuge mit ihrer Anwendung: Erkläre, wo du eine Technologie eingesetzt hast und wofür sie wichtig war.

Sieh dir die Vorlage 8Bit und ihren Aufbau an und wähle Projekte aus, die zu deiner angestrebten Rolle passen.

2. Eine Projektmanagement-Website, die Umsetzung sichtbar macht

Bento gliedert Informationen in klar abgegrenzte Karten. Profil, Kurzvorstellung und Kontakt haben ihren eigenen Platz; danach folgt die ausführlichere Berufserfahrung. Das passt zu Aufgaben, bei denen du Menschen, Systeme und Entscheidungen zusammenbringst: Erst entsteht ein Gesamtbild, dann kann man sich mit den Einzelheiten befassen.

Projektmanagement-Website mit Bento und getrennten Karten für Profil, Kontakt, Vorstellung und Berufserfahrung.
Bento gibt jeder Information einen festen Platz und erleichtert den Überblick über einen vielseitigen Werdegang.

Ein Projektmanagement-Portfolio wird aussagekräftiger, wenn es zeigt, was sich ändern sollte, wer beteiligt war und welche Verantwortung du übernommen hast. Bei einer Systemeinführung können Anforderungsaufnahme, Abstimmung mit Dienstleistern, Nutzertests, Schulungen und die Übergabe an den Betrieb wichtig sein. Erkläre neben dem Ergebnis auch die Entscheidungen, die zur Umsetzung geführt haben.

  • Beschreibe den Projektkontext und deinen eigenen Verantwortungsbereich.
  • Zeige, wie du mit Abhängigkeiten, Tests, Beteiligten oder der Einführung umgegangen bist.
  • Belege Ergebnisse mit geeigneten Informationen: etwa einem öffentlichen Start, einer freigegebenen Zusammenfassung oder einer messbaren Prozessverbesserung.

Weitere Anregungen findest du im Bento-Layout und im Leitfaden zum Darstellen nichtvisueller Arbeit im Projektmanagement-Portfolio.

3. Eine Forschungswebsite, die Arbeiten und Werdegang verbindet

Dossier stellt ein kompaktes Profil neben einen ausführlichen zeitlichen Verlauf. Name, Fachgebiet, kurze Vorstellung und Kontakt sind optisch von den längeren Erfahrungsabschnitten getrennt. So lassen sich wissenschaftliche Methoden und Verantwortlichkeiten ausführlich erklären, während die Person hinter den Arbeiten klar erkennbar bleibt.

Wissenschaftliche Website mit Dossier, kompakter Profilspalte und ausführlichem Werdegang im Bereich Umweltforschung.
Dossier trennt die wichtigsten Profilangaben von den fachlichen Details eines wissenschaftlichen Werdegangs.

Stelle deine Forschung so vor, dass interessierte Leser folgen können, und biete über konkrete Projekte und Links mehr Tiefe an. Eine Feldstudie kann Fragestellung, Probenahme, Auswertung und praktische Verwendung der Erkenntnisse erklären. Im akademischen Bereich kannst du Forschungsschwerpunkte mit Veröffentlichungen, Postern, Datensätzen oder einer Abschlussarbeit verbinden, sofern diese zugänglich sind.

  • Fasse die Fragen oder praktischen Probleme zusammen, die deine Arbeiten verbinden.
  • Erkläre Methoden und technische Werkzeuge im Zusammenhang mit einer Studie oder einem Projekt.
  • Beschrifte Publikations- und Projektlinks so, dass das Ziel vor dem Öffnen verständlich ist.

Erkunde das Dossier-Design. Wenn du gerade promovierst, zeigt unser Leitfaden zur persönlichen Website vor den ersten Publikationen weitere Möglichkeiten, deine Forschung vorzustellen.

4. Eine Website für Schreibende, die Texten Raum gibt

Editorial setzt auf großzügige Abstände, zurückhaltende Farben und gut lesbare Schrift. Die Vorstellung hat Platz, ein Thema und eine eigene Stimme zu entwickeln; Kontaktdaten stehen in der Nähe. Für Redaktion, freie Mitarbeit und Kommunikation ist dieser Einstieg zugleich eine kleine Arbeitsprobe: Er zeigt, wie klar du einen Gedanken vermitteln kannst.

Editorial-Website für Schreibende mit großzügiger Typografie, biografischer Vorstellung und eigener Kontaktspalte.
Editorial gibt einer kurzen Vorstellung Raum, um Themen, Stil und beruflichen Schwerpunkt zu vermitteln.

Wähle wenige Textproben aus und überlege, was jede davon zeigt. Ein Interview, eine Reportage, ein erklärender Artikel und ein beauftragter Essay können unterschiedliche Stärken belegen. Ergänze zu jedem Link das Medium, das Thema und deine Rolle. So können Interessierte den Text auswählen, der zu ihrem Vorhaben passt.

  • Benenne deine Themen, Formate oder Zielgruppen in einem konkreten Einstieg.
  • Gib jeder Textprobe einen eindeutigen Titel und einen Satz mit hilfreichem Kontext.
  • Biete einen gut sichtbaren Kontaktweg für mögliche Aufträge an.

Entdecke Editorial oder lies den Leitfaden zum Erstellen einer Portfolio-Website als Freelancer, wenn du neben deinem Werdegang auch Leistungen vorstellen möchtest.

5. Eine HR-Website mit Schwerpunkt auf Erfahrung und Wirkung

Minimalistic beginnt mit einem großzügigen Profilbereich: Porträt, berufliche Einordnung und Kontaktlinks stehen im Mittelpunkt. Darunter folgt der Werdegang. Das eignet sich für Tätigkeiten, deren Wert in verlässlichen Abläufen und kontinuierlicher Verantwortung liegt, etwa Personalwesen, Betriebsorganisation, Verwaltung oder Personalführung.

HR-Website mit Minimalistic, großem Profilbereich, Kontaktlinks und übersichtlichem beruflichem Werdegang.
Minimalistic stellt die fachliche Ausrichtung voran und führt anschließend durch die Berufserfahrung.

Mache deine Arbeit greifbar, indem du den verbesserten Service oder Prozess beschreibst. Die Einarbeitung neuer Beschäftigter, zuverlässige Personaldaten, Unterstützung von Führungskräften und interne Anlaufstellen erfüllen konkrete Aufgaben. Erkläre die Ausgangslage, deinen Beitrag zur Veränderung und welche Ergebnisse du zeigen kannst. Eine präzise Beschreibung macht auch ohne Bildergalerie deutlich, wie du arbeitest.

  • Erkläre in der Vorstellung, welche Menschen oder Abläufe deine Arbeit unterstützt.
  • Verbinde Verantwortungsbereiche mit konkreten Verbesserungen eines Services oder Prozesses.
  • Wähle Beispiele, die deinen Beitrag zeigen und die Vertraulichkeit von Beschäftigten- und Unternehmensdaten wahren.

Die Vorlage Minimalistic bietet einen klaren Aufbau für ein berufliches Portfolio mit Fokus auf deine Arbeit.

6. Ein Designportfolio mit einem selbstbewussten Einstieg

Brutalist verbindet kräftige Typografie, viel Freiraum und einen klaren Farbakzent zu einem markanten Auftritt. Die Vorstellung benennt den Gestaltungsansatz, bevor die Projekte folgen. Im UI/UX- und Produktdesign kann der erste Bildschirm damit sowohl deine visuelle Handschrift als auch deine Herangehensweise an Probleme vermitteln.

UI/UX-Website mit Brutalist, kräftiger Typografie, fachlicher Vorstellung und auffälligen Kontaktmöglichkeiten.
Brutalist gibt dem Einstieg eine starke visuelle Identität und hält die berufliche Aussage gut lesbar.

Ergänze deine stärksten Projektbilder um den nötigen Kontext. Die Neugestaltung eines Bestellprozesses wird nachvollziehbarer, wenn du das ursprüngliche Problem, deinen Verantwortungsbereich, die Rahmenbedingungen und die Entscheidungen hinter den fertigen Ansichten erklärst. Zeige genug vom Prozess, um den Entwurf mit einem verständlichen Problem zu verbinden.

  • Nenne die Produkte, Nutzergruppen oder Erlebnisse, für die du gestaltest.
  • Beschreibe bei ausgewählten Projekten das Problem, deinen Beitrag und das Ergebnis.
  • Verwende gut erkennbare Bilder und Bildunterschriften, die auch auf dem Smartphone beim Verstehen helfen.

Erkunde das Brutalist-Design und vergleiche es mit weiteren Vorlagen und Beispielen für persönliche Websites, um eine passende Präsentation für deine Arbeit zu finden.

So wird aus einer Lebenslaufzeile hilfreicher Website-Text

Auf einer Website kannst du eine Rolle, ein Projekt und die dazugehörige Arbeit miteinander verbinden. Beginne mit vorhandenen Informationen. Angenommen, deine Notizen beschreiben die Abstimmung von Anforderungen, Nutzertests und die Betriebsübergabe eines Lagersystems mit Standortleitungen, IT und Dienstleistern. Außerdem nennen sie dokumentierte Testentscheidungen und Anleitungen für Beschäftigte. Die folgenden Formulierungen zeigen, wie du daraus verständlichen Seiteninhalt machen kannst.

Ein konkretes Beispiel dafür, wie Projektdetails berufliche Website-Texte verbessern.

Projektmanager

Aussagekräftiger Website-Text

Projektmanager für Lagersysteme und betriebliche Systemeinführungen.

Was dadurch deutlich wird

Beruflicher Kontext und Schwerpunkt

An einer Systemeinführung mitgearbeitet

Aussagekräftiger Website-Text

Anforderungen, Nutzertests und die Übergabe an den Betrieb bei der Einführung eines Lagersystems koordiniert.

Was dadurch deutlich wird

Aufgaben und übernommene Verantwortung

Gute Kommunikationsfähigkeit

Aussagekräftiger Website-Text

Standortleitungen, IT und Dienstleister in einem Einführungsplan zusammengebracht, Testentscheidungen dokumentiert und Anleitungen für Beschäftigte abgestimmt.

Was dadurch deutlich wird

Wie Kommunikation in der Arbeit eingesetzt wurde

Gehe bei deinen eigenen Inhalten genauso vor: Beschreibe den Rahmen, erkläre deinen Beitrag und zeige, was dadurch möglich wurde. Ergänze Zahlen, wenn du sie zuverlässig belegen kannst. Auch eine klar beschriebene Verantwortung oder ein nützliches Arbeitsergebnis vermittelt konkrete Informationen.

Welche Inhalte auf deine persönliche Website gehören

Der passende Aufbau richtet sich danach, welche Arbeiten du zeigen kannst und worüber du mit Besuchern ins Gespräch kommen möchtest. Mit dieser Checkliste kannst du deine Seite vor der Veröffentlichung vorbereiten.

  • Eine konkrete Vorstellung: dein Fachgebiet, deine Arbeit und die Stellen oder Kooperationen, die dich interessieren.
  • Aussagekräftige Beispiele: Projekte, Erfahrung, Publikationen, Textproben oder relevante Studienarbeiten mit erläutertem Eigenanteil.
  • Kompetenzen im Zusammenhang: Zeige, wo du eine Fähigkeit in deiner Arbeit einsetzt.
  • Ein klarer nächster Schritt: berufliche E-Mail-Adresse, relevantes Profil oder leicht auffindbare Kontaktmöglichkeit.
  • Ein Test auf dem Smartphone: Prüfe Lesbarkeit, Bilder, Navigation und die Ziele deiner Links.

Am Anfang deiner Laufbahn liefern Projekte und Studienarbeiten oft passende Belege. Unser Leitfaden zu Inhalten für eine persönliche Website nach dem Studium zeigt, wie du sie auswählst und erläuterst.

Erstelle deine persönliche Website mit deinen vorhandenen Inhalten

Self verwandelt deinen Lebenslauf, dein Portfolio oder berufliche Notizen in eine gehostete persönliche Website. Füge deine Inhalte hinzu, wähle eine Vorlage und prüfe die erzeugte Seite. Überarbeite die Vorstellung, kontrolliere die Berufserfahrung und ergänze Links oder Medien, mit denen sich deine Arbeit besser erkunden lässt.

Du kannst jede Vorlage vor der Veröffentlichung ausprobieren. Im Free-Tarif veröffentlichst du mit einer kostenlosen Vorlage; Pro und Team ermöglichen zusätzlich die Veröffentlichung mit Pro-Designs. Wähle die Darstellung, die deine gewünschte fachliche Ausrichtung verständlich macht.

Starte mit dem Werkzeug zum Umwandeln deines Lebenslaufs in eine Website oder vergleiche die Designs in der Vorlagensammlung. Den vollständigen Ablauf erklärt die Schritt-für-Schritt-Anleitung für deine Lebenslauf-Website.

Häufige Fragen zu persönlichen Websites

Was macht eine gute persönliche Website aus?

Eine klare Vorstellung, passende Beispiele deiner Arbeit und eine einfache Kontaktmöglichkeit. Wähle ein Layout, in dem sich diese Inhalte leicht finden lassen, und erkläre deinen Beitrag zu den einzelnen Projekten oder Tätigkeiten.

Was unterscheidet eine persönliche Website von einem Portfolio?

Eine persönliche Website stellt dich vor und kann Erfahrung, Interessen, Forschung und Kontaktinformationen zusammenführen. Ein Portfolio konzentriert sich auf ausgewählte Arbeiten. Beides lässt sich verbinden: Eine berufliche Vorstellung ordnet die anschließenden Projekte ein.

Kann ich vor meiner ersten Vollzeitstelle eine persönliche Website erstellen?

Ja. Studienarbeiten, eigene Projekte, Ehrenamt, Teilzeitjobs und Forschung können hilfreiche Inhalte liefern. Beschreibe das Ziel, deine Aufgaben und das Ergebnis oder die gewonnenen Erkenntnisse. Wähle Beispiele, die zu deinem nächsten beruflichen Schritt passen.

Muss ich programmieren können?

Self erstellt und hostet die Seite aus deinen beruflichen Inhalten, damit du dich auf Inhalt und Darstellung konzentrieren kannst. Eine selbst programmierte Website ist ebenfalls eine Möglichkeit, wenn du damit passende Entwicklungskenntnisse zeigen möchtest.