Nachdem ich das heute wieder gebraucht habe, werde ich mal erklären, wie man Youtube Videos XHTML valide einbauen kann.
Da Youtube noch mit embed arbeitet kann 1 eingefügtes Video mit dem Standard „Einbetten“ Code schon 7 oder mehr Fehler in der XHTML Validität erzeugen.
Für jemanden, der darauf wert legt (wie ich), ist da praktisch eine Katastrophe 😀
Sehen wir uns den Aufbau eines Standard-Einbetten-Codes von Youtube einmal an:
Eine Menge Kram, alles nicht valide nach heutigen Standards.
Hier sind die wichtigen Eigenschaften des Videos nochmal auf einen Blick:
- In Zeile 1 steht sowohl Breite als auch Höhe, hier 480×295
- In Zeile 2 sowie 5 finden wir die VideoID (youtube.com/v/[VideoID]), in diesem Fall lQ3D4CqHbJM
- Hinter der VideoID sind noch weitere Parameter für Farbe, Rahmen und son Kram, im Beispiel
&hl=de&fs=1&color1=0x006699&color2=0x54abd6
Schauen wir uns jetzt den XHTML Transitional validen Code an:
Was hat sich geändert?:
- Breite und Höhe sind anders, ist nur so, damit es in meinen Blog passt. Sie werden weiterhin mit height=“***“ und width=“***“ angegeben.
- Die VideoID lQ3D4CqHbJM steht jetzt in data=“ * “ in Zeile 1 und auch in Zeile 2
- Die Parameter stehen in Zeile 2 hinter der VideoID und an das „&“ ist „amp;“ gehangen geworden.
Wie baut ihr nun also schnell ein Youtube Video valide ein?
1. Kopiert euch aus dem Standard-Einbetten-Code aus Youtube die VideoID und die Parameter heraus, also:
lQ3D4CqHbJM&hl=de&fs=1&color1=0x006699&color2=0x54abd6
2. Nehmt euch den validen Code von mir und ersetzt meine VideoID und Parameter mit euren.
3. Sucht in diesem Code nach allen „&“ und fügt immer „amp;“ hinten an, bis keine „&“ mehr vorhanden sind.
Fertig!
So, durch diesen Post handel ich mir natürlich viele Fehler im Code ein, aber das ist der Preis für Aufklärung 😉
Also mir ist das zuviel Aufwand gewesen und setzte ein Plugin ein, dass das automatisch macht. Aber für Blogs die nur ab un zu mal eine Video einfügen ist das Ok!
Vielen Danke für den Tip, war einfach umzusetzen. Jetzt habe ich nur noch das Problem das das Video sich nicht unter die Navileiste schiebt. Da werde ich wohl noch ein bisschen suchen.