edUTecNe

Editorial Universitaria de la
 
UNIVERSIDAD TECNOLÓGICA NACIONAL
U.T.N. - Argentina
Inicio Institucional Contáctenos  PUBLICACIONES   Cómo Publicar Buscar

   TUTORIAL (requisito: conocimientos básicos del lenguaje HTML)

Inserción de un Video desde YouTube en una página web

   Introducción: el formato de los URL de YouTube

Los URL (direcciones) de las páginas/ videos de YouTube tienen las siguientes características:
1.- Dirección principal:  http://www.youtube.com
      2.- Código que indica cómo se presentará la página o el video [por ejemplo  /watch?v=  ]
            3.- Identificador del video  [por ejemplo:    cTcjC5Hr6A4  ]

De acuerdo a los ejemplos anteriores, el URL completo es:
http://www.youtube.com/watch?v=cTcjC5Hr6A4

Variantes del código que indica cómo se presentará la página o el video:
 1.-     /watch?v=
Este código hace que el link se dirija a la página original del video, en la que se encuentran referencias a sus características y en la que se puede interactuar.
 
2.-      /v/
Este código hace que el link se dirija exclusivamente al video.  Este aparecerá en toda la pantalla.
               Ejemplo:         http://www.youtube.com/v/cTcjC5Hr6A4
 
3.-      /embed/
Este código hace que al operar el link el video se "incruste" (embed) en la pantalla.  El efecto es similar al anterior.
              Ejemplo:         http://www.youtube.com/embed/cTcjC5Hr6A4 


   1.- Ejemplo utilizando un link convencional dirigido al video

edutecne

<a href="http://www.youtube.com/embed/cTcjC5Hr6A4">
<img src="edutecne.jpg"  alt="edutecne" width="420">
</a>


Nota: al hacer click en el link (imagen) se salta al video de YouTube. El video ocupa toda la pantalla.


   2.- Ejemplo utilizando el elemento HTML <embed>

<embed src="http://www.youtube.com/v/cTcjC5Hr6A4"
type="application/x-shockwave-flash" allowfullscreen="true"
height="344" width="425">

Nota: el URL del video puede ser "http://www.youtube.com/v/........."  o   "http://www.youtube.com/embed/.........."

   3.- Ejemplo con el elemento HTML <iframe>

<iframe width="420" height="345"
src="http://www.youtube.com/embed/cTcjC5Hr6A4";
</iframe>

Nota: el URL del video puede ser "http://www.youtube.com/v/........."  o   "http://www.youtube.com/embed/.........."

Para bajar este tutorial en formato PDF -->>

edUTecNe [Editorial Universitaria]
Universidad Tecnológica Nacional - U.T.N.
Sarmiento 440 - (C1041AAJ) - Ciudad Autónoma de Buenos Aires - Argentina
edutecne@utn.edu.ar

© [Copyright]

La Editorial de la U.T.N. recuerda que las obras publicadas en su sitio web son de libre acceso para fines académicos y como un medio de difundir el conocimiento generado por autores universitarios, pero que los mismos y edUTecNe se reservan el derecho de autoría a todos los fines que correspondan.


SUBIR   subir

 

sitios utiles