Logo Männig3D

Schulungen

Seminare rund um das Thema Webdesign

Sie wollen Ihre Webseite nach der Übergabe selbst pflegen, es fehlt aber (noch) das nötige Know-how?
In individuellen Seminaren haben Sie die Möglichkeit, alles zu lernen, was für die fachgerechte Betreuung Ihrer Webseite nötig ist!




Moderne Webseiten sind keine statischen Gebilde: Da das Internet ein hochdynamischer, sich permanent weiterentwickelnder Ort ist, müssen auch Webseiten gepflegt und regelmäßig an sich verändernde Bedingungen angepasst werden. Das für diese Aufgabe nötige Wissen vermittle ich Einsteigern in maßgeschneiderten Schulungen. Das Seminar »Die Pflege Ihrer Website« richtet sich dabei explizit an Kunden, für die ich eine Webseite erstellt habe. Darüber hinaus biete ich aber auch Einsteiger-Seminare für alle anderen Interessierten sowie diverse Kurse zu unterschiedlichsten Themen. Gerne stelle ich Ihnen aus meinem Themen-Pool auch Ihr individuelles Wunsch-Seminar zusammen. Alle Kurse können prinzipiell in Umfang und Länge variabel an Ihre Bedürfnisse angepasst werden sowie wahlweise als Online- oder Präsenzveranstaltung stattfinden. Bei Fragen oder Interesse an einer Veranstaltung nehmen Sie bitte jederzeit Kon‍takt mit mir auf. Ich freue mich, von Ihnen zu hören!


Die Pflege Ihrer Website

WordPress bietet ideale Einstiegsbedingungen für Webseiten-Neulinge. In aller Regel erstelle ich daher Webseiten, die vom Kunden künftig selbst betreut werden sollen, mit WordPress. Das System hat sich längst vom einfachen Blogging-Tool hin zu einem vollwertigen Content-Management-System (CMS) entwickelt, das vielfältigste Möglichkeiten bietet und gleichzeitig sehr bedienerfreundlich ist. Wie beliebt WordPress ist, zeigt sich in seiner enormen Verbreitung: Rund 43 % aller Webseiten und etwa 64 % aller CMS-basierten Seiten sind mit WordPress erstellt (Stand 2022).

In meinen Seminaren vermittle ich Ihnen das nötige Know-how zur fachgerechten Pflege Ihrer Website. Basis ist ein umfangreiches, bereits während der Einrichtung der Seite individuell zusammengestelltes Skript, das Ihnen als Nachschlagewerk und Arbeitsgrundlage für die ersten Wochen dient. Die behandelten Themen sind dabei spezifisch auf Ihre Webseite abgestimmt. Je nach Vorkenntnissen und Bedarf können die Seminare als halb- oder ganztägige Veranstaltung stattfinden.

Behandelte Themen
  • Überblick über alle Elemente im Backend
  • Plugins installieren
  • Menü und Sidebar/Widgets umgestalten
  • Seiten, Blogbeiträge, Portfolio-Beiträge und Kalendertermine erstellen
  • Grundlagen der weboptimierten Bildbearbeitung
  • Wartungsmaßnahmen: Pflege, Backups und Updates
  • FTP-Programme
  • Wartungsmodus einrichten
  • Neue Inhalte leser- und suchmaschinenorientiert gestalten
  • DSGVO (Datenschutz-Grundverordnung) beachten⁽¹⁾

WordPress für Einsteiger

Sie möchten Ihre Website gerne selbst entwickeln oder sich das nötige Wissen aneignen, um eine bereits vorhandene Website fachgerecht betreuen zu können? In diesem Kurs lernen Sie alle nötigen Grundlagen … und noch ein bisschen mehr.

Behandelte Themen
  • Das richtige Hosting-Paket, Anforderungen an den Provider
  • Freie Domains finden und registrieren, Marken- und Titelschutz beachten⁽¹⁾
  • SSL-Klassen
  • WordPress installieren und einrichten
  • WordPress-Datenbanken
  • Gutenberg-Blöcke, Classic Editor oder Page Builder?
  • Das Theme installieren, ein Child Theme einrichten
  • Plugins installieren
  • Überblick über alle Elemente im Backend
  • Menü und Sidebar/Widgets gestalten
  • Seiten, Blogbeiträge und Portfolio-Beiträge erstellen
  • Einen Veranstaltungskalender einrichten
  • Web Fonts lokal hosten
  • Grundlagen der weboptimierten Bildbearbeitung
  • Wartungsmaßnahmen: Pflege, Backups und Updates
  • FTP-Programme
  • Wartungsmodus einrichten
  • Pflichtangaben: Impressum, Datenschutzerklärung und Cookie Notice; DSGVO (Datenschutz-Grundverordnung) beachten⁽¹⁾
  • Grundlagen der Suchmaschinenoptimierung (SEO): Wir streifen kurz Themen wie Usability, Bounce-Raten, Conversion Rate, Page Speed, robots.txt und sitemap.xml, Keywords, Meta Description, Title Tags/SERP Snippet Design, Rich Snippets, Breadcrumbs, Duplicate Content, Backlinks … Mit diesem Wissen haben Sie einen soliden Grundstock, auf dem Sie aufbauen können!

WordPress für Fortgeschrittene

In diesem Seminar lernen Sie, wie Sie Ihre WordPress-Seite gekonnt weiterentwickeln. Ein großes Augenmerk legen wir auf das Vermeiden möglicher Sicherheitsprobleme. Darüber hinaus sind Maßnahmen zum Datenschutz⁽¹⁾ ein zentrales Thema.

Anmerkung: Um die Inhalte dieses Seminars umsetzen zu können, sollte Ihnen der Umgang mit einem Code Editor vertraut sein. Über eine solide Backup-Strategie sollten Sie bereits verfügen!

Behandelte Themen
  • Maßnahmen zur Erhöhung der Sicherheit
    • Gefahren (er)kennen und bannen: Brute-Force-Angriffe, Backdoors, DoS- und DDoS-Angriffe (Denial-of-Service, Distributed Denial of Service), XSS (Cross-Site Scripting), SQL-Injection, Fuzzing, Sniffing, …
    • Sichere Passwörter
    • Zwei-Faktor-Authentifizierung
    • Captcha
    • Blockieren von IPs
    • Security Headers (HSTS Strict Transport Security, Referrer Policy, X-XSS-Protection, CSP Content Security Policy, X-Frame-Options, X-Content-Type-Options, …)
    • HTTP-Authentifizierung, (.htpasswd bei Apache-Servern)
    • Subresource Integrity (SRI)
    • Einlogversuche begrenzen
    • XML-RPC-Schnittstelle deaktivieren
    • REST API schließen
    • Web Application Firewall
    • Dateiberechtigungen optimieren
    • Sicherheitsschlüssel (keys & salts) in der wp-config.php ändern
    • Honeypots
    • Kommentarfunktion und Spam
  • Datenschutzkonforme Einbindung externer Inhalte (Videos, Social Media)⁽¹⁾
  • Page Speed optimieren
  • Barrierefreiheit
  • Alles über Schriften
    • Die richtige Schrift finden (Quellen, Analyse-Tools, Lizenzen)
    • Formate (TTF, OTF, WOFF, …), Variable Fonts, Web Fonts, Schriften lokal hosten und einbinden
    • Vermeiden des Giant Font Size Bug, Verringern des FOUT (Flash of Unstyled Text)
    • Schriften mit CSS gestalten: Von der Schriftgröße bis hin zu animierten Schattenspielen
    • Das Layout von Textblöcken mit CSS gestalten (Spaltensatz, automatische Silbentrennung, …)
  • Datenschutzkonforme⁽¹⁾ Statistik: Log Files, Plugins, …
  • Staging

Fotos & Bildbearbeitung

Gutes und richtig bearbeites Bildmaterial ist von elementarer Bedeutung für Attraktivität, Funktionalität und Suchmaschinenranking einer Website. Dennoch wird das Thema oft stiefmütterlich behandelt, denn korrekte Bildbearbeitung kann überaus aufwändig sein. Wie es mit überschaubarem Einsatz und relativ einfachen Mitteln möglich ist, Bilder ideal vorzubereiten und einzustellen, lernen Sie in dieser Schulung. Ich zeige Ihnen, worauf es ankommt und gebe Tipps und Tricks aus meiner langjährigen Erfahrung. Sie lernen die Zusammenhänge zwischen Ladezeiten und Bildgrößen, den Umgang mit webgeeigneten Bildformaten, wie Bilder richtig benannt werden und warum Fotos, die auf einer Website funktionieren sollen, oft anderen Regeln gehorchen müssen, als unter künstlerischen Aspekten aufgenommene Bilder.

Behandelte Themen
  • Kriterien, denen ein Foto genügen sollte
  • Anforderungen an das Bildbearbeitungsprogramm, Vorstellung gängiger Programme
  • Bildformate, ihr korrekter Einsatz und mögliche Artefakte: JPEG (Joint Photographic Experts Group), PNG (Portable Network Graphics; PNG-8 vs. PNG-24, PNGOUT, OptiPNG, OxiPNG), GIF (Graphics Interchange Format), Next-Gen Formats: JPEG 2000, JPEG XR, JPEG XL, WebP, AVIF
  • Bildgröße vs. Dateigröße
  • Farbraum, Transparenzen & Alphakanal
  • »Verlustfreie« Kompression
  • Dithering, Farbfehler, Artefakte
  • Automatisierte Bildbearbeitung mit Plugins: Möglichkeiten und Grenzen
  • Bildrechte beachten (Urheberrecht, Persönlichkeitsrechte, Panoramafreiheit, Bildlizenzen)⁽¹⁾

HTML5 und CSS3 für Einsteiger

Die möglichst vollständige Trennung von Inhalt und Darstellung ist ein grundlegendes Prinzip in Web-Dokumenten: Während die Auszeichnungssprache HTML (Hypertext Markup Language) Textelelementen eine Funktion zuweist, wird das Layout dieser Elemente separat davon mit CSS (Cascading Style Sheets) gestaltet. Im Kurs lernen Sie alle wichtigen Grundbegriffe, von einfachen HTML-Befehlen bis hin zur Gestaltung ansprechender Layouts.

Behandelte Themen
  • Arbeiten mit FTP-Programm und Code Editor
  • Seitenquelltext anzeigen und untersuchen
  • HTML
    • HTML-Grundgerüst: Dokumenttypdeklaration, UTF-8-Codierung, Sprachkürzel, Head (Metaangaben, Titel, Einbindung externer Stylesheets und Skripte), Body (Header, Banner, Logo, Navigation, Inhaltscontainer, Article, Footer)
    • Tags und Attribute
    • Syntax und Semantik
    • Block- und Inline-Elemente
    • Kommentare
    • Sonderzeichen
    • Unicode
    • Listen
    • Tabellen
    • Hyperlinks
    • Anker und Fußnoten
    • Der Mailto-Link
    • Klickbare Telefonnummern
    • Bilder und Grafiken einbinden
    • Relative und absolute Referenzierung
    • Favicons
    • Videos und Musik einbetten
    • Tabellen
    • Möglichkeiten und Grenzen von WYSIWYG (»What you see is what you get«)
  • CSS3
    • CSS einbinden: extern, intern, inline
    • Prinzip der Kaskade
    • Selektoren/Kombinatoren, Property, Value
    • »Leere Elemente«: div und span
    • Klassen und IDs, Pseudoklassen und Pseudoelemente
    • Kommentare
    • Das Prinzip der Vererbung
    • Box Model, Wireframe Model
    • Maßangaben
    • Elemente positionieren: float, clear, clearfix
    • MIME-Types
    • Herstellerpräfiix (Vendor Specific Prefiix)
  • Grundzüge der Validierung

HTML5 und CSS3 für Fortgeschrittene

In diesem Kurs werden die Kenntnisse aus dem Einsteigerseminar vertieft und erweitert. Insbesondere beschäftigen wir uns mit den Möglichkeiten, Animationen mit CSS auszuführen. Eine vorherige Teilnahme am Einsteigerseminar ist Voraussetzung für den Kurs.

Behandelte Themen
  • HTML
    • Formulare
    • Kontrollfelder
    • Buttons
    • Imagemaps
  • CSS
    • Flexbox
    • Grid
    • Slider
    • Media Queries
    • Above the Fold/Critical CSS
    • Image Filter & Effekte
    • Parallax-Effekt
    • Weiches Scrollen
    • Mathematische Funktionen: calc(), clamp()
    • Variablen (Custom Properties)
    • Animationen
      • Transitionen
      • Transformationen (Translationen, Rotationen, 3D-Rotation, Skalieren, Verzerrungen)
      • Keyframe-Animationen
      • Animationen starten: automatisch, on hover, mit Checkbox
  • CSS-Präprozessoren: Kleiner Einstieg in SASS (Syntactically Awesome Stylesheets)

SVG - Scalable Vector Graphics

Idealerweise werden Logos und andere Grafiken als Vektorgrafiken in Webseiten eingebunden: Das Format ermöglicht eine stufenlose Skalierung ohne Qualitätsverlust und sorgt aufgrund seiner geringen Dateigröße für optimal kurze Ladezeiten. Hinter den (meist mit einem Grafikprogramm gezeichneten) Bildelementen verbirgt sich nichts anderes als eine XML-Datei - anders formuliert: Man kann die Zeichnungen auch rein durch die Notation von Code erzeugen. Im Seminar lernen Sie hauptsächlich, diesen Code zu verstehen, zu optimieren und mit kleinen Animationen weiterzuentwickeln.

Behandelte Themen
  • Zeichnen mit Grafikprogramm und Grafiktablett, Export der Datei
  • Aufbau des Grundgerüsts
  • Metadaten
  • Die 6 Grundformen
  • Größen und Farben
  • Referenzen und Instanzen (defs-Element, use-Element)
  • Einbinden von Grafiken
  • Textelemente
  • Pfade
  • Gestaltung mit CSS
  • Grundlagen der Animation (Translation, Skalierung, Transformation)
  • Filter und Masken
  • Optimierung des Codes


Weitere Kurse auf Anfrage.



⁽¹⁾ Hinweis Als Nicht-Juristin darf ich prinzipiell keine Rechts­beratung leisten und kann keine Rechts­sicherheit garan­tieren!