Feedback & Wünsche

TutKit.com

Grundlagen HTML, CSS und JavaScript

Grundlagen HTML, CSS und JavaScript

4eck Media GmbH & Co. KG

Kategorie: Webdesign | Trainer: Jan Brinkmann

Die drei wichtigsten Säulen des Webs – HTML, CSS und JavaScript. Lerne im Tutorial von Jan Brinkmann die Grundlagen und wende sie direkt an. Damit kannst du dynamische Webseiten erstellen, lesbar unterteilen, Bilder einbinden, Text formatieren und verschiedene Elemente positionieren. Was ist HTML? Was CSS? Und was JavaScript – nach dem Tutorial keine Fragen mehr für dich!

  • 62 Lektionen in einem über 8-stündigen Video-Tutorial zum Einstieg in HTML, CSS und JavaScript
  • Einfach Grundlagenkenntnisse erwerben und in inklusiven Übungen direkt ausprobieren
  • Von Jan Brinkmann, einem Web-Entwickler aus Leidenschaft mit über 15 Jahren Erfahrung

Ein Einstieg, der sich in deinem alltäglichen Umgang mit dem Netz bezahlt macht. Lade dir die Grundlagen der Web-Entwicklung in dein Know-how-Repertoire!

Trainings-Informationen

Gesamtinhalt herunterladen
Jetzt dabei sein

Tutorial ansehen Arbeitsdateien herunterladen

Einführung

Grundlagen HTML, CSS und JavaScript - 01 Einführung

Grundlagen HTML, CSS und JavaScript - 01 Einführung

Herzlich willkommen im Kurs!

  2 Min. mit Arbeitsdatei Kostenlos

HTML: Basics

Grundlagen HTML, CSS und JavaScript - 02 Was ist HTML?

Grundlagen HTML, CSS und JavaScript - 02 Was ist HTML?

Für das Verständnis von HTML hilft es, genauer zu verstehen, was HTML eigentlich ist. Diese Lektion behandelt genau diese Frage.

  4 Min.
Grundlagen HTML, CSS und JavaScript - 03 HTML-Dokumente erstellen, anzeigen und editieren

Grundlagen HTML, CSS und JavaScript - 03 HTML-Dokumente erstellen, anzeigen und editieren

Die entscheidende Frage, wenn du gerade einsteigst: Wie werden HTML-Dokumente erstellt, angezeigt oder verändert? In diesem Video findest du die Antwort.

  2 Min.
Grundlagen HTML, CSS und JavaScript - 04 Die DNA von HTML: die Tags

Grundlagen HTML, CSS und JavaScript - 04 Die DNA von HTML: die Tags

Die Basis von HTML-Dokumenten sind die sogenannten Tags. Das Konzept lernst du in dieser Lektion kennen.

  3 Min.

HTML: Struktur von HTML-Dokumenten

Grundlagen HTML, CSS und JavaScript - 05 Der Kopfbereich und Metainformationen

Grundlagen HTML, CSS und JavaScript - 05 Der Kopfbereich und Metainformationen

HTML-Dokumente bestehen aus einem Kopfbereich mit Informationen über das Dokument und dem sichtbaren Inhalt. In dieser Lektion geht es zunächst um den Kopfbereich (head).

  8 Min.
Grundlagen HTML, CSS und JavaScript - 06 Der Seitenbody mit den Hauptinhalten

Grundlagen HTML, CSS und JavaScript - 06 Der Seitenbody mit den Hauptinhalten

Die eigentlichen Inhalte werden im body-Bereich hinterlegt. Diese grundlegende Unterteilung musst du unbedingt verstanden haben. Diese Lektion ist daher in jedem Fall Pflicht!

  2 Min.
Grundlagen HTML, CSS und JavaScript - 07 Kommentare

Grundlagen HTML, CSS und JavaScript - 07 Kommentare

Gerade umfangreiche Dokumente profitieren von Kommentaren, die nicht auf der Webseite selbst angezeigt werden. Sie können den Code übersichtlicher machen und dokumentieren. Lerne, sie zu erstellen.

  3 Min.

HTML: Hyperlinks

Grundlagen HTML, CSS und JavaScript - 08 Relative und absolute Pfadangaben

Grundlagen HTML, CSS und JavaScript - 08 Relative und absolute Pfadangaben

Im Web begegnen dir immer wieder Pfadangaben – und zwar in zwei Varianten: als relative oder als absolute Pfadangabe. Schaue diese Lektion an, um das Konzept zu verstehen.

  12 Min.
Grundlagen HTML, CSS und JavaScript - 09 Interne Links

Grundlagen HTML, CSS und JavaScript - 09 Interne Links

Verweise innerhalb einer Webseite sind extrem häufig. Die Umsetzung findest du in diesem Beitrag.

  13 Min.
Grundlagen HTML, CSS und JavaScript - 10 Externe Links und Targets

Grundlagen HTML, CSS und JavaScript - 10 Externe Links und Targets

Verweise auf andere Webseiten sind ebenso wichtig und gehören ebenfalls zum Alltag im Internet. Zudem gibt es mit dem Target eine Angabe, wie die Links geöffnet werden. Lerne, wie du das umsetzt.

  5 Min.
Grundlagen HTML, CSS und JavaScript - 11 Verweise im Dokument

Grundlagen HTML, CSS und JavaScript - 11 Verweise im Dokument

Verweise innerhalb von einem Dokument werden auch Anker genannt. Lerne, sie zu setzen und auf Bereiche auf der aktuellen Seite zu verweisen.

  8 Min.

HTML: Dokumente unterteilen

Grundlagen HTML, CSS und JavaScript - 12 Überschriften

Grundlagen HTML, CSS und JavaScript - 12 Überschriften

Zu einer hierarchischen Struktur gehören unter anderem Überschriften. Hier lernst du die verfügbaren Elemente kennen.

  6 Min.
Grundlagen HTML, CSS und JavaScript - 13 Zeilenumbrüche, Leerzeichen und Trennlinien

Grundlagen HTML, CSS und JavaScript - 13 Zeilenumbrüche, Leerzeichen und Trennlinien

Leerzeichen und Zeilenumbrüche in HTML-Dokumenten sind begrenzt. Es ist wichtig, dass du dieses Konzept kennst.

  5 Min.
Grundlagen HTML, CSS und JavaScript - 14 Absätze einfügen

Grundlagen HTML, CSS und JavaScript - 14 Absätze einfügen

In einem Text spielen Absätze eine wichtige Rolle. Hier lernst du sie zu setzen.

  6 Min.
Grundlagen HTML, CSS und JavaScript - 15 Listen erstellen

Grundlagen HTML, CSS und JavaScript - 15 Listen erstellen

Gerade im Web müssen Texte übersichtlich sein. Listen helfen dem Betrachter beim Überfliegen. Daher ist die Lektion über geordnete und ungeordnete Listen absolute Pflicht.

  4 Min.
Grundlagen HTML, CSS und JavaScript - 16 Tabellen verwenden

Grundlagen HTML, CSS und JavaScript - 16 Tabellen verwenden

Tabellen sind enorm wichtig, um Daten tabellarisch aufzubereiten. Hier lernst du die Grundlagen kennen.

  9 Min.

HTML: Sonstige Elemente

Grundlagen HTML, CSS und JavaScript - 17 Bilder einbinden

Grundlagen HTML, CSS und JavaScript - 17 Bilder einbinden

Ein Web ohne Bilder ist nicht vorstellbar. Du lernst hier, wie du Bilder einbindest.

  7 Min.
Grundlagen HTML, CSS und JavaScript - 18 HTML-Entitäten verwenden

Grundlagen HTML, CSS und JavaScript - 18 HTML-Entitäten verwenden

Lerne Sonderzeichen als HTML-Entitäten in deinen Dokumenten unterzubringen.

  6 Min.
Grundlagen HTML, CSS und JavaScript - 19 Einbinden von iframes

Grundlagen HTML, CSS und JavaScript - 19 Einbinden von iframes

Über iframes bettest du andere Webseiten direkt in deiner Webseite ein.

  3 Min.
Grundlagen HTML, CSS und JavaScript - 20 JavaScript einbinden

Grundlagen HTML, CSS und JavaScript - 20 JavaScript einbinden

JavaScripts werden in HTML-Dokumente eingebunden. Hier lernst du, wie das geht.

  5 Min.

HTML: Übungen

Grundlagen HTML, CSS und JavaScript - 21 Übung #1: Texte und Überschriften

Grundlagen HTML, CSS und JavaScript - 21 Übung #1: Texte und Überschriften

In der ersten HTML-Praxisübung geht es um Textaufbereitung und das Setzen von Überschriften.

  2 Min.
Grundlagen HTML, CSS und JavaScript - 22 Übung #2: ein Rezept selbst erstellen

Grundlagen HTML, CSS und JavaScript - 22 Übung #2: ein Rezept selbst erstellen

Hier erstellst du ein Rezept als HTML-Dokument und verwendest dabei grundlegende HTML-Elemente.

  2 Min.
Grundlagen HTML, CSS und JavaScript - 23 Übung #3: eine lange Tabelle

Grundlagen HTML, CSS und JavaScript - 23 Übung #3: eine lange Tabelle

Das Wissen rund um Tabellen wird hier nun in der Praxis angewandt.

  2 Min.

CSS: Einführung

Grundlagen HTML, CSS und JavaScript - 24 Was ist CSS?

Grundlagen HTML, CSS und JavaScript - 24 Was ist CSS?

Lerne das Konzept der Cascading Style Sheets kennen.

  8 Min.
Grundlagen HTML, CSS und JavaScript - 25 Inline-Styles

Grundlagen HTML, CSS und JavaScript - 25 Inline-Styles

Lerne, CSS-Statements direkt den Elementen zuzuweisen.

  8 Min.
Grundlagen HTML, CSS und JavaScript - 26 Internal Style Sheets

Grundlagen HTML, CSS und JavaScript - 26 Internal Style Sheets

Interne Stylesheets sind ein weiterer Weg, direkt im Dokument Anweisungen zu hinterlegen.

  6 Min.
Grundlagen HTML, CSS und JavaScript - 27 External Style Sheets

Grundlagen HTML, CSS und JavaScript - 27 External Style Sheets

Ein sehr häufiger Fall: die Stylesheets werden in externe Dateien ausgelagert und eingebunden.

  13 Min.
Grundlagen HTML, CSS und JavaScript - 28 HTML-Attribute class und id

Grundlagen HTML, CSS und JavaScript - 28 HTML-Attribute class und id

Für das Styling sind die Attribute „class“ und „id“ extrem wichtig. Lerne sie hier kennen.

  10 Min.
Grundlagen HTML, CSS und JavaScript - 29 Die Rolle der div-Container

Grundlagen HTML, CSS und JavaScript - 29 Die Rolle der div-Container

Gerade Container spielen eine wichtige Rolle bei der Arbeit mit CSS. Hier lernst du das Konzept am Beispiel vom div-Tag kennen.

  8 Min.

CSS: Grundlagen

Grundlagen HTML, CSS und JavaScript - 30 Schwebende Elemente mit float

Grundlagen HTML, CSS und JavaScript - 30 Schwebende Elemente mit float

Mit dem float-Attribut können Elemente unterschiedlich positioniert werden. Ein zentrales Element beim Design. Pflichtlektion!

  13 Min.
Grundlagen HTML, CSS und JavaScript - 31 Elemente positionieren

Grundlagen HTML, CSS und JavaScript - 31 Elemente positionieren

Auch das position-Attribut ist extrem wichtig und gehört auf jeden CSS-Lehrplan.

  9 Min.
Grundlagen HTML, CSS und JavaScript - 32 Innen- und Außenabstände

Grundlagen HTML, CSS und JavaScript - 32 Innen- und Außenabstände

Lerne die verschiedenen Angaben für Abstände („padding“ und „margin“) kennen.

  8 Min.
Grundlagen HTML, CSS und JavaScript - 33 Breite und Höhe festlegen

Grundlagen HTML, CSS und JavaScript - 33 Breite und Höhe festlegen

Die Breite und Höhe (height und width) sind Thema in dieser Lektion.

  3 Min.
Grundlagen HTML, CSS und JavaScript - 34 Rahmen (border) setzen

Grundlagen HTML, CSS und JavaScript - 34 Rahmen (border) setzen

HTML-Elemente können mit einem Rahmen dargestellt werden. Dazu gibt es das border-Attribut, welches du in diesem Video kennenlernst.

  6 Min.
Grundlagen HTML, CSS und JavaScript - 35 Schriftgröße festlegen

Grundlagen HTML, CSS und JavaScript - 35 Schriftgröße festlegen

Verschiedene Schriftgrößen hat jeder schon einmal genutzt. Nach dieser Lektion kannst du sie mit CSS festlegen.

  8 Min.
Grundlagen HTML, CSS und JavaScript - 36 Schriftfamilien definieren

Grundlagen HTML, CSS und JavaScript - 36 Schriftfamilien definieren

Schriftarten sind nicht immer auf jedem Rechner verfügbar. Darum werden im Web eher Schriftfamilien definiert. Lerne in diesem Video, wie das geht.

  10 Min.
Grundlagen HTML, CSS und JavaScript - 37 Fetter, kursiver und unterstrichener Text

Grundlagen HTML, CSS und JavaScript - 37 Fetter, kursiver und unterstrichener Text

Die Basis der Textgestaltung: fetter, kursiver und unterstrichener Text. In dieser Lektion stelle ich dir die CSS-Anweisungen vor.

  5 Min.
Grundlagen HTML, CSS und JavaScript - 38 Text-Alignment verändern

Grundlagen HTML, CSS und JavaScript - 38 Text-Alignment verändern

Die Ausrichtung von Text ist auch aus der Textverarbeitung bekannt und auch im Web nicht unüblich. Finde heraus, wie das mit CSS funktioniert.

  2 Min.
Grundlagen HTML, CSS und JavaScript - 39 Hyperlinks aufhübschen

Grundlagen HTML, CSS und JavaScript - 39 Hyperlinks aufhübschen

Das Standarddesign von Links kann mittels CSS deutlich verbessert werden. Lerne die verschiedenen Zustände von Links und die entsprechenden CSS-Anweisungen kennen.

  5 Min.

JavaScript: Eine Einführung

Grundlagen JavaScript - 01 Was ist JavaScript?

Grundlagen JavaScript - 01 Was ist JavaScript?

Eine kurze Übersicht zur Frage: „Was ist JavaScript eigentlich genau?“

  11 Min.
Grundlagen JavaScript - 02 Internes JavaScript

Grundlagen JavaScript - 02 Internes JavaScript

In diesem Crashkurs bindest du JavaScript in ein HTML-Dokument ein. Zunächst lernst du dies direkt im Dokument zu hinterlegen.

  8 Min.
Grundlagen JavaScript - 03 Externes JavaScript

Grundlagen JavaScript - 03 Externes JavaScript

Externe JavaScripts sind ebenfalls wichtig und im Web ständig präsent.

  5 Min.
Grundlagen JavaScript - 04 -Document Object Model- (DOM) und HTML-Elemente

Grundlagen JavaScript - 04 -Document Object Model- (DOM) und HTML-Elemente

Lerne das „Document Object Model“ kennen.

  13 Min.
Grundlagen JavaScript - 05 Daten ausgeben

Grundlagen JavaScript - 05 Daten ausgeben

Daten ausgeben musst du in TVML/TVJS auf diesem Weg nicht, aber es ist trotzdem wichtig für die weiteren Beispiele.

  10 Min.
Grundlagen JavaScript - 06 Klick-Events behandeln

Grundlagen JavaScript - 06 Klick-Events behandeln

Ein wesentliches Feature von JavaScript ist die Steuerung durch Events. Hier lernst du das Konzept am Beispiel von Klick-Events kennen.

  8 Min.
Grundlagen JavaScript - 07 Text austauschen

Grundlagen JavaScript - 07 Text austauschen

Lerne, wie du auf Elemente zugreifst und den Wert ändern kannst.

  11 Min.

JavaScript: Grundlagen

Grundlagen JavaScript - 08 Variablen verwenden

Grundlagen JavaScript - 08 Variablen verwenden

Variablen – zentrales Konzept jeder Programmiersprache. Hier lernst du, wie sie in JavaScript angelegt werden.

  12 Min. Kostenlos
Grundlagen JavaScript - 09 Datentypen in JavaScript?

Grundlagen JavaScript - 09 Datentypen in JavaScript?

Auch wenn JavaScript keine expliziten Datentypen bei der Deklaration verwendet, solltest du das Konzept dennoch verstehen.

  9 Min. Kostenlos
Grundlagen JavaScript - 10 Arithmetik mit JavaScript

Grundlagen JavaScript - 10 Arithmetik mit JavaScript

Ein Computer (zu Deutsch „Rechner“) ist ohne einfache Arithmetik nicht in der Lage etwas zu berechnen. JavaScript kann dies natürlich auch.

  12 Min. Kostenlos
Grundlagen JavaScript - 11 Compound Assignments in JavaScript

Grundlagen JavaScript - 11 Compound Assignments in JavaScript

Auch wenn du sie nicht direkt selbst verwendest, begegnen dir zusammengesetzte/kombinierte Zuweisungen in der Praxis häufiger. Gut, wenn du die Syntax lesen kannst!

  4 Min. Kostenlos
Grundlagen JavaScript - 12 Bedingungen mit if

Grundlagen JavaScript - 12 Bedingungen mit if

Ohne Bedingungen ist die Programmierung nur schwer vorstellbar.

  15 Min. Kostenlos
Grundlagen JavaScript - 13 for-Schleifen

Grundlagen JavaScript - 13 for-Schleifen

Auch das Konzept der Wiederholung ist enorm wichtig. Hier lernst Du eine Variante in JavaScript kennen.

  13 Min. Kostenlos
Grundlagen JavaScript - 14 while-Schleifen

Grundlagen JavaScript - 14 while-Schleifen

Auch while-Schleifen haben ihren Einsatzzweck. Gut, wenn du auch sie kennst.

  10 Min.

JavaScript: Fortgeschrittene Konzepte

Grundlagen JavaScript - 15 Funktionen definieren

Grundlagen JavaScript - 15 Funktionen definieren

Funktionen wirst du auch in TVJS nutzen. Ein wichtiges Konzept, das es zu verstehen gilt.

  11 Min.
Grundlagen JavaScript - 16 Gültigkeitsbereiche in JavaScript

Grundlagen JavaScript - 16 Gültigkeitsbereiche in JavaScript

Um dich vernünftig im Code zu bewegen, musst du die Gültigkeitsbereiche von JavaScript kennen (Scopes).

  7 Min.
Grundlagen JavaScript - 17 Events

Grundlagen JavaScript - 17 Events

Hier geht es noch einmal und etwas mehr im Detail um Events.

  9 Min.
Grundlagen JavaScript - 18 Strings

Grundlagen JavaScript - 18 Strings

Strings begegnen dir vermutlich in jeder App. Auch sie gehören deshalb unbedingt in einen Crashkurs.

  10 Min.
Grundlagen JavaScript - 19 Rechnen mit JavaScript

Grundlagen JavaScript - 19 Rechnen mit JavaScript

Themen wie Zufallszahlen und andere aufwendige Berechnungen sind ebenfalls wichtig.

  13 Min.
Grundlagen JavaScript - 20 Arrays nutzen

Grundlagen JavaScript - 20 Arrays nutzen

Auch Arrays werden dir mit Sicherheit im JavaScript- und TVJS-Umfeld begegnen. Gut, wenn du sie kennst.

  10 Min.

JavaScript: Objektorientierung

Grundlagen JavaScript - 21 Objekte definieren

Grundlagen JavaScript - 21 Objekte definieren

Auch in TVJS werden Objekte eingesetzt. Du solltest also mindestens die JavaScript-Umsetzung kennen.

  8 Min.
Grundlagen JavaScript - 22 Eigenschaften von Objekten

Grundlagen JavaScript - 22 Eigenschaften von Objekten

Eigenschaften gehören zur Objektorientierung und sollten grundsätzlich verstanden werden.

  5 Min.
Grundlagen JavaScript - 23 Methoden

Grundlagen JavaScript - 23 Methoden

Auch Methoden sind wichtig und werden dir in den TVJS-Beispielen häufiger begegnen.

  8 Min.

Diese Inhalte könnten dich ebenfalls interessieren

Lade...     Wir sind auf der Suche nach interessanten Trainings für dich, bitte gib uns einen Moment.

© 2002-2018 4eck-Media GmbH & Co. KG • Mit erstellt von 4eck-media.de

Top