Website & Editor: Abschnitte, Design, SEO und Veröffentlichen
Mit dem Website-Editor von ArtistNest baust du deine eigene Artist-Website aus fertigen Bausteinen zusammen, passt Farben, Schrift und Stil an dein Projekt an und stellst sie mit einem Klick online. In diesem Artikel zeigen wir dir Schritt für Schritt, wie du den Editor öffnest, Abschnitte hinzufügst und anordnest, das Design anpasst, deine SEO-Angaben pflegst, eine Vorschau ansiehst und deine Website veröffentlichst – wahlweise sofort oder zu einem geplanten Zeitpunkt.
Den Website-Editor öffnen
- 1Öffne im Dashboard den Bereich Websites.
- 2Suche in der Tabelle Websites die Website, die du bearbeiten möchtest.
- 3Klick in der Zeile auf Editor. Der Website-Editor öffnet sich.
Oben im Editor siehst du den Namen deiner Website und ein Status-Badge: Live (veröffentlicht), Privat (noch nicht veröffentlicht) oder Entwurf, wenn du ungespeicherte Änderungen hast. Deine Änderungen an den Abschnitten werden automatisch als Entwurf gespeichert – sie gehen also nicht verloren, sind aber erst nach dem Veröffentlichen öffentlich sichtbar.
Der Editor ist in zwei Bereiche aufgeteilt: links die Tabs Abschnitte und Design, rechts die Live-Vorschau. Auf dem Smartphone wechselst du stattdessen über die Tabs Abschnitte, Design und Vorschau.
Abschnitte hinzufügen, bearbeiten und anordnen
Deine Website besteht aus einzelnen Abschnitten (Sections). Header und Footer sind feste Bestandteile und werden automatisch verwaltet. Alle weiteren Abschnitte fügst du selbst hinzu.
Einen Abschnitt hinzufügen
- 1Öffne links den Tab Abschnitte.
- 2Klick unten auf Abschnitt hinzufügen.
- 3Wähle im Fenster Abschnitt hinzufügen eine Vorlage (z. B. Hero, Text, Releases, Featured Release, Live-Termine, Galerie, Video, Newsletter oder Contact).
- 4Hat die Vorlage mehrere Darstellungen, wählst du anschließend im Schritt Variante … wählen die passende Variante aus.
- 5Der Abschnitt wird hinzugefügt und öffnet sich direkt zum Bearbeiten.
Einen Abschnitt bearbeiten
- 1Klick im Tab Abschnitte auf den gewünschten Abschnitt.
- 2Fülle die Felder aus – je nach Abschnitt zum Beispiel Überschrift, Inhalt, Button Text, Button Link oder die Anzahl der angezeigten Einträge.
- 3Deine Eingaben erscheinen sofort in der Live-Vorschau rechts und werden automatisch als Entwurf gespeichert.
Abschnitte anordnen
- 1Greife im Tab Abschnitte einen Abschnitt und zieh ihn per Drag-and-drop an die gewünschte Position.
- 2Die Reihenfolge in der Liste entspricht der Reihenfolge auf deiner Website.
Um einen Abschnitt zu entfernen, nutzt du die Lösch-Funktion am Abschnitt und bestätigst im Dialog Abschnitt löschen.
Design, Skin und Farben anpassen
Über den Tab Design legst du den Look deiner Website fest. Design-Änderungen an Farben und Schrift werden erst mit Design speichern übernommen und sind unabhängig vom Veröffentlichen.
Farben und Schrift
- 1Öffne den Tab Design und gehe zum Bereich Farben & Schrift.
- 2Stelle die Farben ein: Hintergrundfarbe (hinter den Abschnitten), Textfarbe (Standard-Textfarbe) und Akzentfarbe (für Buttons und Hervorhebungen).
- 3Wähle unter Schriftart die gewünschte Schrift aus.
- 4Klick auf Design speichern, um die Änderungen zu übernehmen. Mit Verwerfen setzt du sie zurück.
Design-Presets als Startpunkt nutzen
- 1Gehe im Tab Design zum Bereich Design-Presets.
- 2Sieh dir die Farben des gewünschten Presets an und klick auf Preset-Farben übernehmen.
- 3Die Farben werden in Farben & Schrift übernommen. Du kannst sie anschließend frei weiter anpassen. Speichere mit Design speichern.
Design-Skin wählen
- 1Gehe im Tab Design zum Bereich Design-Skin.
- 2Wähle einen Skin aus. Der Skin bestimmt Typografie-Skala, Abstände und Form – deine Farben und die Schriftart bleiben davon unberührt.
- 3Der Skin wird sofort gespeichert und in der Vorschau angewendet.
Vorschaubild festlegen
- 1Gehe im Tab Design zum Bereich Vorschaubild.
- 2Lade ein Bild hoch (Formate: .png, .jpg, .jpeg, .webp, .gif; empfohlen 1200 × 630 Pixel, max. 10 MB).
Das Vorschaubild wird als Vorschau verwendet, wenn deine Website zum Beispiel in sozialen Netzwerken oder Messengern geteilt wird.
SEO und Meta-Angaben pflegen
- 1Öffne die Einstellungen der Website.
- 2Trage im Feld Name den Titel deiner Website ein. Dieser Name wird auch als Seitentitel (Meta-Title) bei Google verwendet – halte ihn kurz (max. 32 Zeichen empfohlen) und aussagekräftig.
- 3Über das Vorschaubild im Design-Panel legst du fest, welches Bild beim Teilen erscheint.
- 4Optional kannst du im Feld 404-Seiten-Text den Hinweis anpassen, der angezeigt wird, wenn eine Seite nicht gefunden wird.
Die Beschreibung deiner Website legst du beim Erstellen im Feld Beschreibung an; sie wird unter anderem als Meta-Beschreibung und Vorschautext verwendet.
Vorschau ansehen
- 1Sieh dir im Editor jederzeit die Live-Vorschau rechts an – sie zeigt deinen aktuellen Entwurf mit allen Abschnitten und Designeinstellungen.
- 2Möchtest du die Seite so sehen, wie sie öffentlich erscheint, klick oben auf Vorschau öffnen. Die Seite öffnet sich in einem neuen Tab.
Website veröffentlichen
- 1Klick oben rechts auf den grünen Button Website veröffentlichen.
- 2Deine Website ist anschließend live. Das Status-Badge wechselt auf Live.
- 3Hast du danach weitere Änderungen vorgenommen, heißt der Button Änderungen veröffentlichen. Klick darauf, um die aktualisierte Version live zu schalten.
- 4Möchtest du die Website wieder offline nehmen, klick auf Offline nehmen.
Veröffentlichung planen
- 1Klick im Editor unter der oberen Leiste auf Veröffentlichung planen ….
- 2Wähle im Datums- und Uhrzeitfeld den gewünschten Zeitpunkt aus.
- 3Klick auf Planen.
- 4Es erscheint ein Hinweis, dass die Veröffentlichung geplant ist. Bis dahin bleibt die zuletzt veröffentlichte Version live. Über Abbrechen kannst du die geplante Veröffentlichung wieder entfernen.
Tipps
- Mit Vorschau gegenchecken: Klick vor jeder Veröffentlichung auf Vorschau öffnen, um deine Seite genau so zu sehen, wie sie deine Fans erleben.
- Erst Farben, dann Skin: Übernimm bei Bedarf zuerst ein Design-Preset als Startpunkt, passe die Farben an und wähle danach einen Design-Skin.
- Name kurz halten: Da der Name deiner Website als Seitentitel bei Google dient, wähle einen kurzen, klaren Titel.
Noch Fragen?