[html5.wirlernen.at] [Aufgaben zur Lektion] [Video zur Lektion]

Lektion 17: Ein Youtube - Video mit einem Iframe einbinden

Hier lernst du wie man in einer Webseite ein Youtube Video einbinden kann...
Man begibt sich dazu zu Youtube und wählt ein Video der eigenen Wahl - achte darauf dass du auch die RECHTE hast dieses Video in deine Webseite einzubinden!
Von Youtube bekommt man den unten angeführten Code vorgeschlagen (Stand Juli 2012) - das Video soll mit Hilfe des tags iframe eingebunden werden.
Mit Hilfe eines iframe kann man eine ANDERE Webseite (incl. z.B. Texten, Fotos, Videos) in die EIGENE einbinden - es wird für diese fremde Seite ein eigenes Fenster freigehalten - in dieses Fenster wird dann die fremde Webseite hineingeladen...
Ein iframe hat üblicherweise die folgenden Eigenschaften - width steht für die Breite und height für die Höhe des Fensters. Die Angaben stehen für Bildpunkte (Pixel) - man schreibt aber NICHT mehr wie in früheren HTML Versionen px als Einheit dazu.
<iframe width="560" height="315" src="http://www.wirlernen.at" ></iframe>
Für den folgenden Code von Youtube bekommt man im Editor Scriptly aber 2 "Warnungen" angezeigt - der Code würde trotzdem funktionieren :-):

Die im Listing unterstrichenen tags frameborder und allowfullscreen werden in HTML5 selber nicht mehr "verwendet" und können gestrichen werden - unser Editor hat uns von selber darauf aufmerksam gemacht!
Hier unten siehst du den korrekten Code!
Der fertige Code:
<!DOCTYPE html>
<html>

<head>
    <title>Titel</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

</head>

<body>
<iframe width="560" height="315" src="http://www.youtube.com/embed/TKcCc-pQAk4" ></iframe>
</body>
</html>
[Beispiel zur Lektion]


Klicke hier oben auf "Beispiel" - es wird mit Hilfe des iframe - tags ein Video aus Youtube eingebunden. Den fertigen Code bekommst du direkt von Youtube bereit gestellt.
Für mehr Infos klicke hier OBEN auf der Seite auf das Video - Symbol...
Augabenstellung:
1. Erkläre mit eigen Worten (also nicht irgendwo abschreiben :-)) was man unter einem Iframe versteht! Zur Beantwortung der Frage kannst du natürlich auch im Internet recherchieren!
2. Erzeuge in einem Editor ein HTML5 - Grundgerüst! Binde and der richtigen Stelle des Grundgerüsts ein Youtube Video mit einem Klavierkonzert von Mozart deiner Wahl ein! Speichere diese Datei als 017.html. Wähle für diese Webseite mit dem entsprechenden Tag einen aussagekräftigen Titel!