Supuesto práctico - CSS

Con el siguiente ejercicio quisiera poner un caso ficticio que se podría dar en la realidad..erll coomo???.

Para resolverlo hay que tener conocimientos (básicos) en HTML y CSS.

Los objetivos que planteo con este ejercicio son:

1. En primer lugar se pretende una organización y comprensión del código fuente.
   
2. En segundo lugar se pretende la modificación del código fuente de las hojas de estilos en cascada.
   
3. En tercer lugar se pretende elaborar un portal web con la plantilla re-diseñada.
   

Supongamos que una empresa nos contrata para elaborar su web. El gerente nos propone realizar un portal web. Del conjunto de plantillas gratuitas que disponemos en la red, elige la que más le gusta: “Dark Ritual” por la distribución de las columnas y el formato de sus elementos. Esta plantilla fue diseñada por un tal Arcsin (le hago propaganda).

El código HTML del que disponemos está muy confuso ya que no está bien tabulado y apenas se aprecia la distribución de las capas y de los elementos en el código.

En este enlace tenéis los archivos necesarios: plantilla

• En primer lugar deberás organizar el código HTML de la plantilla (ya que es un poco caótico -lo he caotizado yo-) para poder comprender mejor la estructura de capas que se ha diseñado. Haz uso de la tabulación e inserta comentarios para explicar la distribución de las mismas.
  



• Una vez comprendido la distribución, echa un vistazo al código CSS para comprender mejor la posición y los estilos de cada capa. Elimina el código sobrante (no utilizado) de la hoja de estilos.
  
• El gerente nos comunica en primer lugar que la columna que se muestra a la derecha, no le gusta que ocupe la parte superior, sino que empiece al igual que las otras columnas (la del menú y central), justo debajo del título.
  



• Además el gerente nos informa que la imagen que forma el título del portal debe ser cambiada y que debe ocupar el ancho del portal.
  
• Crea varias páginas de ejemplos, de manera que estén enlazadas en el menú lateral y modifica la página de estilos de manera dicha opción aparezca resaltada de otro color cuando se está visualizando la página a la que enlaza.

Ejercicio creado por: Pepe Lluyot

Ejercicio con Hojas de Estilos en Cascada

Un ejercicio fácil de elaborar que permite paso a paso el contruir un portal web haciendo uso de CSS es el siguiente que acabo de elaborar:

Partiendo de la anterior página HTML, donde se han puesto una serie de clases, pretendemos llegar a este resultado final:

Podéis descargaros la página html Inicial y las imágenes desde este enlace.

Antes de comenzar debes echar un vistazo a la estructura de la página inicial. Está comentada y es muy sencilla.

Crea una hoja de estillos llamada default.css y sigue los siguientes pasos:

1. El espacio y el margen de todo el documento por defecto sera 0px (margin, padding)
2. Poner en el body la imágen de fondo bg.gif (alineada en la parte superior y centrada), el color del texto #333, color de fondo #5F8000 y las fuentes Lucida Sanz Unicode, con un tamaño predeterminado del 62.5%.
3. Todos los enlaces de la página serán de color #682 y al pasar por encima de ellos de color: #9A6
4. Los párrafos y listas de todo el documento tendrán un tamaño de 1.2em y una separación por abajo de 1.2em; Además las listas tendrán un margen izquierdo de 1.2em y una imágen por cada elemento de la lista (li.gif)
5. la etiqueta blockquote (tabulación) tendrá un fondo blanco, un tamaño de fuente 0.9em, serán de color #333 y un borde sólido superior e inferior de tamaño 1px y de color #EEE. Los párrafos contenidos dentro de la etiqueta blockquote tendrán una serparación de 3px arriba y abajo y de 0px a la izq y dch.
6. Los título de cabecera h1 tendrá un tamaño de 1.4em. h2,h3 y h4 tendrán el color #654
7. Definir la estructura de la página para la clase container: anchura (702px),  imágen de fondo: (bgcontainer.gif) y centrada en la ventana del navegador.
8. La capa correspondiente al título del portal (clase top), tendrá el fondo de color #567300, será de anchura 630px y altura 60px. Su tipo de letra será Verdana de tamaño 2.4em. Los enlaces  de esta clase serán blancos sin subrayar y ocuparán el 100% de la anchura de la capa. Al pasar el ratón por encima de los enlaces cambiar al color #688B00; Ajustar el espaciado para que tenga un aspecto similar al resultado final.
9. La capa header mostrará la imágen de fondo: header.jpg centrada y con un tamaño de 630x180px.

Bueno vamos a dejarlo por ahora aquí (me duelen los dedos).... continuará

Si has llegado hasta aquí deberíamos ver lo siguiente

...continuará....

Ejercicios Word

Tenéis disponible una relación de ejercicios para realizar con el procesador de texto Word. He subido tan solo 8 ejercicios que hemos realizado este año. El resto se subirán en otro momento.

• Manejo barra herramientas, buscar y reemplazar, ortografía.
• Bloques de texto, Formato fuente, ortografía.
• Formato de fuente y de párrafo
• Formato de fuente y de párrafo. Numeración y viñetas.
• Formato de fuente y de párrafos. Bordes y sombreado.
• Bordes y sombreados. Tabulaciones.
• Tablas. Bordes y sombreados.
• Formato de fuente y párrafo. Bordes y sombreados. Tablas y viñetas.
• Encabezado y pié de página.
• Creación de una web
• Combinar documentos.
• Índice de contenidos

Todos estos y muchos más están disponibles en http://www.lluyot.com

Trabajo web

Como ya hemos finalizado el temario que teníamos propuesto para 1º de Bachillerato (grupos C, D y E), hemos estado valorando algunas de las posibilidades que nos ofrece determinadas herramientas online para realizar webs, blogs, videos, mail,....

Por todo ello se propone el siguiente trabajo, siguiendo las indicaciones y explicaciones desarrolladas en clase.

Trabajo propuesto: pincha aquí

Pistas Informáticas - I

No hace mucho se me ocurrió una adivinanza para mis alumnos.....
A través de las siguientes pistas debéis de conseguir el nombre completo de un personaje ilustre:
Pista 1: Lugar de nacimiento

Podéis adivinar el lugar de nacimiento del personaje a través de las siguientes pistas.
1- Uno de los poetas ilustres perteneciente a la generación que coincide con el día anterior al día Andalucía, obtuvo en 1983 un premio muy preciado.
2- El nombre de este premio coincide con el primer apellido del famoso escritor de aquel ingenioso hidalgo que luchaba contra molinos de viento.

3-De este último escritor, en la famosa obra, “de cuyo nombre no quiero acordarme,”el escudero gordinflón montaba un preciado animal, que con otro nombre, también acompañaba a aquel ogro maloliente que vivía en un horrible pantano. El color de la piel de este ogro corresponde con el principal color de la bandera de la comunidad autónoma del lugar de nacimiento que buscamos.
4- La localidad del poeta del apartado-1 está en la misma comunidad autónoma del lugar de nacimiento y se sitúa a orillas del río Guadalquivir.
5- Existe un modelo de coche SEAT cuyo nombre coincide con el lugar de nacimiento.
6- Otro poeta de esa misma generación (que contaba con su hermano Antonio), hizo una poesía en la que llamaba a esta ciudad “callada”.

Pista 2: Su profesión.
Podéis adivinar la profesión del personaje a través de las siguientes pistas.
1- Mirando detenidamente la siguiente escultura de Auguste Rodin podemos deducir la profesión que buscamos.
2- Podemos componer la profesión uniendo dos palabras:
- La primera palabra corresponde a la parte cortante de un cuchillo, o al borde de un precipicio, aunque en latín signifique otra cosa.
- La segunda palabra tiene nombre de reina (o de infanta) de nuestro país
3- A un colega suyo se le atribuye la famosa frase “Pienso luego existo” (Cogito ergo sum)

Pista 3: Año de nacimiento.
Podéis adivinar el año de nacimiento del personaje a través de las siguientes pistas.
Un matemático, astrónomo y físico alemán llamado Gauss “el príncipe de las matemáticas” a la temprana edad de 10 años dedujo en pocos segundos la suma de los 100 primeros números naturales.
1- Si restamos al año actual (2008) el resultado de esa suma obtenemos un número de cuatro cifras. Si pasamos el resultado a números romanos y contamos las veces que aparece la letra “M”, basta con sumar 1 para conocer el año en que nació nuestro personaje.
2- La persona que buscamos nació poco antes que el llamado “rey de los judíos”, aunque no nació en Nazaret

Pista 4: Otros datos
1- A su padre le llamaban “viejo”
2- Tuvo una muerte trágica, condenada al suicidio.

SU NOMBRE EN LATÍN ES ???

“No nos atrevemos a muchas cosas porque son difíciles, pero son difíciles porque no nos atrevemos a hacerlas”

Propuestas didácticas

Actividades didácticas realizadas por profesores del IES Cristóbal de Monroy.

El año pasado coordiné un grupo de trabajo en el que se recopilaron actividades de distintas materias para llevarlas a cabo en las horas de guardia (del centro - instituto). Muchas son creaciones de profesores y otras son recopilaciones de actividades captadas de Internet.
Es un buen recurso didáctico disponible pa' quien lo quiera usar.
Al final para que estuviesen disponibles para todo el mundo hice una pequeña tabla con todas ellas. Pincha aquí.

Un saludo.

Ejercicios y tutoriales de Informática

He empezado a elaborar una página sencilla conteniendo ejercicios que tengo elaborados de diferentes temas de distintos niveles educativos, además de diferentes manuales que pueden servir de utilidad.

4º ESO - Informática Aplicada.
1º Bachillerato - Informática Aplicada.
Ciclo Formativo de Grado Medio - Explotaciones de Sistemas Informáticos
Ciclo Formativo de Grado Superior - Desarrollo de Aplicaciones Informáticas
Ciclo Formativo de Grado Superior - Administración de Sistemas Informáticos

Espero tenerlo pronto.. http://www.lluyot.com/
Salu2.