Der richtige Umgang mit HTML5

Classroom Schulung | deutsch | Anspruch

Schulungsdauer: 3 Tage

Ziele

In diesem Kurs lernen Sie die neuen Funktionen von HTML5 und deren unmittelbar Anwendung kennen.

Zielgruppe

Webentwickler

Voraussetzungen

  • HTML 4 Kenntnisse
  • praktische Erfahrung mit den Grundlagen von CSS und JavaScript

Agenda

Seitenerstellung mit HTML5

  • Seitenstruktur
  • Neue Strukturtags in HTML5
  • Vereinfachung der Seiten

Geschichte von HTML5

  • Probleme von HTML 4
  • Probleme von XHTML
  • Der neue, flexiblere Ansatz von HTML5 - Trampelpfade schaffen
  • Neue Features von HTML5
  • HTML5 Spezifikation
  • Derzeitige Unterstützung durch Webbrowser

Sektionen und Artikel

  • Section Tag
  • Article Tag
  • Gliederung
  • Barrierefreiheit

HTML5 Audio und Video

  • unterstützte Media Typen
  • Audio Element
    • Audio Formate
    • Mehrere Quellen
    • Attribute des Audio Tag
    • Audio Dateien erstellen und aufrufen
  • Video Element
    • Attribute des Video Tags
    • Video Dateien erstellen und konvertieren
  • Barrierefreiheit
  • Scripting Media Elemente
  • Handhaben fehlender Browserunterstützung

HTML5 Forms

  • Modernizr
  • Neue Eingabetypen
    • Search
    • Tel
    • Url und Email
    • Date/Time
    • Number
    • Range
    • Min, max und step Attribute
    • Color

Neue Formular-Attribute

  • Autocomplete
  • Novalidate

Neue Attribute für Formularfelder

  • Required
  • Placeholder
  • Autofocus
  • Autocomplete
  • Form
  • Pattern

Neue Formular Elemente

  • Datalist
  • Progress und Meter

HTML5 Web Storage

  • Überblick
  • Web Storage
    • Browser Unterstützung
    • Lokaler Storage
    • Session Storage
    • Schlüsselwerte
  • Andere Speichermöglichkeiten
    • Web Database Storage
    • Indexed Database API

HTML5 Canvas

  • Einführung Canvas
  • Linien zeichnen
    • Mehrfache Sub-Paths
    • Einen Path zeichnen
    • Fill() Methode
  • Farben und Transparenzen
  • Rechtecke
  • Kreise und Bögen
  • Quadratische- und Bezierkurven
  • Bilder
    • DrawImage() - Basic
    • DrawImage() - Sprites
  • Text

Integrierte APIs

  • Offline Application API
    • Cache Manifest Datei
    • HTML Datei
    • ApplicationCache mit JavaScript ansteuern
    • Beispielapplikation
  • Drag and Drop API

Ziele

In diesem Kurs lernen Sie die neuen Funktionen von HTML5 und deren unmittelbar Anwendung kennen.

Zielgruppe

Webentwickler

Voraussetzungen

  • HTML 4 Kenntnisse
  • praktische Erfahrung mit den Grundlagen von CSS und JavaScript

Agenda

Seitenerstellung mit HTML5

  • Seitenstruktur
  • Neue Strukturtags in HTML5
  • Vereinfachung der Seiten

Geschichte von HTML5

  • Probleme von HTML 4
  • Probleme von XHTML
  • Der neue, flexiblere Ansatz von HTML5 - Trampelpfade schaffen
  • Neue Features von HTML5
  • HTML5 Spezifikation
  • Derzeitige Unterstützung durch Webbrowser

Sektionen und Artikel

  • Section Tag
  • Article Tag
  • Gliederung
  • Barrierefreiheit

HTML5 Audio und Video

  • unterstützte Media Typen
  • Audio Element
    • Audio Formate
    • Mehrere Quellen
    • Attribute des Audio Tag
    • Audio Dateien erstellen und aufrufen
  • Video Element
    • Attribute des Video Tags
    • Video Dateien erstellen und konvertieren
  • Barrierefreiheit
  • Scripting Media Elemente
  • Handhaben fehlender Browserunterstützung

HTML5 Forms

  • Modernizr
  • Neue Eingabetypen
    • Search
    • Tel
    • Url und Email
    • Date/Time
    • Number
    • Range
    • Min, max und step Attribute
    • Color

Neue Formular-Attribute

  • Autocomplete
  • Novalidate

Neue Attribute für Formularfelder

  • Required
  • Placeholder
  • Autofocus
  • Autocomplete
  • Form
  • Pattern

Neue Formular Elemente

  • Datalist
  • Progress und Meter

HTML5 Web Storage

  • Überblick
  • Web Storage
    • Browser Unterstützung
    • Lokaler Storage
    • Session Storage
    • Schlüsselwerte
  • Andere Speichermöglichkeiten
    • Web Database Storage
    • Indexed Database API

HTML5 Canvas

  • Einführung Canvas
  • Linien zeichnen
    • Mehrfache Sub-Paths
    • Einen Path zeichnen
    • Fill() Methode
  • Farben und Transparenzen
  • Rechtecke
  • Kreise und Bögen
  • Quadratische- und Bezierkurven
  • Bilder
    • DrawImage() - Basic
    • DrawImage() - Sprites
  • Text

Integrierte APIs

  • Offline Application API
    • Cache Manifest Datei
    • HTML Datei
    • ApplicationCache mit JavaScript ansteuern
    • Beispielapplikation
  • Drag and Drop API

Diese Seite weiterempfehlen