Comprar, tirar, comprar - Vídeo sobre el consumismo - Tarea 3

Hola, hoy nos toca hacer la Tarea 3 de este artículo, que es entender el código html de inserción de un vídeo.

Comprar, tirar, comprar el documental que relata la historia secreta de la obsolescencia programada. Duración 1h:18m. El enlace a Youtube es  

https://www.youtube.com/watch?v=mUaCLzbDgm0

Tarea 1  ver en clase el vídeo en 2 sesiones o 3 (ya está hecho).

Tarea 2  cuestionario sobre el audiovisual
(ya está hecho).

Tarea 3  crea un artículo en tu blog con la pantalla de vídeo que lo reproduzca. Investiga en Internet cómo se hace.

El siguiente código html te puede servir de ayuda para incrustar el audiovisual:

<iframe width="560" height="315" src="https://www.youtube.com/embed/mUaCLzbDgm0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

<iframe.....>   quiere decir que se inserta un vídeo
width="560"   es la anchura con la que queremos que se vea en el artículo
height="315"  es la altura con la que queremos que se vea en el artículo
src="https://www.youtube.com/embed/mUaCLzbDgm0"                     es la orden src="...." con la dirección URL del vídeo
frameborder="0"   es el tipo de borde que mostrará el vídeo

allow="accelerometer   supongo que es para que si se ve la web desde un móvil, se pueda utilizar el dedo sobre la pantalla (investiga tu si quieres y me lo dices)
autoplay   permite que el vídeo se inicie automáticamente

encrypted-media  
permite la reproducción sin plugins de contenido protegido (cifrado) en navegadores web, de manera que funcione perfectamente en todas las plataformas principales
gyroscope  activa el giroscopio - combinación del osciloscopio y de los acelerómetros (sensores capaces de captar la inclinación del dispositivo y la aceleración de dicho movimiento) lo que permite al smartphone saber en qué plano del espacio se encuentra, cuál es su aceleración con respecto al punto de partida y si el dispositivo está girando sobre el plano o inclinándose.
picture-in-picture"  es una función que abre el vídeo que estamos viendo en una ventana flotante de la pantalla. YouTube ya lo incorporó en su aplicación para móviles y seguro que ya lo has probado.
allowfullscreen permitir redimensionado hasta cubrir la pantalla por completo.
</iframe> es la contraorden de <iframe.....>, y la cierra.


Las preguntas del formulario que ya hiciste fueron inspiradas por el siguiente material (ya no es necesario que lo mires):
Para seguir trabajando con los contenidos de este vídeo tenemos este material hecho por el Ministerio de Educación, Cultura y Deporte (MECD): https://leer.es/documents/235507/242734/eso4_cs_his_prof_usodocumental_albaambros_ramonbreu.pdf/5d9e5579-26ad-4a85-9bdd-7050e817c5db

HTML - 2ª Parte - Texto sencillo e imagen usando código html

Cuando publicamos un artículo en un blog y usamos los iconos superiores, en ocasiones se autoescribe códico innecesario, por eso los programadores prefieren teclear ellos personalmente las instrucciones.

Ya sabes que los bogs están escritos en código de programación HTML. También sabes copiar código y pegarlo, pero quizá no lo entiendas aún. Las instrucciones más básicas son:

• <br /> para cambiar de renglón
• <i>Así es como se pone un texto en cursiva</i>
• <b>Así es como se pone un texto en negrita</b>
• <u>Así es como se pone un texto con subrayado</u> 
• <ul> para iniciar un listado como éste con viñetas (el puntito inicial)</ul>
• <li> para iniciar un nuevo renglón en un listado con viñeta</li>

Si queremos pegar la imagen desde una dirección web, tenemos que usar
<img src="dirección de la página">

Por ejemplo:
<img src="https://www.blogger.com/img/blogger-logotype-color-black-1x.png">


Tarea de hoy:

- Prueba a hacer una lista de la compra con al menos 5 productos, en un artículo de tu blog, con título "Lista de la compra" en negrita cursiva y subrayado, con la pestaña "HTML"  activada (en el menú superior a la derecha) y pegar una imagen que venga al caso, con su dirección de internet según el ejemplo que te acabo de explicar, sin utilizar en ningún momento la pestaña "Redactar".

- Realiza una captura de lo que has tecleado.

- Pasa a la pestaña "Redactar" para ver cómo se vería en el blog y realiza otra captura de la pantalla.

- Mándame las dos capturas en un correo electrónico (a mi correo institucional, no al otro) y publica como borrador el artículo en tu blog, con título de la entrada "Lista de la compra e imagen con código HTML" y etiqueta: 5 Bloque - Programación en HTML.


P.D. Si no te contesto a tu mensaje de entrega de tarea (esta tarea o cualquiera de las anteriores), es que no la he recibido, lo digo por si hay alguien mandando cosas a alguna dirección de correo que no es la mía.

HTML - 1ª Parte

Si quiero escribir una lista de recados en código html como la siguiente:

Tareas de hoy

• Ir al banco a las 8:30 a por una fianza.
• Llevar las escrituras de un cliente al notario.
• 11:30 cita con un cliente en la gestoría + café.
• 13:00 hacer declaraciones trimestrales hasta las 14:00.
• 16:00 recoger escrituras en notario
• 17:00 hacer declaraciones trimestrales hasta las 20:00.

tendría que usar los siguientes trucos:

<i><u><b>Tareas de hoy</b></u></i><br />
<ul>
<li>Ir al banco a las 8:30 a por una fianza.</li>
<li>Llevar las escrituras de un cliente al notario.</li>
<li>11:30 cita con un cliente en la gestoría + café. </li>
<li>13:00 hacer declaraciones trimestrales hasta las 14:00.</li>
<li>16:00 recoger escrituras en notario </li>
<li>17:00 hacer declaraciones trimestrales hasta las 20:00.</li>
</ul>

y ahora te traduzco lo que significa cada cosa:

• <br /> para cambiar de renglón
• <i>Así es como se pone un texto en cursiva</i>
• <b>Así es como se pone un texto en negrita</b>
• <u>Así es como se pone un texto con subrayado</u> 
• <ul> para iniciar un listado como éste con viñetas (el puntito inicial)</ul>
• <li> para iniciar un nuevo renglón en un listado con viñeta</li> 

Tarea de hoy: intenta entender estos conceptos, para aplicarlos en la tarea que pondré el próximo día.

Tarea 25-03-2020 - 10minutemail.com + translate.google.es

https://10minutemail.com Es una web que te facilita un correo electrónico temporal para darte de alta en ciertas webs que te obligan a dar tus datos de correo, nombre... si sólo quieres entrar a curiosear o a usarlas una sóla vez.

Cuando das tu correo electrónico en este tipo de sitios, lo utilizan después par hacer spam, y es muy molesto.

Traduje con https://translate.google.es el texto del inglés a español:

Inglés	Español
Free Temporary Email Why would you use this? Maybe you want to sign up for a site which requires that you provide an e-mail address to send validation e-mail to. And maybe you don't want to give up your real e-mail address and end up on a bunch of spam lists. This is nice and disposable. And it's free. Enjoy!	Correo electrónico temporal gratuito ¿Por qué usarías ésto? Tal vez desee registrarse en un sitio que requiere que proporcione una dirección de correo electrónico para enviar un correo electrónico de validación. Y tal vez no quiera renunciar a su dirección de correo electrónico real y terminar en un montón de listas de spam. Esto es agradable y desechable. Y es gratis. ¡Disfrutar!

Por favor, envíame un correo electrónico con:

- Captura de pantalla de esta web.

- Respuestas a las siguientes preguntas (copia las preguntas y pégalas en el correo):

1. En https://10minutemail.com ¿Cuántos minutos dura el correo electrónico temporal que se genera automáticamente? . . . . . . . .
2. ¿Se puede ampliar el tiempo que dura ese correo? . . . ¿Cómo? . . . . . . . . .
3. ¿Te piden que te registres de alguna manera? . . . .
4. ¿Es de pago? . . . .
5. En https://translate.google.es en la selección de idioma ¿hay esperanto? . .
6. ¿y asturiano? . . .
7. La traducción que hace esta web no siempre es correcta, y admite sugerencias de corrección ¿Crees que en este caso la traducción ha sido correcta? . . . 
8. Traduce el mensaje original a uno de esos idiomas y pégalo en el correo aquí: . . . 
9. ¿Te piden que te registres de alguna manera? . . . .