Lenguaje HTML y CSS

HTML, siglas de HyperText Markup Language («lenguaje de marcado de hipertexto»), es el lenguaje de marcado predominante para la elaboración de páginas web. Es usado para describir la estructura y el contenido en forma de texto, así como para complementar el texto con objetos tales como imágenes. El HTML se escribe en forma de «etiquetas», rodeadas por corchetes angulares (<,>). HTML también puede describir, hasta un cierto punto, la apariencia de un documento, y puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y otros procesadores de HTML.

Trucos Blogger: Spoiler

A veces queremos cosas en el blog, pero que no se muestren inmediatamente: Hablamos de una película y no queremos que a  nuestros visitantes, que no han visto el final, se lo chafen, o por ejemplo ponemos el enunciado de un problema y no queremos que se vea inmediatamente la solución.

Para ello podemos incluir un "spoiler" que sólo se mostrará si el visitante de nuestra página pulsa un botón. Hay varias maneras de conseguir hacer esto, pero vamos a usar una mediante javascript. Tranquilo. Solo copia y pega el código mostrado en las textarea y modifica únicamente el contenido a mostrar (u ocultar).

<input type="button" onclick="if(document.getElementById('spoiler1') .style.display=='none') {document.getElementById('spoiler1') .style.display=''; this.value = 'Ocultar'; }else{document.getElementById('spoiler1') .style.display='none';this.value = 'Mostrar'; }" value="Mostrar"/><div id="spoiler1" style="display:none"> ...Aquí el contenido que quieres ocultar... </div>

Puedes modificar el nombre que aparece en los botones editando las etiquetas correspondientes.

Iniciación a la programación. Code.org

La asignatura de tecnología incluye múltiples temas referentes a la informática, en los cuales vamos conociendo diversos aspectos del funcionamiento y uso de estas herramientas.

Con este bloque vamos a comenzar a indagar en la programación informática. Vamos a, poco a poco, aprender a crear nuestros propios programas, los cuales realizaran las tareas que nosotros desarrollemos de la forma mas lógica posible. Y para ello vamos a introducir los conceptos de "pensamiento computacional" y de "algoritmo"

Tareas scratch

Paso previo: Revisar esta entrada y crear una cuenta donde crear y almacenar vuestros programas

Tarea 1: Cuenta una historia

Crea un escenario partiendo de los incluidos o mejor subiendo tus propias imágenes. Cárgalos en un proyecto nuevo de scratch. Haz que el personaje principal se mueva por la pantalla y que nos cuente cosas. A mas personajes y mas interacciones, mejor nota

Comparte tu proyecto y cuélgalo en tu blog.

Programación en Scratch

Después de haber dado los primeros pasos en el mundo de la programación con ejercicios totalmente dirigidos, vamos ahora a pasar a idear y crear programas (casi) desde cero. Tendremos que pensar lo que queremos crear, idear el algoritmo que nos permita llevarlo a cabo y por último implementarlo.

Para esto ultimo hay multitud de lenguajes de programación diferentes, desde lenguajes de bajo nivel, que hablan el mismo "idioma" que el procesador del ordenador, como el lenguaje ensamblador, hasta lenguajes de alto nivel, que intentan imitar nuestro lenguaje diario.

Lista desplegable de enlaces en blogger

Aumentamos el nivel de HTML usado. Vamos a necesitar usar un formulario y la etiqueta select. Aun así, tenemos varias opciones:

• Enlace directo. Método onchange

Dentro de un formulario (etiqueta <FORM> </FORM>) creamos una lista desplegable (etiqueta <SELECT></SELECT>) con las distintas opciones a elegir. La opción elegida nos envía a ese enlace con el método ONCHANGE.

Alojar archivos para el blog en dropbox

A veces queremos mostrar contenido en nuestro blog en archivos que no están alojados en otra parte, o bien queremos evitar depender de que quien aloja ese archivo lo borre y deje nuestra página vacía de contenido.
Blogger no cuenta con un sistema de alojamiento de archivos mas allá de lo que nos permita la cuenta de drive asociada: imágenes, google docs...
Antiguamente había algún que otro truco para alojar archivos en drive, por ejemplo una animación flash, y poder enlazarla directamente desde una entrada de blogger. Desde finales de 2016 ese truco dejó de funcionar.

ventana pop up en blogger

Modo rápido y fácil: código javascript onclick

Cada vez que quieras que se abra una ventana pop up usa este código dentro de la entrada o donde lo quieras usar:

<a href="Dirección a la que quieres ir" onclick="window.open(this.href, this.target, 'toolbar=0 , location=1 , status=0 , menubar=1 , scrollbars=0 , resizable=1 ,left=150pt,top=150pt,width=800px,height=600px'); return false;" target="popup"> texto que quieras poner como enlace </a>

Sólo cambia el 0 por un 1 si es que quieres mostrar algo de lo anterior. El tamaño de la ventana lo puedes cambiar donde dice width (ancho) y height (alto). También la posición donde se abre.

De igual forma agrega la URL del documento que abrirá y listo. El resultado será exactamente igual, pero el método es más sencillo ya que no necesitamos agregar nada en la plantilla.