Unter allen Website-Baukästen für kleine Unternehmen hat Wix in letzter Zeit die meiste Aufmerksamkeit bekommen (ganz zu schweigen vom Marktanteil). Aber selbst wenn dir Designstil und Preise gefallen, bedeutet das nicht, dass du weißt, wie man eine Wix-Website erstellt.

wie man eine Wix website erstellt illustration
Illustration von OrangeCrush

Wix verfügt über einen nutzerfreundlichen WYSIWYG-Editor und günstige Preise, sowie einer umfangreichen Auswahl an Templates, mit denen du direkt loslegen kannst, und liegt damit direkt hinter Squarespace. Selbst wenn du keinerlei Erfahrung mit Webdesign hast, kannst du mit Wix problemlos Seiten erstellen – oder einfach die Lücken in einem Standard-Template ausfüllen, wenn du überhaupt nicht designen möchtest.

Aber wie funktioniert es? In dieser Anleitung werden wir erklären, wie man eine Wix-Website erstellt, angefangen bei der Einrichtung bis hin zum Designen deiner Webseiten. Wir besprechen sogar, wie du eine Wix-Website vom Netz nimmst, falls du Probleme damit hast. Aber bevor wir loslegen können, musst du dich anmelden, also beginnen wir ganz am Anfang.

Wie du einen Wix-Account einrichtest

Lass uns als Erstes nicht nur ansehen, wie man sich bei Wix anmeldet, sondern auch, welche Preismodelle es gibt, damit du weißt, welches das beste für dich ist.

1. Gehe zuerst auf die Website von Wix.

2. Um loszulegen, klicke auf den großen Button, auf dem Eigene Website erstellen steht. Du kannst auch rechts oben auf Anmelden klicken – beide Links führen auf dieselbe Seite.

screenshot wix website

3. Jetzt bist du auf der Login-Seite, aber du musst zuerst einen Account erstellen. Klicke oben auf Anmelden.

screenshot wix website log in

4. Nun bist du auf der Anmelde-Seite. Die ist ziemlich deutlich: Gib einfach die E-Mail-Adresse ein, die du benutzen möchtest, oder melde dich mit deinem Facebook- oder Google-Account an.

screenshot wix website anmeldung

5. Von hier aus kommst du zu einem Onboarding-Fragebogen, der dir hilft, Wix für dich zu personalisieren. Du kannst ihn zwar überspringen, aber die Fragen beeinflussen, welche Vorlagen für dich empfohlen werden und wie automatisiert die Seite erstellt wird.

screenshot wix website

6. Und schließlich hast du zwei Auswahlmöglichkeiten: Erstelle die Seite selbst auf Grundlage eines Templates oder lasse sie von der ADI (Artificial Design Intelligence) automatisch erstellen. Sie selbst zu erstellen dauert länger, aber du kannst sie besser personalisieren, wohingegen die ADI dir eine fertige Seite in Nullkommanichts liefert, allerdings ohne Personalisierung.

Natürlich kannst du deine ADI-Seite später auch noch anpassen, aber wenn du dir sowieso die Hände schmutzig machen willst, kannst du auch gleich mit dem Template beginnen, für das du dich entschieden hast. Für diese Anleitung nutzen wir die Option Erstelle deine Website mit dem Editor.

screenshot wix website

Wie du eine Wix-Website mithilfe einer Vorlage erstellst

1. Du musst auf die Wix-Vorlagenseite gehen, entweder indem du den Schritten oben folgst oder hier klickst.

Eine Vorlage auszuwählen gehört zu den wichtigsten Designentscheidungen. Achte darauf, wie die Vorlagen deine Seite gliedern, besondern die Navigation und das User Interface. Du kannst deine Bilder oder Farbschemata jederzeit ändern, aber den Aufbau deiner Seite umzustrukturieren ist weitaus schwieriger.

Glücklicherweise lassen sich auf Wix Vorlagen leicht nach Kategorien durchsuchen. Auf der linken Seite siehst du die Vorlagen geordnet nach Branche (Unternehmen), Art der Produkte, die verkaufst (Online-Shop), Themes für Portfolios von Kreativen oder Unternehmen (Kreative Künste), Themes für andere Organisationen wie Events oder gemeinnützige Organisationen oder Stile für einen Blog.

screenshot wix website vorlagenauswahk

2. Schau dir ein paar Vorlagen an, bis du eine gefunden hast, die dir gefällt. Denke daran, dass die Bilder meist ausgetauscht werden können (wenn du dir die Mühe machst), also konzentriere dich mehr auf Struktur und Nutzerfreundlichkeit. Du kannst dir ein Beispiel der Vorlage ansehen, indem du mit der Maus über eine Auswahl fährst und auf Ansehen klickst. Du kannst aber auch direkt mit dem Bearbeiten loslegen, indem du auf Bearbeiten klickst.

screenshot wix website vorlagen

3. Du kannst eine Website auch auf einer leeren Arbeitsfläche erstellen. Klicke dazu einfach in der linken Leiste auf Leere Vorlagen. Diese „maximal minimalistischen“ Vorlagen lassen dich eine Seite komplett von Grund auf erstellen, falls dir keine der Vorlagen gefällt.

screenshot wix website vorlagen

Für welches Preismodell du dich entscheiden solltest

Wix bietet einen ziemlich großzügigen kostenlosen Website-Baukasten inklusive Hosting, daher müsstest du theoretisch überhaupt nicht für Wix bezahlen. Allerdings hat ein kostenloser Account einige Nachteile:

  • Zwingende Werbung auf deiner Seite
  • Sobald die Seite veröffentlicht ist, kann die Vorlage nicht verändert werden
  • Willkürliche URL

Wenn es dir mit deiner Website  ernst ist, lohnt es sich, in ein Premium-Abo zu investieren, um mehr Funktionen und Freiheiten zu erhalten. Und wenn du upgraden möchtest, solltest du dies am besten tun, bevor du mit dem Designen beginnst, damit du nicht alles noch einmal von vorn machen musst.

1. Wenn du einen Premium-Account möchtest, klicke im Website-Editor oben auf auf Premium. Du wirst aufgefordert, deine Seite zu speichern, falls du das nicht schon getan hast, und hast die Möglichkeit, deine individuelle Domain zu registrieren.

screenshot wix website

2. Wix bietet 4 Premium-Modelle für Standard-Webseiten und 3 Premium-Modelle für E-Commerce-Seiten. Vergleiche die Funktionen und Vorteile unten, um zu sehen, welches sich am besten für dich eignet, und klicke dann auf Auswählen.

Standard:

screenshot wix website preise

E-Commerce:

screenshot wix website preise

3. Als Nächstes wählst du, welches Abo du möchtest oder für wie lange du abonnieren möchtest. Wie die meisten Seiten bietet auch Wix Rabatte, je länger die Laufzeit ist, allerdings musst du das gesamte Abo direkt bezahlen.

screenshot wix website zeitraum

4. Als Letztes kommt der Checkout, wo du deine Zahlungsinformationen eingibst. Wix akzeptiert alle gängigen Kreditkarten und ein paar internationale Banken. Wenn du fertig bist, klicke auf Kauf abschließen und warte auf die Bestätigung.

screenshot wix website kaufabschluss

5. Sobald du deinen Account upgegradet hast, stehen dir alle Funktionen deines gewählten Abos zur Verfügung. Das bedeutet, dass es nun an der Zeit ist, die Ärmel hochzukrempeln und mit dem Designen zu beginnen. Du kannst deine Seite jederzeit veröffentlichen, aber wir empfehlen, sie zuerst noch aufzupolieren.

Wie man eine Wix-Website erstellt und designt

Nachdem du deine Vorlage gewählt hast, kannst du dich auf dem Seiten-Editor umschauen und alles nach deinen Wünschen anpassen. Obwohl das Interface recht nutzerfreundlich ist, kann es zunächst etwas überwältigend sein, daher erklären wir hier einige der grundlegenden Bedienelemente.

Funktionalität

Im Grunde klickst du einfach auf den Bereich, den du bearbeiten willst, und dann erscheint das Bearbeitungsmenü. Du möchtest das Navigationsmenü ändern? Dann klicke es an. Du möchtest das Hintergrundbild ändern? Dann klicke es an. Du möchtest den Text umschreiben? Dann klicke ihn an. Das einzige Problem ist, dass einige Elemente sich überlappen, daher kann es sein, dass du manchmal ein paar Mal klicken musst, bis du das ausgewählt hast, was du auswählen möchtest.

Wenn du ein Element doppelklickst, erscheint ein spezielles Bearbeitungsfenster mit noch mehr Einstellungsmöglichkeiten. Welche Einstellungsmöglichkeiten erscheinen, hängt von der Art des Elements ab.

Alle Elemente haben unterschiedliche Einstellungsmöglichkeiten, aber du wirst sehen, dass manchmal dieselben Symbole verwendet werden (z. B. Animation). Wir erklären diese Einstellungen weiter unten genauer.

Obere Navigation

screenshot wix website navigation

Das obere Navigationsmenü (des Wix-Editors, nicht der Seite, die du bearbeitest) enthält alle Aktionen, die nicht direkt mit der Bearbeitung zusammenhängen. Hier ist eine kurze Erläuterung der Aktionen, von links nach rechts.

  • Seite:_____ – Gehe zu einer anderen Seite oder manage all deine Seiten
  • Symbole für Desktopansicht und Mobilansicht – Wähle zwischen Desktopansicht und Mobilansicht (für responsivere Mobilseiten)
  • Website – Aktionen für die gesamte Seite, beispielsweise Speichern, Kopieren oder in den Papierkorb verschieben
  • Einstellungen – Dies ist ein wichtiger Bereich, in dem du alles einstellst, was sich hinter den Kulissen deiner Website abspielt, einschließlich Analyse, Soziale Netzwerke, SEO und dein Favicon. Wenn du etwas Zeit hast, lohnt es sich, diese nach deinen Wünschen anzupassen.
  • Ansicht – Betrifft die Darstellung des Editors. Hier stellst du ein, welche Hilfsmittel im Editor angezeigt werden sollen und welche nicht.
  • Dev-Modus – Obwohl sich die Seite derzeit nur in der Vorschau befindet, bietet dieser Modus technischere Optionen wie die Anpassung des Codes oder die Verbindung zu externen APIs.
  • Hilfe – Hier findest du den Hilfebereich.

Ganz rechts:

  • Lupe – Hier kannst du die Ansicht deiner Seite vergrößern oder verkleinern.
  • Nach links gebogener Pfeil – Mache die vorherige Aktion rückgängig.
  • Nach rechts gebogener Pfeil – Stelle die Aktion wieder her, die du gerade rückgängig gemacht hast.
  • Speichern – Hier speicherst du deine Seite manuell.
  • Vorschau – Gehe in den Vorschau-Modus, in dem du deine Seite so nutzen (aber nicht bearbeiten) kannst, als ob sie veröffentlicht wäre.
  • Veröffentlichen – Veröffentliche deine Seite.

Linkes Menü

All deine Bearbeitungsoptionen befinden sich in der Leiste auf der linken Seite. Denke daran, dass du manchmal auf unterschiedliche Weisen auf dieselben Seiten zugreifen kannst, also lass dich nicht davon verwirren, wenn du denselben Eintrag zweimal siehst.

screenshot wix website seitennavigation

Von oben nach unten:

  • Menüs & Seiten – Hier kannst du deine gesamte Seite managen und zum Beispiel Seiten hinzufügen oder umbenennen oder angeben, welche Seiten im Navigationsmenü deiner Seite angezeigt werden sollen.
  • Hintergrund – Ändere das Hintergrundbild, egal ob Foto, Video oder einfach eine Farbe, und schaue dir vorgefertigte Designs an.
  • Hinzufügen – Eines der wichtigsten Werkzeuge. Hier kannst du neue Elemente hinzufügen. Manche Leute werden sich damit zufriedengeben, die Texte und Bilder der Vorlage zu bearbeiten, aber wenn du dir besonders viel Mühe geben möchtest, kannst du Elemente wie Buttons, Kontaktformulare, Lightboxen und vieles weitere hinzufügen.
  • Apps hinzufügen – Dieser Button führt dich zum Wix App Store, wo du spezielle Add-ons hinzufügen oder kaufen kannst, um zusätzliche Funktionen zu erhalten.
  • Medien – Hier kannst du eigene Bilder hochladen, die Bilderbibliothek von Wix durchstöbern oder einen Fotoeditor nutzen, um sie aufzuhübschen.
  • Drauflos bloggen – Dies ist die zentrale Steuerung für deinen Blog (wenn du einen hast). Hier kannst du Posts hinzufügen oder bearbeiten und den Aufbau deines Blogs managen.
  • Wix Bookings – Nutze das Booking-Widget von Wix, über welches Nutzer einen Termin auf deiner Seite buchen können.

Sobald du deine Seite veröffentlichst, hast du auch die Möglichkeit, dein E-Mail-Marketing einzurichten, auch wenn dies rein optional ist.

Schwebemenü

screenshot wix website schwebemenü

Es gibt auch ein freischwebendes Menü, das sich von Hause aus auf der rechten Seite befindet. Dieses Menü enthält die üblichen Bearbeitungssymbole, von denen du die meisten kennen solltest, beispielsweise Kopieren, Löschen und Ausrichtung.

Dieses Menü ist besonders hilfreich, um die Platzierung der Elemente zu optimieren, da du hier die genauen Koordinaten (in Pixeln) eingeben kannst. Außerdem gibt es Optionen, um Bilder zu drehen oder zu neigen, und du kannst festlegen, wie die Ebenen angeordnet sein sollen.

Da diese Einstellungen alle optional sind, kannst du dieses Menü auch komplett schließen, um deine Seite besser sehen zu können.

Element-Menü

Wie wir oben bereits erwähnt haben, öffnet sich beim Klicken auf jedes Element wie Text oder Button ein Bearbeitungsmenü für dieses Element und ein Doppelklick öffnet ein neues Fenster. Jedes Element hat unterschiedliche Optionen. Wenn du zum Beispiel auf einen Text klickst, öffnet sich ein gewöhnlicher Texteditor, wohingegen ein Doppelklick auf das Hintergrundbild den Hintergrundbild-Editor öffnet.

screenshot wix website editing menü

Die Befehle sind ziemlich selbsterklärend, daher empfehlen wir, dass du sie dir einfach ein wenig anschaust. Wenn du einen bestimmten Teil eines Elements ändern möchtest, schau dir das Fenster an, das sich öffnet, und du solltest die Option finden, nach der du suchst.

Bevor wir weitermachen, gibt es allerdings ein paar Befehle, die besonders erwähnenswert sind.

  • Scroll-Effekte [Symbol sieht aus wie eine fallende Box] – Diese beeinflussen Animationen, wenn Nutzer herunterscrollen, beispielsweise Parallax- oder Zoom-Effekte. Sie können ansonsten eher faden Seiten etwas Flair verpassen, aber achte auf die Ladezeiten und Lagging.
  • Animation [Symbol sieht aus wie eine sich nach rechts bewegende Box] – Für kleinere Elemente wie einem Textblock oder einzelnen Bildern kannst du animierte Effekte hinzufügen, wie sie das erste Mal erscheinen sollen: hüpfend, verblassend, drehend etc.
  • Layouts [Symbol sieht aus wie eine in Kästchen unterteilte Seite] – Hier kannst du einstellen, wie viele Spalten ein Abschnitt hat und welche Ausrichtung sie nutzen sollen, falls du die Struktur deiner Seite ändern möchtest.
  • Strecken [Symbol sieht aus wie ein Strich mit Pfeilspitzen an beiden Enden] – Hiermit bekommst du all deine Elemente auf einer Seite unter; du kannst mit den Randgrößen spielen, bis du verstanden hast, wie es funktioniert.
  • Seiten-Design [Pinsel-Symbol] – Wenn dein Hintergrund aus einer einzelnen Farbe besteht, kannst du ihn hier bearbeiten.
  • Hilfe [Fragezeichen-Symbol] – Shortcut zum Hilfe-Fenster

Wix hat viele Optionen und das Ziel, so nutzerfreundlich wie möglich zu sein. Wenn du also nicht weißt, wie du etwas machen sollst, stehen die Chancen recht gut, dass du es durch ein wenig Experimentieren herausfindest. Außerdem kannst du auch jederzeit die Hilfe nutzen.

Wie du eine Wix-Website wieder aus dem Netz nimmst

Eine der größten Sorgen ist die Frage, wie man eine Wix-Website wieder aus dem Netz nimmt. Die Plattform macht es ziemlich einfach, eine Seite zu veröffentlichen, aber nicht ganz so einfach, sie zu löschen. Aber wenn man erst mal weiß wie, ist es eigentlich ziemlich simpel:

1. Gehe in deinen Account.

2. Scrolle im Menü auf der linken Seite herunter und gehe auf Einstellungen. Schaue oben links noch einmal, ob du auch wirklich in der Seite bist, die du aus dem Netz nehmen möchtest.

screenshot wix website einstellungen

3. In den Einstellungen findest du den Punkt Überblick. Dort lautet der dritte Punkt Status. Klicke auf Veröffentlichung widerrufen auf der rechten Seite.

screenshot wix website unveröffentlichen

4. Dann öffnet sich ein Fenster. Klicke einfach auf Veröffentlichung widerrufen und deine Wix-Website ist wieder offline.

screenshot wix website

Leicht zu benutzen, aber nicht leicht zu designen

Wix ist einfach zu nutzen. Das jedoch bedeutet nicht zwingend, dass das Designen dadurch einfacher wird. Eine erfolgreiche Website zu kreieren, erfordert Webdesign-Kenntnisse, die wiederum Grafikdesign-Kenntnisse erfordern. Auch wenn du vielleicht in der Lage bist, eine vollfunktionsfähige Seite ohne jegliche Webdesign-Erfahrung zu kreieren, solltest du die Hilfe eines Profis in Anspruch nehmen, wenn du das volle Potenzial deiner Seite ausschöpfen willst.

99designs Webdesign Services hilft dir, einen professionellen Designer zu finden, der am besten zu deinem Stil und deinen Unternehmenszielen passt. Du kannst dir unsere besten Webdesigner selbst anschauen, um jemanden zu finden, der dir gefällt, oder einen Designwettbewerb starten, bei dem mehrere Designer dir Designkonzepte schicken, und einfach das Design auswählen, das dir am besten gefällt.

Du möchtest die perfekte Website für dein Unternehmen?
Dann arbeite mit unseren talentierten Designern.