Construccion de Paginas Web: marzo 2012

jueves, 29 de marzo de 2012

S04C02: Quiz Conocimientos HTML

Se realizara un quiz escrito donde se evaluaran los conocimientos en tormo al lenguaje HTML :

Temas a Evaluar :

Estructura de un Documento HTML
Uso de Etiquetas

Creacion de Listas
Uso de Imagenes
Manejo de Parrafos

Identificación de conceptos

Que es una pagina web ?
Lenguaje HTML
Hojas de Estilo en Cascada

El examen sera escrito e individual.

miércoles, 28 de marzo de 2012

S04T01 : Terminar Actividad 05

Actividad 05 :

Descargar el archivo de la actividad 5
mcpw_actividad_05.zip
Ir al directorio sitio/css y abrir el archivo style.css
Adicionar el color de fondo de la pagina :
body
{
background-color: lightgray;
}
Abrir cada archivo HTML y adicionar la definición del estilo
<head>
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
Hacer que las paginas estén separadas por 100 pixels del borde de la ventana
Hacer que el contenido de los párrafos estén justificados
Cambiar el estilo de los encabezados (h1) para que el fondo sea azul, la letra sea blanca y el texto este centrado
Eliminar el subrayado de los enlaces
Hacer que la lista de pregrado se visualice con un cuadrado
Hacer que la lista de posgrado se visualice con números romanos

martes, 27 de marzo de 2012

S04C01 : Hojas de Estilo

Hasta el momento hemos utilizado el lenguaje HTML para estructurar el contenido de nuestros sitios, ahora con las hojas de estilo podemos cambiar la apariencia de nuestras paginas asignando colores a los diferentes elementos, alineando el texto en pantalla y modificando un sin numero de características visuales de cada uno de los elementos.

Temas :

La apariencia de las paginas web y el HTML
Las Hojas de Estilo (CSS)

Que es una hoja de estilo
Creación de un archivo con la hoja de estilo
Asignar a la pagina la hoja de estilo
Cambiando el color de fondo de una pagina

Espacio entre elemenos

Margenes (margin)
Acolchamiento (padding)

Manejo de los Colores

Color del Fondo
background-color: lightgray;
Color
color: lightgray;
http://www.w3.org/TR/css3-color/
Calculadora de Colores

Alineación del Texto :

Centrar
text-align:center;
Justificar
text-align:justify;
Izquierda
text-align:left;
Derecha
text-align:right;

Decorando los enlaces :

a:link
a:visited
a:hover
a:active

Decorando las listas :

Listas con circulos
list-style-type: circle;
Listas con cuadrados
list-style-type: square;
Listas ordenas con numeros romanos :
list-style-type: upper-roman;
Listas ordenas con letras :
list-style-type: lower-alpha;

Actividad 05 :

Descargar el archivo de la actividad 5
mcpw_actividad_05.zip
Ir al directorio sitio/css y abrir el archivo style.css
Adicionar el color de fondo de la pagina :
body
{
background-color: lightgray;
}
Abrir cada archivo HTML y adicionar la definición del estilo
<head>
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
Hacer que las paginas estén separadas por 100 pixels del borde de la ventana
Hacer que el contenido de los párrafos estén justificados
Cambiar el estilo de los encabezados (h1) para que el fondo sea azul, la letra sea blanca y el texto este centrado
Eliminar el subrayado de los enlaces
Hacer que la lista de pregrado se visualice con un cuadrado
Hacer que la lista de posgrado se visualice con números romanos

jueves, 22 de marzo de 2012

S03C02 : Actividad Deportiva

El día 22 de Marzo de 2012 se realizara una actividad deportiva con todos los estudiantes del programa de Semilleros de la Universidad Autonoma de Manizales a cargo de la Unidad de Deportes, entre las actividades a realizar estan :

Saludo de Bienvenida
Rumba Terapia
Circuito Cardio
Torneo Relampago de Tenis de Mesa
Torneo Relampago de Baloncesto
Torneo Relampago de Futsala

miércoles, 21 de marzo de 2012

S03T01 : Taller 02 - HTML Basico 2

Taller 02 :

La banda de música electrónica The Chemical Brothers los ha contratado para crear un sitio web especial donde se publicara la información de sus primero tres trabajos, se debe crear un sitio con cuatro paginas :

Pagina principal con el logo de la banda y la lista numerada de la discografía
Una pagina por cada álbum con la lista numerada de canciones
Descargue el archivo con las imágenes y la información detalla del taller aquí : taller2.zip
Realizar el taller de forma individual
Enviarlo por correo al docente

martes, 20 de marzo de 2012

S03C01 : HTML5

En esta clase estaremos hablando de la version 5 del lenguaje para la creación de paginas web, sus nuevas características y su uso en el desarrollo del curso.

Temas :

Evolución del lenguaje HTML
Estado actual del lenguaje
Listas :

Lista de elementos, etiqueta <ul>
Listas ordenadas, etiqueta <ol>
Elementos de una lista <li>

Validación de la pagina con respecto a los estandares
http://validator.w3.org/#validate_by_upload

Actividad 04 :

Descargar el archivo :
mcpw_actividad_04.zip
Convertir las paginas realizadas a HTML5, abrir cada archivo html

Adicionar el tipo de documento al inicio de los archivos html :
<!DOCTYPE html>
Adicionar el tipo de codificacion de los caracteres en el encabezado de la pagina adicionando la etiqueta :
<head>
<meta charset="UTF-8">
<title>Titulo</title>
</head>
Adicionar el atributo alt con un texto alternativo para cada imagen, ejemplo :
<img src="logo.jpg" alt="Logo de la Empresa" />

En la pagina facultad_ingenieria.html convertir la lista de programas de pregrado en una lista y la lista de posgrados en una ordenada
Validar las paginas de modo que no aparezca ningún error

jueves, 15 de marzo de 2012

S02C02 : Taller 01 - HTML Básico

Se deben crear dos paginas web (index.html y mensaje_bienvenida.html) las cuales deben contener la información suministrada por la Universidad (texto e imágenes) para esto se ha creado un archivo que contiene esta información

Descargar el archivo
taller01.zip
Descomprimir y abrir el directorio taller01
Abrir el archivo taller01.pdf y seguir las instrucciones del taller
Comprimir de nuevo el directorio y enviar al correo del docente

S02C02 : Creación del Blog

En esta clase los estudiantes deben crear su propio blog donde deben comenzar a publicar los contenidos que el docente solicite.

Temas :

Creación de un Blog
Nombre del Blog
Publicando la primera entrada

Actividad :

Creación del Blog :

Ir a http://www.blogspot.com
Crear un usuario
Crear un blog para la publicación de tareas

Publicación del Blog :

Los estudiantes deben enviar el enlace del blog al correo del docente para ser adicionados al blog principal del modulo

Creación de una Entrada :

Los estudiantes deben crear una primera entrada donde se presenten indicando la institución a la que pertenecen, el nombre del colegio donde estudian e incluir un enlace a la pagina del modulo.

martes, 13 de marzo de 2012

S02C01 : El Lenguaje HTML

Temas :

Creación de una pagina web con las etiquetas básicas para el titulo de la pagina, un encabezado y un texto usando un editor de texto.

Paginas Web

Lenguaje HTML
Hipertexto
Los Navegadores
Etiquetas Basicas (tags)

Estructura del Documento

<html>, <head>, <body>

Titulo de la Pagina

<title>

Parrafos

Encabezados

<h1>,<h2>,<h3>,<h4>,<h5>,<h6>

Insertar Imagenes

<img>

Enlazar dos paginas

Actividad :

Se crearon dos paginas web que usan las etiquetas vistas en clase, se insertaron imágenes y se adicionaron enlaces para navegar entre paginas.

jueves, 8 de marzo de 2012

S01C01 : Presentación del Modulo

Presentación del Modulo Construcción de Paginas Web a los estudiantes del programa Técnico Laboral en Aplicaciones Web de la Facultad de Ingeniería de la Universidad Autónoma de Manizales.

Temas :

Presentación del Modulo

Programa
Horario de Clase
Actividades de los Estudiantes

Creación de un Blog
Creación de un Sitio Web

Introducción a los temas de :

Internet
Servicios en Internet

Correo
Sitios Web
Blogs

Paginas Web

Actividades :

Escribir :

Nombres Completos
Institución Educativa
Intereses (música, cine, libros)
Ir pensando un nombre para su blog.

martes, 6 de marzo de 2012

Modulo : Construccion de Paginas Web

Módulo:
Construcción de Páginas Web

Programa:

Técnico Laboral en Aplicaciones Web

Área Técnica:

Ingeniería

Docente:

Marlon J. Manrique

Créditos: 3

Horas Presenciales: 4

Horas trabajo dirigido: 3

Horas estudio independiente: 2

Descripción: Conocer los principales elementos de una página Web, de manera que se puedan construir páginas Web estáticas que integren elementos multimedia (texto, imágenes, sonidos y vídeo) siguiendo un diseño previamente establecido.

Clases:

Martes de 4 a 6 pm
Jueves de 4 a 6 pm

Taller:

Miercoles 2 a 4 pm