(html) 1.- formatos de texto.pdf

Download (HTML) 1.- Formatos de texto.pdf

Post on 15-Jan-2016

6 views

Category:

Documents

0 download

Embed Size (px)

TRANSCRIPT

  • Introduccin histrica

    Tim Berners Lee desarrolla HTMLa principios de los aos 90.

    En 1995 se publica el primer estndar oficial llamado HTML 2.0

    En 1997 se publica la versin HTML 3.2 por la organizacin W3C (World Wide Web Consortium), que y es el organismo oficial encargado de publicar los estndares.

    En 1998 aparece la versin HTML 4.0 que incluye soporte para lenguajes script, hojas de estilo css, facilidades de impresin etc

    En 1999 aparece HTML 4.01 la ltima especificacin oficial hasta el moento.

    En 2000 el W3C publica XHTML 1.0 que es una reformulacin de HTML 4.0 basada en XML.

    XHTML 1.0 est aceptado y es ampliamente utilizado.

    En 2003 aparecen los famosos XFORMS, los formularios de XHTML, que mejoran considerablemente a los anteriores gracias a que separan el contenido de la presentacin.

    En 2004 Apple, Mozilla y Opera crean un grupo de trabajo llamado WHATWG para seguir desarrollando HTML

    En 20008 W3C y WHATWG, unidos, publican el primer borrador de HTML5

    Resumen:

    HTML 4.01 y XHTML 1.0 son las especificaciones ms utilizadas.

    HTML 5 se va incorporando progresivamente.

    Introduccin a HTML

    Cuando visitamos una pgina web vemos textos, imgenes, colores de fondo, en algunos casos elementos que se desplazan por la pantalla, en fin, todo el conjunto de elementos que hacen de dicha pgina un espacio multimedia e interactivo. Aunque podramos pensar que todos esos elementos estn incluidos en la pgina, no es as. Realmente, el nico de todos ellos que pertenece a la propia pgina es el texto. Y, entonces, por qu se ve lo que aparece en la pgina? La respuesta es que una pgina web no es ms que un documento de texto acompaado de una coleccin de etiquetas que sirven para que el navegador:

    interprete de qu forma tiene que presentar el texto.

    sepa de dnde tiene que obtener las imgenes y sonidos y cmo mostrarlos.

    distribuya todos los contenidos de una forma determinada dentro de la pantalla.

    El lenguaje que contiene dichas etiquetas se denomina HTML. Las siglas HTML se corresponden con la definicin "Lenguaje para marcado de hipertexto" (Hyper-text Markup Language). Este lenguaje se utiliza para estructurar documentos de texto que puedan ser interpretados por navegadores y distribuidos a travs de Internet.

    Los documentos escritos en HTML estn formados por texto plano. De esta manera, un documento HTML puede ser visualizado con un editor de textos convencional. Nosotros utilizaremos el editor Notepad++.

  • Formato de las etiquetas HTML

    Las etiquetas HTML se escriben encerradas entre ngulos (< y >). Normalmente se utilizan dos etiquetas: una de inicio y otra de fin. La nica diferencia entre ambas es que la de cierre lleva una barra inclinada (/) antes del cdigo. De esta manera, el texto que aparezca entre ambas etiquetas presentar el efecto que dichas etiquetas indiquen. Existe una etiqueta para cada tipo de efecto. Algunos ejemplos de efectos son los siguientes:

    Este texto aparecer en negrita en la pantalla.

    Este texto aparecer en cursiva en la pantalla.

    Este texto aparecer en con letra Arial en la pantalla.

    En los siguientes apartados iremos estudiando las distintas etiquetas. Se incluye un resumen de las ms importantes en el enlace Gua de referencia rpida de HTML.

    Etiquetas dentro de etiquetas

    Se pueden abrir etiquetas dentro de otras etiquetas. Sin embargo, hay que tener en cuenta que se deben cerrar en orden inverso al orden de apertura. Para facilitar esta tarea, se suelen dejar sangras cada vez que se inicia una nueva apertura. Por ejemplo:

    Este nivel est afectado por la etiqueta 1

    Este nivel est afectado por la etiqueta 1 y 2

    Este nivel est afectado por la etiqueta 1, 2 y 3

    Este nivel est afectado por la etiqueta 1 y 2

    Este nivel est afectado por la etiqueta 1

    Atributos de las etiquetas

    La mayora de las etiquetas admiten atributos. Los atributos ofrecen distintos efectos para las etiquetas sobre las que se aplican. El formato general de las etiquetas con atributos es el siguiente:

    Texto afectado por la etiqueta1

    Cada etiqueta tiene sus propios atributos disponibles, que se pueden consultar en la Gua de referencia rpida de HTML. Los valores de los atributos pueden tomar unos valores determinados (numricos, texto, valores hexadecimales,...), pero siempre irn entre comillas.

  • Organizacin de un sitio web

    Un sitio web no slo est comprendido por una nica pgina, sino que suele estar compuesto por varias pginas relacionadas entre s, adems de contar con otros contenidos (imgenes, vdeos, sonidos,...). Para facilitar la organizacin de dichos contenidos, se suele emplear una estructura de carpetas como la siguiente:

    Todas las prcticas y trabajos del curso debern ajustarse al esquema propuesto.

  • Etiquetas bsicas

    En este punto sabemos que una pgina web est formada exclusivamente por texto: parte de ese texto aparecer en pantalla (son los contenidos que se quieren mostrar) y el resto estar formado por etiquetas que no aparecern en pantalla, pero que tendrn algn efecto sobre la pgina(pondrn parte del texto en negrita, estructurarn los contenidos en forma de tablas o listas, cambiarn el tipo de letra o el tamao del texto, etc.).

    Las etiquetas, as como sus atributos, se suelen indicar en minscula.

    Es importante saber que las pginas web estn estructuradas: es decir, que deben seguir una serie de reglas para que sean interpretadas correctamente por los navegadores web. A continuacin se explica dicha estructura genrica.

    Esquema general de una pgina web

    El esquema general de una pgina web tiene el siguiente aspecto:

    DECLARACIN DE TIPO DE DOCUMENTO

    Ttulo de la pgina

    Elementos opcionales de la cabecera

    Contenido del cuerpo

    Toda la pgina web debe estar almacenada entre las etiquetas , con la excepcin de la declaracin de tipo de documento. Como puede verse en la figura, hay tres partes diferenciadas en toda pgina web:

    Declaracin de tipo de documento. Es una lnea de texto que especifica el tipo de documento que hay en el archivo. Se explica en el siguiente apartado. Es la nica parte de la pgina web que no est almacenada dentro de las etiquetas .

    Cabecera. Est delimitada por las etiquetas . En la cabecera se incluye aquella informacin de la pgina que no va a aparecer en pantalla (salvo el ttulo de la pgina, que aparece en la barra superior del navegador web). Sirve para indicar el nombre del autor, palabras clave, programas script que se ejecutarn, etc.

    Cuerpo. Est delimitado por las etiquetas . En el cuerpo de la pgina se incluye aquella informacin que se va a representar en pantalla. En el cuerpo es donde se almacenan los contenidos de la pgina: texto, imgenes, tablas, listas,...

    La declaracin del tipo de documento

    El W3C es un organismo que se encarga de fijar las normas que deben seguir los documentos escritos en HTML. Segn este organismo, todo documento HTML deber contener al principio del mismo una lnea que indique qu tipo de documento es. Es lo que se llama la declaracin del tipo de documento.

  • Al indicar la DTD (Document Type Definition) al principio del documento le estamos diciendo al navegador cmo interpretar adecuadamente el cdigo. Los tipos de documento vlidos para HTML y sus declaraciones correspondientes se muestran a continuacin:

    Documento HTML estricto. Los documentos de este tipo se ajustan a la especificacin ms rgida del W3C. Significa que no se pueden usar determinadas etiquetas y atributos HTML que estn en fase de quedarse obsoletos. HTM 4.01 recomienda separar por completo el contenido del formato. Si cumplimos escrupulosamente con esta recomendacin, almacenando toda la informacin sobre el formato en una hoja de estilos CSS, entonces podemos utilizar la declaracin estricta. Estos documentos debern incorporar el siguiente cdigo al principio:

    Documento HTML transicional. Los documentos de este tipo se ajustan a la especificacin ms permisiva del W3C. Significa que se pueden usar determinadas etiquetas y atributos HTML que estn en fase de quedarse obsoletos. Si queremos combinar contenido e informacin de formato en nuestro documento HTML, entonces debemos utilizar la declaracin de transicin. Estos documentos debern incorporar el siguiente cdigo al principio:

    Documento HTML con marcos. Los documentos de este tipo son los que llevan incorporados marcos (etiquetas y ). Estos documentos debern incorporar el siguiente cdigo al principio:

    En HTML 5. La declaracin es ms sencilla:

    Copia el cdigo de abajo en un archivo de texto (con el bloc de notas por ejemplo) con el nombre Ejemplo_1.html y luego observa el resultado en el navegador.

    Mi primer pgina

    Hola Mundo

    La cabecera

    La cabecera almacena informacin sobre el ttulo de la pgina y otros datos importantes, entre ellos la codificacin de caracteres que emplea la pgina.

    Codificacin de caracteres

    Todo documento deber incorporar informacin sobre el tipo de codificacin de caracteres que almacena. La codificacin de caracteres depende del editor utilizado (en el Notepad++ se puede elegir en el men Codificacin). La eleccin de una codificacin de caracteres u otra tendr como

  • consecuencia que se puedan escribir los caracteres espaoles (, , , ,...) directamente en el contenido de la pgina o que se deban emplear caracteres especiales.

    La codificacin de caracteres se debe elegir en el editor de pginas web que se utilice (en nuestro caso, Notepad++) y reflejarlo en el cdigo introduciendo una etiqueta en la cabecera de la pgina, de la siguiente manera:

    El parmetro codificacion deber ser igua