PROGRAMA DE INGENIERA DE SISTEMAS

GUA DIDCTICA de APRENDIZAJE

DATOS BSICOS

Asignatura: Programa: Semana acadmica: Ciclo: Nmero de crditos: Autor:

Programacin Web Ingeniera de Sistemas 1 Tcnico 2 Ing. William Ruiz Martnez

PROPSITO DE FORMACIN

Esta sesin del curso de Programacin Web tiene como propsito que el estudiante conozca la historia, evolucin, aplicacin, sintaxis bsica y los tipos de etiquetas que puede encontrar en el lenguaje de presentacin XHTML.

LECTURAS PREVIAS Y CONOCIMIENTOS NECESARIOS

Como lectura previa les recomiendo Introduccin al lenguaje HTML de las pginas 17 a la 20, del manual curso completo de HTML que les entrego como parte de la bibliografa. Del sitio web http://www.htmlya.com.ar/ -Conceptos 1 y 2 Del sitio Web http://www.desarrolloweb.com/manuales/21/- Captulos 2, 3 y 4 En cuanto a conocimientos previos lo nico que se requiere es el conocimiento bsico del manejo del PC, Internet y creacin de carpetas o archivos.

AYUDAS DIGITALES

A continuacin les describo la webgrafia y bibliografa recomendada para el desarrollo de la asignatura:

WEBGRAFIA http://www.htmlya.com.ar http://www.lawebdelprogramador.com/cursos/mostrar.php?id=40 http://www.desarrolloweb.com/html/ BIBLIOGRAFIA

Curso completo de HTML. Jorge Ferrer, Vctor Garca y Rodrigo Garca Manual de HTML.

NUCLEO DE APRENDIZAJE: Especificar el ncleo de la clase segn syllabus

Permitir que el estudiante conozca el origen, desarrollo y caractersticas principales del lenguaje XHTML y la sintaxis o estructura bsica de un documento XHTML. 1. Introduccin al lenguaje de etiquetas XHTML El XHTML es el lenguaje con el que se escriben las pginas web. Las pginas web pueden ser vistas por el usuario mediante un tipo de aplicacin llamada navegador. Podemos decir por lo tanto que el XHTML es el lenguaje usado por los navegadores para mostrar las pginas webs al usuario, siendo hoy en da la interface ms extendida en la red. Este lenguaje nos permite aglutinar textos, sonidos e imgenes y combinarlos a nuestro gusto. Adems, y es aqu donde reside su ventaja con respecto a libros o revistas, el XHTML nos permite la introduccin de referencias a otras pginas por medio de los enlaces hipertexto. El XHTML se cre en un principio con objetivos divulgativos. No se pens que la web llegara a ser un rea de ocio con carcter multimedia, de modo que, el XHTML se cre sin dar respuesta a todos los posibles usos que se le iba a dar y a todos los colectivos de gente que lo utilizaran en un futuro. Sin embargo, pese a esta deficiente planificacin, si que se han ido incorporando modificaciones con el tiempo, estos son los estndares del XHTML. Numerosos estndares se han presentado ya. El HTML 5.0 es el ltimo estndar a finales del ao 2010. Esta evolucin tan anrquica del XHTML ha supuesto toda una seria de inconvenientes y deficiencias que han debido ser superados con la introduccin de otras tecnologas accesorias capaces de organizar, optimizar y automatizar el funcionamiento de las webs. Otros de los problemas que han acompaado al XHTML es la diversidad de navegadores presentes en el mercado los cuales no son capaces de interpretar un mismo cdigo de una manera unificada. Esto obliga al webmster a, una vez creada su pgina, comprobar que esta puede ser leda satisfactoriamente por todos los navegadores, o al menos, los ms utilizados.

Adems del navegador necesario para ver los resultados de nuestro trabajo, necesitamos evidentemente otra herramienta capaz de crear la pgina en si. Un archivo XHTML (una pgina) no es ms que un texto. Es por ello que para realizar la presentacin de un documento en XHTML necesitamos un editor de textos. Adems ya hemos hablado que el XHTML es un lenguaje que sirve para escribir hipertexto, es decir, documentos de texto presentado de forma estructurada, con enlaces (links) que conducen a otros documentos o a otras fuentes de informacin (por ejemplo bases de datos) que pueden estar en tu propia mquina o en mquinas remotas de la red. Todo ello se puede presentar acompaado de grficos estticos o animados, sonidos y todo aquello que seamos capaces de imaginar. NOTA: Hay que tener en cuenta que el XHTML como tal no es un lenguaje de programacin, sino un lenguaje de presentacin de informacin.

2. Estructura bsica de un documento XHTML <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><!--Indica que versin de XHTML o
HTML se utiliza en el documento, para que los navegadores puedan aplicar la gramtica y sintaxis correspondiente al documento-->

<html xmlns="http://www.w3.org/1999/xhtml"> <! -- Comienzo del documento XHTML-- > <HEAD><!-- se delimita la cabecera del documento que suele contener informacin sobre el documento como ttulo, idioma, palabras clave, autor, etc. La informacin que se especifique en la cabecera no es mostrada por el navegador al usuario con la nica excepcin de la etiqueta TITLE--> <TITLE> CUN</TITLE> Me indica el titulo o nombre de la pagina </HEAD> Me indica el final de lo que va a contener la cabecera o parte
superior del documento

<BODY> Me indica el comienzo de lo que va a contener el cuerpo o parte principal del

documento

Este es mi primera pgina WEB. Aqu es donde va el texto que contiene el documento. </BODY> Me indica el final de lo que va a contener el cuerpo o parte principal del
documento.

</HTML> Me indica el final de un documento HTML 3. Estructura bsica de un documento HTML 5.0 <! DOCTYPE HTML ><!--Indica que versin de XHTML o HTML se utiliza en el
documento, para que los navegadores puedan aplicar la gramtica y sintaxis correspondiente al documento-->

<HTML LANG=ES> <! -- Etiqueta HTML la cual tiene el atributo LANG para el idioma del sitio.-- > <HEAD><!-- se delimita la cabecera del documento que suele contener informacin sobre el documento como ttulo, idioma, palabras clave, autor, etc. La informacin que

se especifique en la cabecera no es mostrada por el navegador al usuario con la nica excepcin de la etiqueta TITLE-->

<TITLE> CUN</TITLE> Me indica el titulo o nombre de la pagina <META CHARSET="UTF-8" /><!--donde le decimos al navegador que tipo de codificado
es el documento html, de preferencia usemos el UTF-8 que acepta nuestros acentos y con ms compatibilidad.-->

</HEAD> Me indica el final de lo que va a contener la cabecera o parte superior

del documento

<BODY> Me indica el comienzo de lo que va a contener el cuerpo o parte principal del documento <HEADER><!--La etiqueta HEADER es la cabecera donde va el nombre del sitio, el
logotipo y descripcin de la pgina web-->

<h1>Mi sitio web</h1> <p>Mi sitio web creado en html5</p> </HEADER> <SECTION><!--La etiqueta SECTION maneja secciones de la pgina WEB y el contenido se maneja en las etiquetas llamadas ARTICLE para artculos o post, esto por cuestiones de SEO que es muy recomendable.--> <ARTICLE> <h2>Titulo de contenido<h2> <p> Contenido (ademas de imagenes, citas, videos etc.) </p> </ARTICLE> </SECTION> <ASIDE><!--Otra etiqueta interesante es la etiqueta ASIDE, lo que viene siendo nuestro SIDEBAR o barra lateral y es muy facil de implementar con H3 de titulo y P de contenido dentro de ella.--> <h3>Titulo de contenido</h3> <p>contenido</p> </ASIDE> <FOOTER><!--Que es equivalente a un pie de pagina--> Creado por m el 2011 </FOOTER> </BODY> Me indica el final de lo que va a contener el cuerpo o parte principal del
documento.

</HTML> Me indica el final de un documento HTML

4. Introduccin a las etiquetas bsicas El HTML, en realidad no es un lenguaje de programacin, sino como su nombre indica es un lenguaje de maquillado ya que nosotros lo nico que hacemos es maquillar una serie de textos e imgenes para que el navegador nos d la presentacin deseada en conjunto. Las directivas en HTML son aquellas ordenes que se hayan entre los smbolos <...> y que son de 2 clases: abiertas y cerradas.

3.1 Directivas Abiertas Son aquellas directivas que no necesitan ser cerradas para que su accin sea comprendida por el navegador, Ejs: <BR>, Nos indica un salto de lnea <HR>, Nos indica la creacin de una lnea horizontal 3.2 Directivas Cerradas Son aquellas directivas que para ser comprendidas por el navegador, deben indicar en dnde comienzan y en dnde terminan. Ejs: <P>Nos indica el comienzo de un prrafo En donde no tengo en cuenta los salto de lnea</P>

CASO DOCUMENTADO

En esta primera gua acadmica podemos decir que todos los documentos que circulan por la World Wide Web, utilizan como esquema bsico de funcionamiento el lenguaje de presentacin XHTML.

PRCTICA EN CLASE
En el desarrollo de la asignatura vamos a tratar de cumplir con una metodologa terico- prctica de la siguiente manera: Exposicin del tema de clase Realizacin de ejercicios de aplicacin sobre el tema en forma individual bajo la direccin del docente. Identificacin de fallas o falencias presentadas por los estudiantes. Ejercicio o ejercicios de refuerzo sobre dichos temas en particular.

CRITERIOS DE EVALUACIN
Los criterios de evaluacin que van a ser considerados en el desarrollo de la asignatura, van a ser los siguientes: Asistencia a la asignatura. Trabajo desarrollado en clase. Puntualidad a la hora de presentacin de trabajos extraclase.

Cumplimiento en la lectura y aplicacin de los temas relacionados como trabajo autnomo.

CONSULTAS Y LECTURAS POSTERIORES

Para la gua de clase Nro. 2 se recomienda haber ledo y puesto en prctica las siguientes lecturas: Introduccin al lenguaje HTML pginas 25 a la 30. http://www.desarrolloweb.com/manuales/21/ o Captulos 5,6 y 7. http://www.htmlya.com.ar/temarios/descripcion.php?cod=69&punto=4 http://www.htmlya.com.ar/temarios/descripcion.php?cod=69&punto=5 Manual HTML o Pginas de la 6 a la 9.