LENGUAJE DE PROGRAMACION HTML

Friday, November 17, 2006

LENGUAJE DE PROGRAMACION PAGINA WEB HTML

QUÉ ES HTML
HTML (HyperText Markup Language) es un lenguaje muy sencillo que permite describir hipertexto, es decir, texto presentado de forma estructurada y agradable, con enlaces (hyperlinks) que conducen a otros documentos o fuentes de información relacionadas, y con inserciones multimedia (gráficos, sonido...) La descripción se basa en especificar en el texto la estructura lógica del contenido (títulos, párrafos de texto normal, enumeraciones, definiciones, citas, etc) así como los diferentes efectos que se quieren dar (especificar los lugares del documento donde se debe poner cursiva, negrita, o un gráfico determinado) y dejar que luego la presentación final de dicho hipertexto se realice por un programa especializadESTRUCTURA BÁSICA DE UN DOCUMENTO HTML
Usos de las etiqueta de
Un documento HTML comienza con la etiqueta , y termina con . Dentro del documento (entre las etiquetas de principio y fin de html), hay dos zonas bien diferenciadas: el encabezamiento, delimitado por y , que sirve para definir diversos valores válidos en todo el documento; y el cuerpo, delimitado por y , donde reside la información del documento.
La única utilidad del encabezamiento en la que nos detendremos es la directiva
en minúsculas. Obsérverse que el título que encabeza este texto se ha escrito con mayúsculas, para distinguirlo del título global del documento.
El cuerpo de un documento HTML contiene el texto que, con la presentación y los efectos que se decidan, se presentará ante el hiperlector. Dentro del cuerpo son aplicables todos los efectos que se van a mencionar en el resto de esta guía. Dichos efectos se especifican exclusivamente a través de directivas. Esto quiere decir que los espacios, tabulaciones y retornos de carro que se introduzcan en el fichero fuente no tienen ningún efecto a la hora de la presentación final del documento. Por ejemplo, escribiendo: Estas palabrasforman una frase.
producimos exactamente lo mismo que con: Estas palabras forman una frase.
A la hora de la verdad lo que se ve es:
Estas palabras forman una frase.
En resumen, la estructura básica de un documento HTML queda de la forma siguiente: Texto del documento, menciones a gráficos, enlaces, etc.

ESTILOS Y EFECTOS BÁSICOS
Como ya hemos dicho, la estructura lógica del texto y los diferentes efectos que se le apliquen se especifican mediante diEstructura básica de un documento en HTML
El lenguaje html trabaja con etiquetas (tags) que tienen diferentes usos. Por ejemplo sirve para colocar el nombre de la página en el marco superior del navegador. Las mayoría de las etiquetas necesitan cerrarse y modifican la información contenida dentro de ellas. Algunas como
no necesitan cerrarse. Después se explicará mejor el significado de éstas y otras más.
Todos los documentos en html deben tener la siguiente estructura:
Aquí va todo el contenido del programa.
Este formato debe seguirse siempre como una regla. El uso de las demás etiquetas y el contenido del programa irá dentro de la etiqueta . El título va a ser el nombre que le quieras dar a tu página.
*** Ahora comienza lo interesante, vamos a empezar a construir nuestra página de Internet. Entra al editor de textos, carga tu archivo prueba.htm (que por ahora debe estar vacío) y teclea lo siguiente: En esta página explicaremos brevemente los inicios de la red de redes.
*****************
Lo que estamos haciendo aquí es generando el esqueleto de nuestra página. Estas son las etiquetas básicas para cualquier diseño. El título de esta página-ejemplo es Historia de Internet y aparece en el marco superior del navegador. Como se acaba de mencionar, dentro de las etiquetas desarrollaremos todo nuestro contenido.
Presiona el enlace que aparece subrayado para ver como debe lucir nuestra página hasta ahora. Ver página web
Pulsa Guardar en el editor de textos para grabar en prueba.htm lo que acabamos de codificar. Recuerda que ya has aprendido cómo visualizarlo.
Volver al Contenido
Texto
Ya sabemos cómo es la estructura de un documento en html. Es el momento de empezar a manipular los elementos de nuestra página. El elemento fundamental en Internet es el texto. Aunque el auge de los últimos años se ha debido principalmente al contenido multimedia, (gráficos, sonido y video) el texto sigue siendo la base de todo documento en la red.
A diferencia de los procesadores de texto comerciales (Word, WordPerfect, etc.), la manipulación de texto en html está un tanto limitada y es necesario utilizar ciertas etiquetas para modificar el texto a nuestro gusto. Enseguida se muestran algunas de las etiquetas más populares en el manejo de texto.
Posiciona el texto seleccionado en el centro de la página. También puede aplicarse a gráficos.
Se utiliza para resaltar encabezados. La x son números que van del 1 al 6, siendo el 1 el encabezado más grande y resaltado, el 2 un poco menos y así sucesivamente.Ejem:

Encabezado



Encabezado



Encabezado



Encabezado


Sirve para cambiar el tamaño de las letras. La x es un número que indica el tamaño de la letra y va del 1 al 7. El número predeterminado es el 3.
Texto en Negritas
Texto en Itálica
Texto subrayado


Dirección




Se utiliza como línea separadora. Tiene algunos atributos que la modifican. WIDTH indica la longitud, SIZE indica la altura, ALIGN la colocación de la línea y NOSHADE que no tenga relieve y además le añade un color gris más fuerte.Ejem:











*** Vamos a utilizar en nuestra página algunas de éstas etiquetas para modificar texto. Carga prueba.htm y teclea lo siguiente:

En esta página explicaremos brevemente los inicios de la red de redes.



Introducción

El mundo de las telecomunicaciones ha tenido un crecimiento acelerado en los últimos años, en el que Internet ha sido pieza clave. Hace unas décadas atrás, cuando el Departamento de Defensa de los Estados Unidos desarrollaba una red de comunicaciones que fuera capaz de soportar un ataque externo durante la guerra fría, nadie se imaginó que después de transferir el control de esa red llamada ARPANET a los investigadores universitarios, ésta crecería exponencialmente involucrando significativamente a toda la sociedad.



Documento creado en Febrero del 2000
*****************
Presiona el enlace para ver nuestra página después de agregar más información y de utilizar algunos de los modificadores de texto explicados en esta sección. Ver página web
Volver al Contenido

Colo Con el fin de hacer un documento más agradable y atractivo a la vista, es necesario en algunas ocasiones resaltarlo con un color diferente. Esto se puede aplicar al fondo, a un enlace, al texto, a una palabra o a una letra.
Para poder representar un color en html, se deben utilizar 6 números hexadecimales. Ejem:ROJO FF0000VERDE 00FF00
rectivaso (como Mosaic, o Netscape).

Que son las etiquetas
Como se indicó más atrás, las etiquetas surten efecto sobre los elementos que rodean. Además las etiqueta se anidan, es decir un juego de etiquetas a su vez frecuente esta afectad por otras etiquetas que rodean a dicho grupo. Para entender esto, modifiquemos nuestro documento de manera que quede de la siguiente forma:


Mi Primer Documento Web



Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo



Visualicemos el documento y posteriormente hagamos el siguiente cambio:


Mi Primer Documento Web



Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo



Con esto deberíamos ver el parrafo rojo, pues la etiquetas y están rodenado a las etiquetas

y

, que a su vez rodean un trozo de texto.
Movamos la primera etiqueta de manera que el domumento quede asi:



Mi Primer Documento Web



Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo Este es un párrafo




Ahora la etiqueta y rodea no sólo a las etiquetas

y

, si no que también a las etiquetas

y

, con lo cual todo el texto se ve de color rojo ahora.
Hay que hacer notar además que el código HTML se puede escribir en una sola línea siendo el efecto el mismo que si se escribiese en la manera que lo hemos hecho hasta el momento, pero se acostumbra escribir en diferentes líneas y tabulándolo para facilitar su entendimiento y su posterior edición.
Se puede ver el código de cualquier documento en la Web, presionando el botón derecho del Mouse y seleccionando la opción Ver código fuente.
USO DE LAS ETIQUETA SIGUENTE
Utiliza la etiqueta
 para generar texto con una fuente de anchura fija. Esta etiqueta también hace significativos los espacios, las líneas en blanco y las tabulaciones. Resulta útil en muchas ocasiones, por ejemplo, para listar comandos o escribir tablaturas. El siguiente código:

La etiqueta
 puede ser empleada con el atributo opcional WIDTH, que especifica el número máximo de caracteres por línea. WIDTH también indica al navegador que escoga una fuente apropiada para el texto

void InitCRC(void){  int I, J;  UDWORD C;  for (I=0;I<256;i++) c="I,J=" c="(C">>1)^0xEDB88320L : (C>>1);    CRCTab[I]=C;

 
Permite que el texto que se encuentre dentro de ella se visualice tal como se creó en la página origen, respetando espaciado, salto de línea, salto de párrafo, tabulación, etc.

Realiza un salto de línea. Esta etiqueta no necesita cerrarse.

Realiza un salto de párrafo. Tampoco necesita cerrarse.
el hace el texto en negrilla.
I really tiene gusto de esta idea.
produce
Realmente tengo gusto de esta idea.
el pone el texto en letra itálica.
La ley el por sí mismo no requiere esa acción.
produce


Para que es usado (BLOCKQUOTE)
Usa la etiqueta

para incluir citas en un bloque separado. La mayoría de navegadores cambian los márgenes de la cita para separarla del texto que la rodea. En el siguiente ejemplo:

La naturaleza sigue llena de misterios.

La ciencia es incapaz de resolver los últimos misteriosde la naturaleza porque, en el último análisis, nosotrosmismos somos parte de la naturaleza y, por eso, tambiénparte del misterio que tratamos de resolver.

- Max Planck, 1858-1947




La etiqueta
fuerza un salto de línea sin espacio entre líneas y resulta útil en direcciones postales.
Por ejemplo:
Radio Nacional de España, S.A.
Apartado de Correos 156.200
28080 - Madrid






¿Cuales son los principales editores de texto en la cuales pueden programar en html?


WebScope es el editor de páginas Web que estabas buscando, pruébalo ahora durante 60 días sin compromiso y registrase luego por un precio muy especial, muy por debajo del de la competencia por un programa mucho más potente.
WebScope es fácil de usar y versátil, con soporte de HTML4 y CSS2, coloreado de sintaxis personalizable, plantillas de código, autocompletado, autocorrección, librerías y árboles de códigos, asistentes de applets, imágenes, formularios... Explorador de archivos integrado con previsualización de imágenes, editor de códigos, gestor de proyectos, plantillas de documentos, comodines, deshacer ilimitado, reemplazado de texto automático en múltiples archivos, corrector ortográfico compatible con MS Word®, filtrado automático de caracteres ISO y mucho más... ¡Todo ello con línea directa con el programador!




Arachnophilia 5.1
Un sencillo programa, escrito en Java, que permite editar toda clase de archivos relacionados con Internet (HTML, Java, Perl, etc...) con coloración sintáctica del código y ayudas y atajos para las etiquetas más comunes. Lo mejor es su hermosa forma de pago



HotDog Professional 6
Un editor muy completo, con toda clase de ayudas para la inserción de etiquetas HTML. Detecta la etiqueta que estás editando y te sugiere posibles parámetros, tiene una guia de referencia de HTML 4.0 incorporada y muchas otras características que lo hacen un producto más que apetecible para el buen conocedor del lenguaje HTML.
Macromedia Homesite 5

Macromedia Homesite 5
Posiblemente la mejor elección dentro de esta clase. Dispone de un comodísimo sistema de apertura rápida de ficheros sin necesidad de abrir diálogos. Te ayuda por medio de listas que se despliegan al teclear a escribir el código. Tiene incorporado un visor (necesitas tener instalado el Explorer para usarlo) para ver las páginas sin llamar a un navegador externo.

Para que sirven las siguente atributo