Canva Startseite

Erstelle mit Canva Code eine präsentationsreife Portfolio-Website

4Min

Einsteiger

Hier erfährst du, wie du aus einem Prompt mit Canva Code eine professionelle Portfolio-Website erstellst, sie an deine Marke anpasst und einen Live-Link veröffentlichst, den du direkt an einen Kunden senden kannst.

Erstelle mit Canva Code eine präsentationsreife Portfolio-Website

4Min

Einsteiger

Hier erfährst du, wie du aus einem Prompt mit Canva Code eine professionelle Portfolio-Website erstellst, sie an deine Marke anpasst und einen Live-Link veröffentlichst, den du direkt an einen Kunden senden kannst.


Lerninhalte

  • So beschreibst du die gewünschte Portfolio-Website mit einem einzigen, klaren Prompt
  • So macht Canva Code aus diesem Prompt eine vollständige, responsive Website
  • So wird die Website individuell – mit Markenfarben, deinen Inhalten und Re-Prompting zur Optimierung
  • So veröffentlichst du eine Live-Website mit einem eigenen Link, den du an einen Kunden senden kannst

Wenn du ein Ein-Mann-Team bist, muss deine Website mehr leisten – sie muss nicht nur zeigen, dass du gut bist, sondern auch vermitteln, wer du bist. Du hast nicht die Zeit oder das Budget für einen Entwickler und ein Vorlagen-Builder bietet dir nicht die Flexibilität, die du dir wünschst?

Diese Lücke schließt Canva Code. Du beschreibst die Website, die dir vorschwebt, und auf Basis deiner Vorgaben wird eine responsive Website erstellt – das Layout, die Struktur und die Aufmachung werden individuell für dich zugeschnitten. Dann kannst du sie optimieren, bis sie genau deinen Vorstellungen entspricht. So erstellst du mit einem einzigen Prompt eine Portfolio-Website, die einzigartig ist und den Kunden überzeugt:


Mit einem klaren Prompt beginnen

Öffne Canva Code und beschreibe in einfachen Worten, was du möchtest. Stell dir das wie ein Briefing für einen Designer vor: Nenne die Bereiche, die du benötigst, und die gewünschte Aufmachung.

Für eine Portfolio-Website bedeutet das normalerweise:

  • Ein Portfolio oder eine Projektgalerie zur Präsentation deiner Arbeiten
  • Ein Bereich mit den Leistungen, die du anbietest
  • Ein Bereich, in dem du dich vorstellst
  • Eine Möglichkeit, mit dir in Kontakt zu treten – das könnte ein Formular sein, das mit Canva Sheets verknüpft ist

So könnte dein Prompt aussehen: „Erstelle eine Portfolio-Website für einen freiberuflichen Marketingberater. Füge eine Navigationsleiste mit dem Namen, einen Hero-Bereich mit Porträtfoto, eine Statistik-Zeile und ein Projektkarussell mit Kategorien-Tags hinzu. Füge am Ende ein Kontaktformular ein. Gestalte die Website optisch auffällig und ansprechend – leuchtende Farben auf hellem Hintergrund.“

Tipp:

Je genauer du bist, desto besser entspricht der erste Entwurf deinen Vorstellungen, was bedeutet, dass du später weniger ändern musst. Gib an, in welcher Branche du tätig bist, welche Bereiche du haben möchtest und welchen Stil du dir wünschst (schlicht, auffällig, verspielt), nicht einfach nur: „Erstelle eine Website für mich.“


Deinen ersten Entwurf erstellen

Gib deinen Prompt ein und Canva Code designt die komplette Website – im passenden Layout, responsiv und mit genau den Bereichen, die du brauchst. In einem Augenblick wird so aus einer leeren Seite etwas Handfestes auf dem Bildschirm.

Aber keine Sorge, das ist noch nicht das Endergebnis. Doch der Anfang ist immer am schwersten und der ist schon mal gemacht. Scrolle einmal durch und verschaff dir einen Eindruck, bevor du mit der eigentlichen Gestaltung beginnst.


Individuell gestalten

Ab hier sieht die Website nicht mehr nach einem Entwurf aus, sondern trägt deine Handschrift. Alles läuft jetzt im vertrauten Canva Editor ab, Programmierkenntnisse sind nicht nötig.

  • Text und Bilder direkt bearbeiten. Wähle einen Text aus, um ihn umzuschreiben, oder ziehe deine eigenen Bilder aus den Registerkarten „Uploads“ oder „Elemente“ auf die Website, so wie du es bei jedem anderen Canva Design tun würdest.
  • Auf Markenfarben und -schriftarten umstellen. Passe diese Komponenten im Editor an, damit die Website zu deiner Marke passt.
  • Durch Re-Prompting optimieren. Sag Canva Code einfach, was geändert werden soll, zum Beispiel „den Hero-Bereich auffälliger gestalten“ oder „einen Bereich mit Erfahrungsberichten hinzufügen“, damit genau diese Teile angepasst werden, ohne den Rest zu verändern. Muss etwas Spezifisches geändert werden? Wähle das betreffende Element aus und gib einen Re-Prompt ein, um es zu optimieren.

Mit Canva Code lässt sich auch Interaktivität einbauen – also die Art von Bewegung, die eine Website lebendig wirken lässt. Probiere Prompts wie diese aus:

  • „Füge auf den Projektkarten einen Hover-Effekt hinzu, der die Karten leicht anhebt und einen weichen Schatten wirft, wenn jemand den Mauszeiger darüber bewegt.“
  • „Lass die Projektgalerie von selbst langsam und kontinuierlich zur Seite scrollen, ohne dass jemand darauf klicken muss.“
  • „Erweitere die Projektkarten, wenn darauf geklickt wird, um ein größeres Bild und eine kurze Beschreibung anzuzeigen.“

Tipp:

Ändere jeweils eine Sache und prüfe das Ergebnis. So siehst du viel leichter, was funktioniert, als wenn du per Re-Prompt fünf Dinge gleichzeitig änderst und hinterher mühsam zuordnen musst, was sich wo verändert hat.


Veröffentlichen und senden

Du erhältst eine Live-Website und kannst entscheiden, wie sie geteilt wird – alles von Canva aus. Dafür gibt es folgende Optionen:

  • Sende sie als Canva Link, damit sich dein Team sie schnell ansehen kann
  • Veröffentliche sie auf einer kostenlosen Canva Domain
  • Kaufe dir eine eigene Domain

Möchtest du auf einer Domain veröffentlichen? Du kannst einen Passwortschutz einrichten, um den Zugriff zu steuern.

Kopiere den Link und zeig ihn deinem Kunden, solange er dich noch im Blick hat.

Vor dem Versenden solltest du noch Folgendes prüfen: Klicke auf jeden Link und sieh dir an, wie die Website auf Mobilgeräten dargestellt wird.

Dafür gibt es mehre Möglichkeiten: Wechsle in der Vorschau auf die mobile Ansicht oder ziehe am Rand des Designs, um zu sehen, wie es sich anpasst. Du kannst die Datei auch auf einem anderen Gerät öffnen. Mit Canva Code erstellte Websites sind responsiv und sehen auf jedem Gerät gut aus. Es empfiehlt sich aber ein 30-Sekunden-Check, um Details aufzuspüren.

Das ist eine professionelle Website, die gestaltet und live geschaltet wurde, ohne Code schreiben zu müssen. Sie strahlt dieselbe Qualität aus wie deine Projekte selbst. Sobald der nächste Pitch ansteht, bist du sofort startklar.


Anleitungen, die dir vielleicht gefallen

Anleitungen, die dir vielleicht gefallen

Leitfaden
Pro
Wir stellen vor: dein kreativer KI-Partner

Wir stellen vor: dein kreativer KI-Partner

Wir stellen vor: dein kreativer KI-Partner

10Min

Einsteiger

Leitfaden
Individuelle Unterrichtsaktivitäten mit Canva AI vorbereiten

Individuelle Unterrichtsaktivitäten mit Canva AI vorbereiten

Individuelle Unterrichtsaktivitäten mit Canva AI vorbereiten

5Min

Einsteiger

Leitfaden
Pro
Erstelle mit Canva AI einen Post für alle Kanäle

Erstelle mit Canva AI einen Post für alle Kanäle

Erstelle mit Canva AI einen Post für alle Kanäle

4Min

Einsteiger