HTML, CSS y JS. Insertar Comentarios

Con el fin de entender mejor lo que hemos ido haciendo en nuestro código, es muy conveniente ir poniendo comentarios de forma que podamos verlas en el código, pero de forma que no se muestren en la web.

Insertar comentarios en HTML. Utilizaremos los siguientes símbolos:

<!-- Esto es un comentario en HTML -->

Insertar comentarios en CSS. Utilizaremos los siguientes símbolos:

/* Esto es un comentario en CSS */

Insertar comentarios en JS. Utilizaremos los siguientes símbolos:

Para un comentario de una línea:

// Esto es un comentario en JS de una línea

Para comentarios de varias líneas:

/*

Esto permite

Hacer comentarios

En varias líneas

Este texto puede decir lo que quieras

para acordarte de algo

*/

HTML - Abrir un enlace en una pestaña nueva

Es fácil usar HTML para abrir un link en una nueva pestaña. Solo necesitas un elemento "anchor" (<a>) con tres atributos:

• El atributo href para poner la URL de la página que quieres enlazar.
• El atributo target  si se pone en _blank, dice al navegador que abra el link en nueva tab o ventana.
• El atributo rel se pone nofollow noopener noreferrer para prevenir posibles ataques maliciosos del sitio externo al que enlaces.

Ejemplo: 

<a href="http://sitio.com" target="_blank" rel="nofollow noopener noreferrer">Enlace a sitio externo</a>

Para saber más:

NorfiPC

FreeCodeCamp

W3schools

Actividades Hardware

 Liveworksheets nos ofrece la posibilidad de practicar y comprobar nuestros conocimientos mediante fichas interactivas. Veamos algunas.

1. Partes básicas de un PC
2. El Hardware
3. Hardware o Software
4. Hardware o Software
5. El ratón
6. Hardware o Software
7. Hardware o Software
8. Partes de un ordenador
9. Hardware o Software
10. Hardware o Software
11. Imput or Output
12. Componentes de un ordenador
13. Partes internas del ordenador
14. El sistema Informático
15. Examen de Computación

Iniciación a la Programación con FMSLogo

FMSLogo es un lenguaje que nos permite construir programas que pueden ser ejecutados por el ordenador. 

Su principal característica es que mediante una serie de órdenes o comandos se puede dirigir el movimiento de un triángulo (tortuga) que va trazando una línea en el área de trabajo. De esta forma se pueden hacer diversas figuras que permiten visualizar la ejecución de los programas.

En un modo avanzado podemos hacer juegos, ejercicios matemáticos, gráficos e incluso controlar pequeños motores o bombillas, etc.

Para más información

Manual IES Los Albares

Manual SourceForge

FMSLogo SourgeForge

Memoria RAM

RAM es un acrónimo del inglés, Random Access Memory o memoria de acceso aleatorio, y sirve para dotar al sistema de un espacio virtual necesario para manejar información y realizar tareas en cada momento instantáneo. Podría decirse que es como un papel en el que se toman notas y luego se tira, o siendo más exactos con el ejemplo, se borra y luego se reutiliza, puesto que es una memoria volátil, es decir, no almacena datos de forma permanente.

Más información:

• Tipos de memoria RAM.
• Tipos de ranuras para memorias RAM.

Viaje al interior de un microchip

 

Vivimos en la "nube"

Del trabajo remoto a las compras por Internet, cada vez dependemos más de la nube informática. La nube de Microsoft cuenta con tecnología de cientos de centros de datos globales interconectados que ofrecen contenido y servicios. Échale un vistazo al interior de un centro de datos de Microsoft para saber cómo proporcionan tecnologías punteras.

Entra en la nube

Publicación y difusión de contenidos

1. Plataformas de publicación y distribución de contenidos en la web. Gestores de contenido. 
   • Reconocer y describir las características y principios en los que se basa la web social.
   • Explicar las características de la web 2.0 y los principios en los que se basa.
   • Ejemplos:
     • Magento, CMS para tiendas online.
     • Moodle, LMS (Learning Management System) para formación online o elearning.
2. Entornos de trabajo colaborativo y de apoyo a la formación. 
   • • Ejemplo: 25 recursos TIC para trabajo colaborativo.
3. Diseño y creación de páginas web estáticas y dinámicas. Estándares de publicación. 
   • • Ejemplo: Vídeo estáticas – dinámicas.
4. Estrategias de posicionamiento web. 
   • Publicar en la web utilizando licencias de distribución adecuadas y aplicar técnicas de promoción para mejorar su posicionamiento en los buscadores.
     • Ejemplo: SEO para WordPress.
5. Validación y accesibilidad de las páginas web. 
   • Realizar baterías de pruebas de accesibilidad y usabilidad a sus páginas, así como documentar el resultado de las mismas.
     • Ejemplo: Estándares de Accesibilidad de Vimeo.
     • Ejemplo: Vídeo W3C.

VPN

Una VPN (Virtual Private Network) es una tecnología de red que se utiliza para conectar una o más computadoras a una red privada utilizando Internet.

Las VPNs son herramientas muy útiles cuando se accede a una red desconocida (como cafeterías, centros comerciales o cualquier otro lugar que permita a cualquier persona acceder a Internet) especialmente si queremos acceder a sitios en los que se precisen claves de acceso o se quieran hacer pagos online.

Para saber más

GIF Animado

Podemos crear una animación con el programa Gif Animator.

Para crear las imágenes puedes emplear un programa de dibujo como Paint.

Partimos de un dibujo base que guardaremos con el nombre de gif1 o imagen1.

Modificamos ligeramente el dibujo para crear la siguiente viñeta y la guardamos con el número2.

Repetimos la operación hasta tener todas las viñetas.

Es muy importante ir guardando las imágenes en formato GIF.

Una vez que tenemos las viñetas, abrimos el programa GifAnimator y seguimos las instrucciones que podemos ver en el siguiente vídeo:

Subtitular Vídeos

¿Quieres introducir subtítulos en tus vídeos para hacerlos más accesibles a personas: 

• Con problemas de audición.
• Que se encuentran en un lugar público y no quieren activar los altavoces del equipo. 
• Que no son nativas en el idioma?

Los subtítulos (llamados «Captions» en inglés) permiten mostrar el texto de lo que vas diciendo en pantalla.

Para saber más mira el videotutorial de Meritxel Viñas en su academia Totemguard

Formación en la Red

Una de las posibilidades que nos ofrece internet es la de adquirir conocimientos a través del ordenador, que de otra forma sería más difícil o costoso, todos hemos solucionado algún problema gracias a algún videotutorial, pero las posibilidades de formación en la Red van mucho más allá. Aquí van algunos ejemplos: 

Centro de Aprendizaje Office 365:

Para sacar todo el partido a la cuenta de Microsoft de Educastur.

Fundación Telefónica: 

 

En Conecta Empleo, de la Fundación Telefónica cuentan con un amplio y variado catálogo de cursos online gratuitos.Estos MOOC tienen una duración de entre 30 y 40 horas y los puedes realizar a tu ritmo.

Aula Fácil
En este sitio encontraremos todo tipo de cursos en castellano. Algunas de sus características son: TODOS los cursos son GRATIS. NO necesita registrarse, se puede comenzar simplemente entrando en el curso. Algunos cursos tienen CERTIFICADOS GRATIS.

MiriadaX
En este sitio puedes encontrar infinidad de Mooc, que es el acrónimo en inglés de Massive Online Open Courses (o cursos online masivos y abiertos). Muchos de ellos son ofertados por universidades de todo el mundo.

Aulaclic
Otro buen sitio con multitud de cursos en castellano.

Codecademy
Muy buenos cursos para iniciarte en programación. Hay que registrarse, la mayor parte están en inglés, pero también tiene su versión en castellano.

Nos registraremos para iniciarnos en la programación con HTML, ya que en la misma pantalla se pueden ir viendo las instrucciones, el editor HTML y el resultado de la página Web.

HTML Dog
Sitio especializado en HTML, CSS y JavaScript. Está en inglés, pero es muy interesante y didáctico, con ejemplos prácticos y varios niveles.

Mil Cursos Gratis
Como su propio nombre indica, este sito ofrece formación de todo tipo.

Mecatrónica LATAM
Sitio para los interesados en electrónica analógica y digital, completado con mecánica, muy ingenieril.

Kham Academy
Otro buen sitio donde aprender casi de todo y como no, también computación. Su fundador fue Premio Princesa de Asturias de Cooperación Internacional 2019. Está disponible en castellano y tiene algún curso interesante para iniciarse en JavaScript dibujando.

Code Avengers

Sitio para aprender HTML, CSS y JavaScript, especialmente dirigido a jóvenes. Parece entretenido.

Code
Otro sitio para aprender a programar, los contenidos se explican desde el nivel más básico, por lo que no importa la edad, por lo que es un sitio adecuado para niños. Los cursos son gratuitos y no es necesario registrarse.

UniWebsidad

Un sitio especialmente dedicado a todo lo que tiene que ver con la creación de páginas Web. Gratuito y en Castellano.

CodeBug

 

Codebug este enlace lleva a un emulador online donde se muestra un programa que tiene un error, “bug” en inglés.

Primer reto: sigue las instrucciones para reparar el código del ejemplo. Captura la pantalla con el programa modificado e insértala en tu blog, en una entrada titulada Codebug I.

Segundo reto: modifica el programa para que los LED de la última fila se enciendan y apaguen sucesivamente de uno en uno. Captura la pantalla con el programa modificado e insértala en tu blog, en una entrada titulada Codebug II.

Tercer reto: modifica el programa para que se vea una figura parpadeante, puede ser una letra, un número o un icono que te inventes. Captura la pantalla con el programa modificado e insértala en tu blog, en una entrada titulada Codebug III.

Derechos de Autor

Los derechos de autor son un conjunto de normas jurídicas que afirman los derechos morales y patrimoniales que la ley concede a los autores, por el simple hecho de la creación de una obra literaria, artística, musical, científica o didáctica.

Los derechos de autor son uno de los derechos humanos fundamentales en la Declaración Universal de los Derechos Humanos.

Copyright: Todo creador de una obra intelectual por el hecho de ser el autor posee inicialmente los derechos de Copyright de esa obra. Estos derechos son:

• Derecho a hacer copias.
• Derecho a distribuir copias.
• Derecho a hacer trabajos derivados (traducciones, adaptaciones...)
• Derecho a exposición pública.
• Estos derechos existen desde que el trabajo es creado y pertenecen al autor, este los puede vender, alquilar, transferir o donarlos individualmente o en conjunto.

Una obra pasa al dominio público cuando los derechos patrimoniales han expirado. Esto sucede habitualmente trascurrido un plazo desde la muerte del autor. El plazo mínimo, a nivel mundial, es de 50 años. Muchos países han extendido ese plazo, por ejemplo, en el Derecho europeo, son 70 años desde la muerte del autor. Una vez pasado ese tiempo, dicha obra puede ser utilizada en forma libre, respetando siempre los derechos morales.

Copyleft: consiste en permitir la libre distribución de copias y versiones modificadasde una obra, pero exigiendo que se ejecuten los mismos derechos en las versiones modificadas.

Software libre: se autoriza a usarlo, copiarlo, editarlo y distribuirlo. Suele ser gratuito, pero no necesariamente. La mayor parte del software libre está protegido por derechos de autor, es decir, el autor nos da un permiso legal para poder usarlo libremente bajo una licencia de software libre. Para que sea software libre tiene que tener el código fuente disponible (Open Source).

Free Software Foundation (Fundación para el Software Libre): es una organizacióncreada para difundir el movimiento de software libre. Una de las principales funciones de esta organización es dar soporte legal, económico y logístico al Proyecto GNU.El proyecto GNU fue iniciado por Richard Stallman para crear un sistema operativo totalmente libre. La Licencia Pública General de GNU (GNU GPL) es una licencia creada por la FreeSoftware Foundation para proteger la libre distribución, modificación y uso del software. El software que tenga esta licencia es software libre protegido con copyleft.

Las licencias Creative Commons o CC: están inspiradas en la licencia GPL de la FreeSoftware Foundation. La Creative Commons (CC) es una organización gubernamental sinánimo de lucro que ofrece una alternativa a los derechos de autor completos. Signofica que los autores nos las dejan utilizar sus obras con algunas condiciones.

Canon digital
La LPI (Ley de la Propiedad Intelectual) recoge en el artículo 31 el derecho a la copia privada, es decir, el derecho a hacer copias privadas sin permiso del autor siempre que no exista ánimo de lucro. Para compensar a los autores, introduce el pago de un canon compensatorio asociado a algunos soportes de grabación (CD, DVD, casetes, reproductores MP3…) y grabadoras (cámaras fotográficas, grabadoras de CD/DVD, fotocopiadoras, etc.). Los importes recogidos por este concepto tienen que ser gestionados a través de sociedades de gestión de derechos de autor (como SGAE y CEDRO).

Más información:

OMPI (Organización Mundial de la Propiedad Intelectual)

Conexión a Internet en los 80

En el siguiente vídeo puedes ver cómo era la conexión a internet en 1983. Era la tecnología punta de la época en Estados Unidos, aquí nos conformábamos con verlo en el cine como algo de ciencia ficción.

También es muy interesante el contexto político mundial, en plena guerra fría entre el bloque occidental liderado por los EEUU y el bloque comunista capitaneado por la URSS.


Película Completa

RoboMind

ROBO es un lenguaje de programación sencillo que está diseñado para familiarizarte con las reglas básicas de las ciencias de la computación mientras que programas tu propio robot.

ROBO está diseñado de tal manera que puedes comenzar a explorar y programar rápidamente. Para ello se ha creado un lenguaje de programación especial que ofrece muchísimas oportunidades para crear tus propios programas y experimentar con los principios que rigen a los lenguajes de programaciones mas comunes.

El programa tiene la gran ventaja de que se puede instalar y ejecutar desde una memoria USB.

Inicio RoboMind

Robomind Online

Descargas

Documentación y ejemplos
Apuntes y ejercicios