Actividad HTML

1. Historia del html

2. Estructura de una página en html

3. Que es una etiqueta y cual es su sintáxis para su manejo en html?

4. Etiquetas básicas que maneja html con ejemplos

5.  Manejo de tablas en Html, Realizar un ejemplo

5. Manejo de formularios en HTML, realizar un ejemplo

Actividad HTML

Historia de HTML

El origen de HTML se remonta a 1980, cuando el físico Tim Berners-Lee, trabajador del CERN (Organización Europea para la Investigación Nuclear) propuso un nuevo sistema de "hipertexto" para compartir documentos.

Los sistemas de "hipertexto" habían sido desarrollados años antes. En el ámbito de la informática, el "hipertexto" permitía que los usuarios accedieran a la información relacionada con los documentos electrónicos que estaban visualizando. De cierta manera, los primitivos sistemas de "hipertexto" podrían asimilarse a los enlaces de las páginas web actuales.

Tras finalizar el desarrollo de su sistema de "hipertexto", Tim Berners-Lee lo presentó a una convocatoria organizada para desarrollar un sistema de "hipertexto" para Internet. Después de unir sus fuerzas con el ingeniero de sistemas Robert Cailliau, presentaron la propuesta ganadora llamada WorldWideWeb (W3).

El primer documento formal con la descripción de HTML se publicó en 1991 bajo el nombre HTML Tags (Etiquetas HTML) y todavía hoy puede ser consultado online a modo de reliquia informática.

La primera propuesta oficial para convertir HTML en un estándar se realizó en 1993 por parte del organismo IETF (Internet Engineering Task Force). Aunque se consiguieron avances significativos (en esta época se definieron las etiquetas para imágenes, tablas y formularios) ninguna de las dos propuestas de estándar, llamadas HTML y HTML+ consiguieron convertirse en estándar oficial.

En 1995, el organismo IETF organiza un grupo de trabajo de HTML y consigue publicar, el 22 de septiembre de ese mismo año, el estándar HTML 2.0. A pesar de su nombre, HTML 2.0 es el primer estándar oficial de HTML.

A partir de 1996, los estándares de HTML los publica otro organismo de estandarización llamado W3C (World Wide Web Consortium). La versión HTML 3.2 se publicó el 14 de Enero de 1997 y es la primera recomendación de HTML publicada por el W3C. Esta revisión incorpora los últimos avances de las páginas web desarrolladas hasta 1996, como applets de Java y texto que fluye alrededor de las imágenes.

HTML 4.0 se publicó el 24 de Abril de 1998 (siendo una versión corregida de la publicación original del 18 de Diciembre de 1997) y supone un gran salto desde las versiones anteriores. Entre sus novedades más destacadas se encuentran las hojas de estilos CSS, la posibilidad de incluir pequeños programas o scripts en las páginas web, mejora de la accesibilidad de las páginas diseñadas, tablas complejas y mejoras en los formularios.

La última especificación oficial de HTML se publicó el 24 de diciembre de 1999 y se denomina HTML 4.01. Se trata de una revisión y actualización de la versión HTML 4.0, por lo que no incluye novedades significativas.

Desde la publicación de HTML 4.01, la actividad de estandarización de HTML se detuvo y el W3C se centró en el desarrollo del estándar XHTML. Por este motivo, en el año 2004, las empresas Apple, Mozilla y Opera mostraron su preocupación por la falta de interés del W3C en HTML y decidieron organizarse en una nueva asociación llamada WHATWG (Web Hypertext Application Technology Working Group).

La actividad actual del WHATWG se centra en el futuro estándar HTML 5, cuyo primer borrador oficial se publicó el 22 de enero de 2008. Debido a la fuerza de las empresas que forman el grupo WHATWG y a la publicación de los borradores de HTML 5.0, en marzo de 2007 el W3C decidió retomar la actividad estandarizadora de HTML.

De forma paralela a su actividad con HTML, W3C ha continuado con la estandarización de XHTML, una versión avanzada de HTML y basada en XML. La primera versión de XHTML se denomina XHTML 1.0 y se publicó el 26 de Enero de 2000 (y posteriormente se revisó el 1 de Agosto de 2002).

XHTML 1.0 es una adaptación de HTML 4.01 al lenguaje XML, por lo que mantiene casi todas sus etiquetas y características, pero añade algunas restricciones y elementos propios de XML. La versión XHTML 1.1 ya ha sido publicada en forma de borrador y pretende modularizar XHTML. También ha sido publicado el borrador de XHTML 2.0, que supondrá un cambio muy importante respecto de las anteriores versiones de XHTM

Estructura de una pagina HTML

Que es una Etiqueta y cual es su sintaxis en HTML

Las etiquetas son marcas que se usan para señalar el inicio y el fin de un elemento.

Todas las etiquetas comparten el mismo formato: empiezan con el signo menor que "<" y terminan con el signo mayor que ">". Por lo general, hay dos tipos de etiquetas: la etiquetas de inicio, por ejemplo,

, y las etiquetas de cierre, por ejemplo,. La única diferencia entre la etiqueta de inicio y la de cierre es la barra oblicua "/". El contenido queda etiquetado al colocarlo entre una etiqueta de inicio y una etiqueta de cierre. HTML trata esencialmente de elementos. Aprender HTML consiste en aprender a usar diferentes etiquetas.

Etiquetas basicas para el manejo de HTML

Headings

Nos definen el tamaño de un título o cabecera.

Párrafos

Los párrafos se definen con la etiqueta

Comentarios

La etiqueta se utiliza para insertar un comentario dentro del código que estamos escribiendo. El mismo es ignorado por el navegador al momento de leerlo. Los comentarios nos sirven para explicar mejor el código y son de gran ayuda en el momento que necesitemos editarlo.

Trazar una línea

La etiqueta

nos permite trazar una línea horizontal como las que separan las distintas secciones de este tutorial.

La etiqueta

no tiene cierre.

Manejo de Tablas en HTML

Las tablas son un poderosa herramienta a la hora de mostrar y relacionar cierto tipo de información. Aún cuando muchos sitios son construidos (por su naturaleza) sin usar una simple tabla, existen algunas ocasiones en que el valor de las tablas se vuelve escencial.

En las próximas líneas intentaremos cubrir todas las características de las tablas para estar listos para utilizarlas cuando se necesite.

Simple tables

Una tabla HTML puede ser considerada, de manera simple, como un grupo de filas donde cada una de ellas contiene un grupo de celdas (y no alrevés). Las tablas, como toda estructura en los documentos HTML, son definidas usando elementos. Entonces, una tabla simple puede ser insertada en un documento HTML usando tres elementos: el elemento HTML table (estructura contenedora principal), el elemento HTML tr (contenedor de fila) y el elemento HTML td (celda). Veamos un ejemplo:

Codigo:

Vista:

Unificación de celdas

Para algunas tablas puedes necesitar unificar dos o más celdas en una sola que pasará a ocupar el lugar de aquellas afectadas. Estas unificaciones pueden ser llevadas a cabo con los atributos "rowspan" (para unificación vertical) y "colspan" (para unificación horizontal), ambos disponibles para celdas (tag HTML td y tag HTML th).

Tabla compuesta horizontal

Codigo:

Vista:

Tabla compuesta vertical

Codigo:

Vista:

El título de una tabla

El título de una tabla, definido mediante el elemento HTML caption, debería describir breve y precisamente el contenido y la naturaleza de la tabla y es habitualmente representado en algún lugar cercano a la tabla (su posición puede ser establecida usando hojas de estilo). Recuerda que el elemento HTML caption solo está permitido si va justo después del tag de apertura de la tabla.

Codigo:

Vista:

Mas tipos de tablas en esta pagina... www.htmlquick.com/es/tutorials/tables.html

Manejo de formularios en HTML

Los formularios son una característica del estándar HTML Que permite a los autores recolectar información provista por los visitantes. Estos formularios pueden resultar útiles para reunir información personal, de contacto, preferencias, opiniones, o de cualquier otro tipo que el autor necesite. En este tutorial exl¡ploraremos todas las herramientas disponibles para construir formularios en HTML.

Entrada textual

Existen tres tipos de entrada textual que pueden recolectar información como nombres, comentarios, opiniones, etc.

Entrada de línea

Este control recolecta información textual en una sola línea, lo que significa que el usuario no podrá utilizar la tecla "enter" para ir a la siguiente línea (en la mayoría de los formularios, la tecla "enter" presionada en uno de estos campos, envía el formulario que lo contiene).

Este control es insertado en documentos HTML usando el tag HTML input con el valor "text" en su atributo "type". El valor inicial, mostrado cuando la página se carga, puede ser definido usando el atributo "value".

Codigo:

Vista:

Elementos de entrada

Opciones

Los autores pueden también dejar que sus visitantes elijan opciones preestablecidas de una lista. Esto puede lograrse usando uno de los tres controles siguientes, que pueden construir diferentes tipos de listas de opciones.

Casillas de verificación

Una casilla de verificación es una opción simple que puede tomar uno de dos valores: "marcado" ó "no marcado" ("checked" ó "unchecked"). Las casillas de verificación pueden ser agrupadas visualmente formando listas de opciones, pero cada una de ellas es tratada individualmente.

Este control es insertado mediante el tag HTML input con el valor "checkbox" en su atributo "type". Inicialmente, la casilla aparece sin marcar a menos que lo especifique de otra forma usando el atributo booleano (verdadero o false) "checked". Recuerda, que para lograr un código correcto en XHTML necesitas definir al atributo booleano con sus nombres como valores (por ejemplo, checked="checked").

Codigo:

Vista:

Mas tipos de formularios en esta pagina...www.htmlquick.com/es/tutorials/forms.html

Solucion Actividad 1

CODIGO...

<html>
<CENTER>
<head>
<title> Horario de clase </title>
<body>
<CENTER>
<img src="logo.jpg">


<h2><EM><U><B>Horario de Clases</B></U></EM></h2>


<TABLE BORDER>
<TR>
    <TH></TH><TH>Aulas</TH> <TH>Hora</TH> <TH>Dia</TH>
</TR>

<TR><TH ROWSPAN=2> Sistemas Operativos </TH>
   <TD>  01-061  </TD> <TD> 19:30  -  21:00 </TD> <TD> Lunes </TD>
</TR>

<TR>
    <TD>  01-061  </TD> <TD> 19:00  -  21:00 </TD> <TD> Miercoles </TD>
</TR>

<TR>
    <TH>Programacion Web 1</TH> <TD> 01-054</TD> <TD> 15:00  -  16:30 </TD> <TD> Sabado </TD>
</TR>

<TR><TH ROWSPAN=2> Comunicaciones Y Redes </TH>
   <TD>  01-065  </TD> <TD> 18:00  -  19:30 </TD> <TD> Lunes </TD>
</TR>

<TR>
    <TD>  01-065  </TD> <TD> 18:00  -  19:30 </TD> <TD> Martes </TD>
</TR>

</TABLE>
</CENTER>
</body>
</html>

link de descarga

www.dropbox.com/s/22e7yx3kz3n6ie3/Horario.zip

Solucion Actividad 2

www.dropbox.com/s/hj7gf7dwpptjd0y/programacion%20web%201%20clase%201.zip