uio--WebPageHeader-Module
uio--HeaderCarousel-Module
uio--WebPageMain-Module
HTML, CSS, SVG, WebComponents und das Document Object Model DOM für HTML5 Dokumente des W3C World Wide Web Consortiums.

ÜBERBLICK

Teil 1: Überblick

Überblick

Die Inhalte dieses Kurses werden aktuell für 2025/2026 überarbeitet.

Web-A101: Kursinhalt

Themen und Inhalte für Web-A101-Developer-1

Der Schwerpunkt der Einführung ist zu Beginn die grundlegende Syntax von HTML-Dokumenten sowie deren Verknüpfung mit CSS-, Grafik- und JavaScript-Dokumenten. Die eigentlichen HTML Elemente vermitteln wir anhand exemplarischer HTML-Codes als Muster/Pattern. Komplexer als die HTML Syntax ist im Einstieg für die meisten Personen die Wichtung von CSS-Selektoren welche nicht nur im Webdesign sondern auch im Kontext von JavaScript [1] sowie aber auch DOM Operationen im Kontext von PHP, JAVA, C# etc. zwingend verstanden sein müssen.

HTML

HTML steht für HyperText Markup Language und ist die grundlegende Auszeichnungssprache für das Erstellen von Webseiten. Sie definiert die Struktur und den Inhalt einer Webseite durch Elemente und Tags.

CSS

CSS, oder Cascading Style Sheets, ist eine Stylesheet-Sprache, die verwendet wird, um das Aussehen und Formatieren von Dokumenten zu beschreiben, die in HTML geschrieben sind. CSS ermöglicht die Trennung von Inhalt und Design.

SVG

SVG steht für Scalable Vector Graphics und ist ein XML-basiertes Format für die Beschreibung zweidimensionaler Vektorgrafiken. SVG ermöglicht interaktive und animierte Grafiken innerhalb von Webseiten.

DOM

DOM, das Document Object Model, ist eine Programmierschnittstelle für HTML- und XML-Dokumente. Es repräsentiert die Seite so, dass Programme Änderungen am Dokumenteninhalt, der Struktur und dem Stil vornehmen können.

WebComponents

WebComponents sind eine Sammlung von Technologien, die es Entwicklern ermöglichen, wiederverwendbare benutzerdefinierte Elemente zu erstellen und ihre Funktionalität in Webanwendungen zu kapseln, ohne auf komplexe JavaScript-Frameworks angewiesen zu sein.

WebGL

WebGL ist eine JavaScript-API für das Rendern interaktiver 2D- und 3D-Grafiken innerhalb eines Webbrowser ohne die Verwendung von Plugins. WebGL ermöglicht es, Grafiken direkt in der GPU zu beschleunigen, was für Spiele und visuelle Effekte nützlich ist.

LinkedData

Im letzten Teil der Einführung zu Web-Technologien befassen wir uns mit dem Thema LinkedData und damit der erweiterten semantischen Auszeichnung von Informationen mit dem W3C Standard JSON+LD. Viele bezeichnen das als SEO, aber das ist nur ein praktischer Aspekt dieser Techniken.


HTML

HTML Elemente und Syntax

Wir geben den Überblick über alle HTML Elemente des HTML5 Standards. Wenn Sie aber die Befürchtung oder die Erwartung haben sollten, dass wir jedes Element im Detail durchgehen: Nein, das macht keinen wirklichen Sinn.

Unterschiede zwischen HTML5 DOM und XML DOM, Problemstellung des fehlenden Browser-DOMs auf Serverseite, grundlegende Strategien zur Frage der Unterstützung von HTML- und anderen Techniken durch Browser.

HTML Markup verstehen

In diesem Themenblock befassen wir uns mit der Nutzung von HTML für die semantische Auszeichnung von Inhalten sowie das Zusammenspiel aus HTML und CSS für die wichtigsten Aspekte in Bezug auf die Struktur und das Layout von Webpages.

HTML Formulare

HTML bildet die Grundlage für Webformulare. Inhalt der Einführung ist ein Einblick die Planung, Struktur, das responsive Layout sowie die Varianten des Datenaustauschs zwischen Browser und Server, darunter auch AJAX/Fetch-Techniken.

HTML Formulare sowie die von SNEWMEDIA gezeigten Techniken sind W3C Standards und werden von allen Browsern unterstützt.


CSS

CSS-Syntax

Die Syntax von CSS gliedert sich in verschiedene Bereiche. Wir decken in der Einführung alle diese Bereiche ab.

Responsive Webdesign

Responsive Webdesign ist ein Aspekt sowohl der passenden HTML-Dokument-Struktur als auch einer cleveren Struktur für den zugehörigen CSS-Code nebst Einsatz sogenannter CSS Queries. Responsive Webdesign müsste sinngemäß eigentlich Responsive Design heißen: Mit HTML und CSS lassen sich in diesem Zusammenhang auch Druck/Print-Layouts mit Vermaßung in Millimetern, Plazierung von Seiten- und Spaltenumbrüchen bis hin zu Randabständen für Papierformate oder CMYK Farbformat für Farben erweitern.

Schwerpunkt in diesem Themenblock sind gängige Strategien, wie man Browser im Endgerät vom Smartphone bis zum 8K Monitor sowie eine Druckansicht abdecken kann.

CSS-Animationen

CSS-Animationen sind eine Technik mit deren Hilfe es möglich geworden ist, HTML Dokumente um Animationen zu ergänzen, ohne hierbei JavaScript einsetzen zu müssen. Animationen entstehen hierbei als als Teil der Formatzuweisung.

CSS Animationen sind ein W3C Standard und werden von allen Browsern unterstützt.


Nur im Überblick

Die folgenden Techniken sind KEIN W3C Standard. Sie sind aber immhin so bedeutsam und verbreitet, dass wir in Grundlagen erklären, wozu diese dienen, wie diese funktionieren und wie man diese einsetzen kann.

SCSS

SCSS ist eine erweiterte Syntax von SASS, einem Präprozessor für CSS, der es ermöglicht, Variablen, Verschachtelungen, Mixins und Funktionen in CSS zu verwenden, um die Wartung und Erweiterbarkeit zu verbessern.

SCSS ist KEIN W3C-Standard.

Termine & Preisliste

Teil 3: Termine

Termine: WEBRENDERING A101 Developer Teil 1

KIS Kursinformationssystem | Stand 28.10.2024

Buchungs-, Reservierungs- und Stornierungsbedingungen

Varianten in Bezug auf Thema, Dauer und mehr

Kontakt/Anfrage

Teil 3: Kontakt/Anfrage

NIMM MIT UNS KONTAKT AUF

Kontaktformular zur Kursanfrage

Über dieses Kontaktformular können Sie uns bundesweit kostenfrei sowohl Anfragen für eine Angebotserstellung als auch Ihre weiteren Fragen zu unseren Leistungen, Themen, freien Terminen, Konditionen und Preise für die Durchführung von Leistungen sowohl remote/online als auch bei Ihnen in der Region stellen.

Postanschrift

SNEWMEDIA | Learning & Training
Timm Stülken
Waldstr. 44
D-65187 Wiesbaden

Success! Your message has been sent to us.
Error! There was an error sending your message.

PART 3: Fußnoten

Fußnoten, Erläuterungen, Quellenangaben


  • [1]↑ JavaScript: Die Programmiersprache JavaScript ist eine unter der Bezeichnung ECMAScript standardisierte Skript- und Programmiersprache welche nicht nur im Browser als Teil des clientseitigen Quellcodes von Webseiten, Webabwendungen, WebApps und Apps sondern auch außerhalb des Browsers in weiteren Runtimes wie NodeJS, Dino, GraalVM und anderen läuft. JavaScript (Kurse)
SO IST'S BESSER.

LERNEN MIT SNEWMEDIA. Wähle ein Thema.

Schick uns den Link auf Dein Wunschthema und wir bieten Dir einen Termin an!

uio--WebPageFooter-Module