Videokurs komplett (als Download): von den Grundlagen zur fertigen Website (HTML + CSS) mit unterschiedlichen Layouts und eigenem Design

Beschreibung Kursteil A+B: Grundlagen Erstellung Website (HTML + CSS) und 1-Spalten Layout

Über die Videos lernen Sie das Erstellen einer Website. Alle für eine erfolgreiche Website notwendigen HTML-Befehle werden Schritt für Schritt vermittelt, so dass man nach dem Kurs ein Verständnis von HTML hat und seinen eigenen Internetauftritt komplett aufbauen kann. Natürlich darf das Design für Ihre Webseiten nicht fehlen. Dieses wird über CSS umgesetzt. Im Kursteil B werden alle CSS-Anweisungen vorgestellt und das Design für ein einspaltiges Layout umgesetzt (mehrspaltige Layouts gibt es im Kursteil C). Mit dieser Website können Sie bereits Online gehen.

Der Kurs ist praxiserprobt und verständlich aufgebaut (man muss kein Informatiker sein oder studiert haben, um HTML zu lernen und eine erfolgreiche Website aufzubauen). Die Videos sind auf Basis meiner an der Uni gehaltenen Kurse entstanden. Grundlegender Aufbau: nach einer Einführung zu einem Thema kommt eine Übung und im nächsten Video die Lösung dazu. Schritt für Schritt zum Durchblick. Durch das Verständnis der Zusammenhänge erstellt man bessere Websites als irgendein Baukastensystem!

Inhalt Kursteil A:

• Grundlagen von HTML + HTML5 (für Inhalt und Struktur Ihrer Website)
• Fortgeschrittenes HTML

Inhalt Kursteil B:

• CSS (um Design umzusetzen)
• Beispielprojekt: 1-Spalten-Layout

Laufzeit 10:25 Stunden

Inhalt Kursteil C: mehrspaltiges Layout und Bildbearbeitung (Fortgeschrittenenkurs)

Wir erweitern unsere Möglichkeiten um die Möglichkeiten von mehrspaltigen Layout bei Websites. Die meisten Internetauftritte haben mindestens ein 2-spaltiges Layout. Im Kursteil schauen wir uns die technischen Grundlagen für mehrspaltige Layouts an und setzen dann 2 Beispielprojekte um.

Nach dem 2-spaltigem Layout bearbeiten wir Bilder, damit wir diese ideal in Webseiten nutzen können.

• Beispielprojekt: 2-Spalten-Layout als Website
• Beispielprojekt: 3-Spalten-Layout (Projekt www.fennek.mobi)
• Bildbearbeitung für Websites

Laufzeit 6:50 Stunden

Inhalt Kursteil E: mehr Design über CSS3

In den bisherigen Kursteilen haben wir Design über CSS kennen gelernt. CSS3 stellt eine Erweiterung von Designmöglichkeiten dar. Darüber sind einfach transparente Farben und Bereiche, Schatten, Farbverläufe, runde Ecken, Animationen und vieles weitere sehr einfach umsetzbar.

CSS3-Effekte können über bestehendes Design „übergestülpt“ werden und geben der Website den letzten Schliff. Durch einfache Tricks und Tipps kommen sehr schnell ansehnliche Ergebnisse zustande, die wir uns in diesem Kursteil ansehen.

• Farben (hsla), Durchsichtigkeit & opacity
• Farbverläufe
• Schatten (box-shadow, text-shadow)
• Rahmen mit runden Ecken (border-radius)
• Transformationen
• Animationen mit Keyframes
• mehrere Hintergrundbilder
• web-fonts einsetzen
• neue CSS3-Selektoren
• media-queries
• Mehrspaltenlayout

Laufzeit 5:50 Stunden

Inhalt Kursteil F:
responsives Webdesign für Handy und Tablet

Automatisch soll sich das Design für Handy und Tablets an die kleinen Displays anpassen. Das erreichen wir über responsives Webdesign – hier wird die Abkürzung RWD verwendet. Responsives Design reagiert automatisch auf die Auflösung der genutzten Geräte. Der große Vorteil der Umsetzung ist, dass wir einfach unser bestehendes Design mit responsiven Webdesign erweitern können.

In diesem Kursteil werden die Grundlagen und die Möglichkeiten von Webdesign für Handy und Tablet (und allen Geräten mit beschränkten Displays) erklärt. Nach den Grundlagen erweitern wir unsere bisher in den anderen Kursteilen erstellten 1- bis 3-spaltigen Layouts mit dem passenden responsiven Design. Wir machen unsere Websites für alle Anzeigegeräte optimal zugänglich.

Inhalt Kursteil F: Responsive Webdesign (RWD)

• Grundlagen Webdesign für Handy und Tablet
• Responsive Webdesign und der Einsatz
• Beispiele, Aufgaben und Lösungen
• Umsetzung des 1-Spalten-Layouts in RWD
• Umsetzung des 2-Spalten-Layouts in RWD
• Umsetzung des 3-Spalten-Layouts in RWD

Laufzeit 6:55 Stunden

Inhalt Kursteil D:
Einführung in JavaScript und jQuery

Über JavaScript und jQuery werden Interaktionen auf Websites umgesetzt. Sehr oft erfolgt eine Überprüfung von Formulareingaben anhand der Programmiersprache JavaScript und jQuery und werden Bildergalerien darüber erstellt. Im Kurs gibt es eine Einführung in beide Bereiche, damit die Zusammenhänge und das Zusammenspiel beim Einsatz in eigenen Websites klar sind.

Einführung in JavaScript

• Einbinden in HTML-Seiten
• Variablen
• Bedingungen
• Schleifen
• eigene Funktionen
• Objektorientierung

jQuery-Ausflug:

• einbinden von jQuery
• Elemente animiert ein- u. ausblenden
• DropDown-Menü
• Bildergalerie

Laufzeit 4:50 Stunden