1. Projektarbeit HTML & CSS – SEO & WordPress

CSS Logo

Inhaltsverzeichnis

Aufgabenstellung

Projekt: Erstelle eine Seite mit WordPress und erreichen Sie gute Platzierungen zu dem gegebenen Suchbegriff

Beschreibung: Es soll eine einfache Seite mit dem CMS WordPress erstellt werden, die anschließend inhaltlich auf einen gegebenen Suchbegriff optimiert wird, um mit diesem in den Suchergebnissen gefunden zu werden.

  • Die Suchbegriffe bestehen aus folgendem Schema: „Webdesign + Agentur + Stadtname
  • Die Domain lauten entsprechend: www.webdesign-agentur-stadtname.de
  • Jeder erhält einen eigenen Stadtnamen

Vorbereitung

  1. Lege einen Projektordner in MicrosoftTeams an und benenne ihn in Kleinschrift nach Deiner Domain
    • Lege in diesem Ordner all Deine Rechercheergebnisse, Bilder und sonstigen Inhalte ab und benenne ordentlich (die Organisation & Ordnerstruktur fließt in die Benotung ein)
    • Lege auch ein Dokument an, auf dem Du Zugangsdaten speicherst
  2. Installiere WordPress auf dem Server (unter Anleitung von Lehrkraft)
  3. Lege eine Email-Adresse an: info@der-domainname-deines-projekts.de und leite alle eingehenden Mails auf Deine IFB-Adresse weiter. Sendet euch gegenseitig Mails an die o.g. info@-Adresse, um die Weiterleitung zu prüfen.
  4. Logge Dich auf WordPress ein und installiere das Plugin „Updraft-Plus“
  5. Lade das von der Lehrkraft vorgegebene Backup hoch (unter Anleitung von Lehrkraft)
  6. Recherchiere die Farben der Zielstadt und hinterlege diese im Customizer der Website (unter Anleitung von Lehrkraft)
  7. Erstelle 3 fiktive Personen (diese sollten realistisch wirkende Namen haben und für das Impressum etc. verwendet werden)
  8. Recherchriere den Begriff „SEO“
    • Was bedeutet er auf deutsch?
    • Welche Teilbereiche von SEO gibt es?
    • Welche Möglichkeiten der Analyse gibt es?
    • Welche kostenlosen Tools gibt es?
      • Erstelle Dir eine Liste von kostenlosen Tools, die Du später verwenden wirst.
      • Ein wichtiges Werkzeug ist das sog. WDF/IDF Tool – suche nach einem kostenlosen Anbieter, um Deine Texte zu optimieren
      • Von wo bekommst Du kostenlos Backlinks für Dein Projekt – (z. B. kostenlose Branchenportale – gibt es Auflistungen von kostenlosen Branchenportalen, auf welchen Du Dein Projekt eintragen kannst?)
  9. Recherchiere die wichtigsten Hebel von Local SEO und mache Dir Notizen
    • Recherchiere passende Suchbegriffe und regionale Entitäten rund um Deine Zielregion „Stadtname“ und mache Dir Notizen. Die Begriffe rund um das Thema „Webdesig & Agentur“ werden vorgegeben.
  10. Recherchiere die 5 Top-Platzierten Mitbewerber zu dem Suchbegriff Deinem Suchbegriff und notiere Dir diese
    • Mache zudem Notizen zu den Inhalten auf der URL, die gut zu dem Suchbegriff platziert wurde
      • Welche Inhalte sind besonders toll?
      • Was möchtest Du auf Deiner eigenen Seite übernehmen?

Material- und Werkzeugsammlung:

Keywordrecherche Webdesign: https://webentwicklerkurs.de/wp-content/uploads/2025/02/Keywordrecherche-Webdesign.xlsx

Für Projekt-Teil 1 – OnPage SEO:

Kostenlose Bilder: https://pixabay.com/ (Bilder von Personen, Städten & Hintergründen) | https://www.pexels.com/de-de/ | https://unsplash.com/de/images/stock | https://de.freepik.com/fotos-beliebt + Deine eigenen Rechercheergebnisse…
Kostenlose Icons: https://www.flaticon.com/ (Kostenlose Icons) + Deine eigenen Rechercheergebnisse…
Keyword-Recherche: https://keywordtool.io/ | https://www.keyword-tools.org/ | https://www.seobility.net/de/keyword-recherche-tool/ | https://app.sistrix.com/de/keyword-tool/ | https://seranking.com/de/keyword-recherche.html + Deine eigenen Rechercheergebnisse…
Logo Erstellung: https://www.canva.com/ | Hier existiert ein Zugang, der der Reihe nach verwendet werden kann
WDF/IDF: https://www.wdfidf-tool.com/ | https://www.seobility.net/de/wdf-idf-tool/ | https://www.wdfidf-tool.com/wdfidf-textassistent/ | https://wdfidf.net/wdfidf-tool

Für Projekt-Teil 2 – OffPage SEO

Backlink-Checker für die Mitbewerber-Recherche: https://www.backlink-tool.org/ | https://ahrefs.com/de/backlink-checker | https://www.seobility.net/de/backlinkcheck/ | https://seranking.com/de/backlink-checker.html + Deine eigenen Rechercheergebnisse…
Kostenlose Backlinks: https://www.onlinesolutionsgroup.de/blog/die-30-wichtigsten-branchenbuecher-und-verzeichnisse/ | https://dein-seo-kurs.de/liste-kostenlose-branchenbuecher/ (nutze zum Eintragen von Backlinks deine zuvor angelegte info@-Adresse) !!!Wichtig: Starte erst mit dem Erstellen von Backlinks, wenn Teil 1 der Arbeit von der Lehrkraft abgenommen wurde!!!

Linkmöglichkeiten:

Login zum Hosting: https://kas.all-inkl.com/index.php
Schema Passwort bei Domain: WebAgeSta1234
Login: wird separat mitgeteilt

Zeitrahmen: 24 Schulstunden

Bewertungskriterien:

Die Projekte werden anhand der folgenden Kriterien bewertet:

  • Einwandfreie Rechtschreibung (KI ist erlaubt)
  • Vollständigkeit
  • Projekt-, Datei- und Ordnerstruktur in MicrosoftTeams
    • Sind die Ordner und Dateien passend und in einem konsistenten Schema benannt, oder wild durcheinander?
    • Findet man sich in der Ordnerstruktur zurecht, oder muss man lange suchen?
  • Wurden die Inhalte passend erstellt? Gibt es auf der Startseite (Homepage) folgende Sektionen?
    • Bannersektion (vorgegeben)
    • Sektion Leistungsübersicht (Grundstruktur vorgegeben) kann noch um weitere Punkte erweitert werden
    • Sektion Anfahrt (vorgegeben)
    • Sektion Leistungsdetails (frei gestaltbar)
      • Existiert eine ausreichende HTML-Vielfalt? (Tabellen, Listen, Sprungmarken, Fettungen, Kursivschreibungen)
      • Wurden auch alle Unterkeywords & Nebenkeywords im Inhalt untergebracht?
      • Werden ausreichend viele und auch passende Bilder verwendet?
      • Werden die Inhalte ansprechend angeordnet? Stimmen die Abstände?
    • Sektion Referenzen (Bilder von einer Branche mit passenden Postleitzahlen und Straßennahmen des fiktiven Unternehmens)
      • Tipp: Referenzbilder können mit folgendem Werkzeug erstellt werden: https://screenshot.guru/
        • mache hierfür Bildschirmfotos von Website-Dummys – !!!nicht von echten Websites!!!
        • Website-Dummys findest Du hier: https://wpastra.com/website-templates/business/
        • Zum erstellen eines Bildschirmfotos, klickst Du bei einem Dummy auf „Live Preview“ und gibst die URL des Dummys in den Screenshot-Guru ein
        • Achte auf eine SEO-konforme Benennung der Bildschrimfotos mit Deinen Keywords
      • Wurden mindestens 6 fiktive Referenzen aus unterschiedlichen Branchen erstellt? (z. B. Zahnarzt, Anwalt, Handwerker, Online-Shop, Gastronomie, Hotellerie, Tourismus….)
      • Sektion Kontaktaufnahme (vorgegeben)
  • Umfang der Optimierung
    • Wurde WDF/IDF optimiert?
    • Wurden die Bilder optimiert? (Bilddateinamen, Alt-Attribute, Titel-Attribute)
    • Wurden Seitentitel und Meta-Description optimiert?
    • Enthalten die Überschriften passende Keywords?
    • Wurden für alle wichtigen Intentionen & Nebenkeywords passende Sektionen erstellt?
    • Wurden ausreichend Backlinks in Branchenbüchern erstellt und sind die Angaben dort überall identisch?
    • Wir originell sind die Inhalte?
  • Erreichte Platzierungen in Suchmaschinen zu relevanten Begriffen (freiwillige, mündliche Zusatznote zum Ende des Schuljahres)
    • Tipps für gute Platzierungen:
      • Erstelle mit Synthesia ein passendes Video zu dem Keyword und baue es auf der Seite ein (achte dabei auf eine passende Verwendung von Keywords im Video)
      • Baue möglichst viele passende Backlinks auf