Mehr erfahren

Grundlagen von HTML, CSS und JavaScript

HTML, CSS und JavaScript sind die drei grundlegenden Technologien für die Erstellung von Webseiten. HTML bietet die Struktur und den Inhalt einer Webseite, CSS gestaltet das Aussehen und Layout, und JavaScript ermöglicht interaktive Funktionen und dynamisches Verhalten. Das Verständnis dieser Technologien ist essentiell für jeden, der in der Webentwicklung tätig ist, da sie zusammenarbeiten, um ansprechende und funktionale Webseiten zu erstellen.

Mehr erfahren

Grundlegende HTML-Tags

Zu den fundamentalsten HTML-Tags gehören z.B.

bis

für Überschriften,

für Absätze und für Links. Diese Tags helfen, den Inhalt zu gliedern und Verknüpfungen zu anderen Seiten herzustellen. Darüber hinaus sorgen Tags wie für die Einbindung von Bildern und

Mehr erfahren

Semantik und Barrierefreiheit

Semantische HTML-Tags wie
,
Mehr erfahren

Selektoren und Eigenschaften

CSS arbeitet mit Selektoren, welche HTML-Elemente anhand von Tag-Namen, Klassen, IDs oder Attributen ansprechen. Eigenschaften definieren, wie ein Element dargestellt werden soll, etwa durch Farbe, Schriftgröße oder Positionierung. Durch gute Kenntnis dieser Grundlagen lassen sich komplexe Layouts und Designs realisieren. Dabei ist es wichtig, die Spezifität der Selektoren zu verstehen, um Stylekonflikte zu vermeiden und ein konsistentes Erscheinungsbild zu gewährleisten.

Box-Modell und Layouts

Das CSS-Box-Modell beschreibt, wie Inhalt, Padding, Rahmen und Rand eines Elements zusammenspielen, um das endgültige Erscheinungsbild zu erzeugen. Ein tiefes Verständnis dieses Modells ist notwendig, um Abstände und Größen präzise steuern zu können. Für moderne Webseiten kommen zudem Techniken wie Flexbox und CSS Grid zum Einsatz, die eine flexible und responsive Anordnung von Elementen ermöglichen. Diese Layoutmethoden sind heute unverzichtbar, um auf verschiedensten Geräten ansprechende Darstellungen zu garantieren.

Responsive Design

Responsive Design stellt sicher, dass Webseiten auf unterschiedlich großen Bildschirmen optimal dargestellt werden. Mit CSS-Medienabfragen lassen sich Bedingungen definieren, die das Styling je nach Bildschirmgröße oder Gerätetyp anpassen. Dieses Konzept ist entscheidend, da mobile Nutzung und diverse Endgeräte heute zum Standard gehören. Durch gezielte Anpassung von Layout und Schriftgrößen verbessert man die Benutzerfreundlichkeit und erreicht eine breite Zielgruppe, ohne mehrere getrennte Versionen der Webseite erstellen zu müssen.
Variablen und Datentypen
In JavaScript werden Daten in Variablen gespeichert, die unterschiedliche Arten von Informationen enthalten können, darunter Zahlen, Strings, Booleans oder komplexe Objekte. Das Verständnis der verschiedenen Datentypen und wie man mit ihnen arbeitet, ist für das Schreiben effektiver Skripte grundlegend. Variablen können flexibel deklariert werden, wobei es wichtige Unterschiede zwischen var, let und const gibt, die sich auf die Gültigkeitsbereiche und Wiederverwendbarkeit auswirken.
Mehr erfahren
Funktionen und Ereignisse
Funktionen sind die Bausteine von JavaScript-Code und ermöglichen es, logische Abläufe zu kapseln und wiederzuverwenden. Durch das Binden von Funktionen an Ereignisse wie Mausklicks oder Tastatureingaben können Webseiten auf Nutzeraktionen reagieren. Dieses Ereignis-gesteuerte Programmiermodell ist zentral für die Schaffung einer interaktiven Benutzeroberfläche, da es erlaubt, beispielsweise Buttons zu programmieren, die Inhalte dynamisch verändern oder Animationen starten.
Mehr erfahren
DOM-Manipulation
Das Document Object Model (DOM) ist die strukturelle Repräsentation einer Webseite, die JavaScript ermöglicht, HTML-Elemente zu lesen und zu verändern. Mit DOM-Manipulation lassen sich Inhalte dynamisch hinzufügen, löschen oder verändern, was für moderne Single-Page-Applications und interaktive Webseiten essenziell ist. Kenner der DOM-Methoden können so das Verhalten und Aussehen einer Webseite ohne Neuladen komplett verändern und an Nutzeranfragen adaptieren.
Mehr erfahren
Previous slide
Next slide