Webseite leicht gemacht

Yara Burkhalter
Studentin Multimedia Production FHGR
  • 24.06.2024
  • 4 min
Tipps und Tricks für Anfänger oder die, die nicht so viel Zeit haben.

Webdesign mit einem Pagebuilder interessiert mich, sodass ich für meinen Bruder (einen Schweizer Biathleten) eine Webseite erstellt habe. Obwohl ich anfangs keinerlei Vorkenntnisse hatte, konnte ich dabei wertvolle Erfahrungen sammeln. Im Laufe der Zeit habe ich viele Dinge gelernt, von denen ich wünschte, ich hätte sie bereits zu Beginn gewusst, da sie mir viele Stunden erspart hätten. In diesem Beitrag teile ich deshalb die wichtigsten Erkenntnisse, die man bei der Erstellung einer einfachen Webseite beachten sollte.

Zu meiner erstellten Webseite: joschaburkhalter.ch

Erste Schritte

  1. Domain
    • Auswahl und Registrierung eines Domainnamens bei einem Hosting-Anbieter. (z.B. Hosttech)
  2. Hosting-Paket
    • Auswahl eines Hosting-Pakets (z.B. Hosting Special)
  3. Installation WordPress
    • Über das hosttech-Dashboard kann die Installation von WordPress durchgeführt werden. Viele Hosting-Anbieter bieten eine Ein-Klick-Installation für WordPress an, was den Prozess erheblich vereinfacht.
  4. Einstellungen im Control Panel
    • SSL-Zertifikat
    • Datenbank und DatenbanknutzerIn im Control Panel erstellen
      •  Im Bereich „Datenbanken“ auf „MySQL-Datenbanken“ eine neue Datenbank anlegen und ihr einen passenden Namen geben.
      • Einen neuen Benutzer erstellen, dann der zuvor erstellten Datenbank zuweisen, ein sicheres Passwort festlegen und ihm alle Berechtigungen erteilen.
    • Datenbankverbindung unter Dateien im ‘wp-config.php’ File herstellen, indem folgender Abschnitt bearbeitet wird.
      • define(‹DB_NAME›, ‹deine_datenbank_name›);
      • define(‹DB_USER›, ‹dein_datenbank_benutzer›);
      • define(‹DB_PASSWORD›, ‹dein_datenbank_passwort›);
      • define(‹DB_HOST›, ‹localhost›); // oder der spezifische Hostname deines Providers
  5. WordPress-Einstellungen
    • Website-Titel und Untertitel festgelegt.
    • Permalink-Struktur angepasst (empfohlen wird „Beitragsname“).
    • Zeitzone, Datum und Zeitformate usw.
  6. Elementor installieren
  7. Theme auswählen
  8. Seiten erstellen, evtl. Templates benutzen
    • Home, About, Contact usw.
    • Impressum und Datenschutz (Vorlagen im Internet)
  9. Gestalten
    • Elemente und Widgets hinzugefügt (Texte, Bilder, Buttons, Formulare etc.).
    • Design und Layouts festgelegt (Farben, Schriftarten, Abstände etc.)
    • Responsives Design machen
  10. Feinschliff
    • Navigation erstellen (Backend: Design -> Menü)
    • Links, Buttons usw. testen

Good to know

  1. Regelmässige Backups und Updates der Plugins (können automatisch eingestellt werden)
  2. Templates von Elementor nutzen
  3. Elementor auf Englisch einstellen, damit sind einfacher Tutorials auf Youtube zu finden
  4. Responsives Design beachten
  5. Suchmaschinenoptimierung mit Plugin (z.B. Yoast SEO)
  6. Performance verbessern und Ladezeiten verkürzen mit Plugin (z.B. WP Super Cache / W3 Total Cache)
  7. Bilder komprimieren (Smush / ShortPixel) ohne Qualitätsverlust
  8. Sicherheits-Plugins (Wordfence / Sucuri), um vor Hackerangriffen zu schützen
  9. E-Mail erstellen (info@deinedomain.ch

Logo

  • Erstelle ein simples Logo z.B. aus Buchstaben des Namens und/oder der Unternehmenstätigkeit.

Design

  • Entscheide dich am Anfang bereits für 4-5 Farben, die du nutzen möchtest. Beachte dabei, dass gerade für Buttons und Text der Kontrast klar ist. 
  • Schreibe im Voraus deine Texte, die auf die Webseite müssen. Überlege dir auch aussagekräftige Stichworte, die du evtl. als eigene Elemente und/oder mit Icons einbauen kannst. Beachte dabei unbedingt, dass heutzutage nicht mehr gerne lange gelesen wird.

Struktur

  • Überlege dir eine grobe Struktur der Inhalte. Wie viele Unterseiten möchtest du?
  • Welche Texte können mit Icons oder aufklappbaren Elementen dargestellt werden?
  • Habe Fotos und Bilder bereit, die deine Webseite und Botschaft unterstützen

No Go’s

1. Zu viele Plugins installieren
2. Unsichere Plugins verwenden
3. Designüberladung und unprofessionelle Schriftarten
4. Fehlende Backups
5. Keine Bildoptimierung -> führt zu langer Ladezeit der Webseite
6. Inaktuelle Inhalte
7. Installation von Elementor -> elementor.com -> Abo bestellen -> zip-datei herunterladen -> zip-datei im Plugin-Bereich bei «neu erstellen» hochladen

Dieser Artikel wurde als Erstpublikation auf digezz.ch veröffentlicht.

Kommentare