4.-PROGRAMACIÓN EN HTML.
HTML( Hipertest Markut Language)
Html es un lenguaje con el que se escriben las páginas Web, con el texto se
incluyen identificaciones o etiquetas que ayudan al navegador de la Web a decidir
como visualizar los diversos elementos, texto, imágenes, hipervínculos… la mayoría de
las etiquetas trabajan por parejas <xxxxxx>elementos </xxxxxx>, lo quye se escribe
dentro de las etiquetas <> se puede escribir en mayúsculas o minúsculas o ambas, lo que
se escribe entre ellos resulta afectado por las etiquetas correspondientes, no obstante hay
etiquetas que no tienen etiqueta de cierre, en general son etiquetas que no cambian los
atributos de un elemento, sino que insertan un elemento. Al visualizar el programa
HTML en un navegador Web las etiquetas actúan como instrucciones que indican al
navegador como ha de presentar los diversos elementos en la página Web. Un atributo
es un parámetro incluido en el interior de una etiqueta que modifica o personaliza el
comportamiento de la etiqueta, en general el valor de los atributos se escribirá entre
comillas <p align=”center”>.
PROGRAMAS HTML.
La versión HTML 2.0 cumplía perfectamente su función pero muchos usuarios
deseaban un mayor control sobre sus documentos, entonces Netscape e Internet
Explorer empezaron a añadir cosas cada uno por su cuenta y no coincidían unas con
otras, por este motivo se lanzo una nueva norma, HTML3.0, pero ocurrió que esta
norma era demasiado extensa, los navegadores solo utilizaban una pequeña parte de ella
por lo que fue abandonada, por ese motivo se creó la HTML 3.2 que tenia el nombre de
Wilbur, fue aprovada en Enero de 1997 por acuerdo de los principales vendedores de
software que formaron el comité W36, entonces en esta normase introdujeron los tables,
applets, texto que bordea a imágenes etc; en Julio de ese mismo año se presentó el
borrador de HTML 4.0 (Cougar) que introdujo las frames, scripts, hojas de estilo,
accesibilidad para distintos medio, unicote, etc; la última norma vigente actualmente es
la 4.01 que fue aprobada en septiembre de 2001.
Como la anterior no era suficiente surgió el HTML dinámico o DHTML en este
caso las etiquetas se convierten en objetos programables, lo que permite manipular con
lenguajes scripts (java script o visual basic script) el documento.
HTML ha evolucionado de una manera un tanto anárquica lo que ha provocado
una serie de deficiencias que ha habido que superar introduciendo otras tecnologías
accesorias para organizar, optimizar y automatizar el funcionamiento de las páginas
Web, así por ejemplo CSS, Java script, Visual Basic script,…, y otro problema es la
diversidad de navegadores existentes, lo que ha provocado que no interpreten un mismo
código de la misma forma.
ESTRUCTURA BÁSICA DE UN DOCUMENTO O PROGRAMA HTML.
Todo el documento HTML estará entre la etiqueta <Html> y </Html>, los
espacios en blanco no se tienen en cuenta, ni los retornos de carro tampoco, es decir que
podemos escribir el programa en una línea o en varias, con o sin espacios, además todo
documento tendrá dos zonas principales el encabezado que estará entre <Head> y
</Head> y el cuerpo que estará entre <Body> y </Body>, en el encabezamiento se
escribirá información sobre el programa y una de las partes importantes será el título
que estará entre <Title> y </Title>, lo que se encuentra entre esas dos etiquetas será lo
que vean los demás cuando añadamos nuestra página Web a un servidor Web, en el
cuerpo escribiremos todo lo que queramos que aparezca en la pantalla principal del
navegador.
ETIQUETAS PARA FORMATEAR TEXTO.
Establecimiento de párrafos, se hace con la etiqueta <p> en principio según el
estándar la etiqueta <p> no tiene cierre, pero Internet Explorer si admite </p>, pero
crea un nuevo párrafo.
Alineamiento del texto en todo un párrafo: Se va a utilizar el atributo align
dentro de la etiqueta <p>, por ejemplo <p align=”center”>.
Los valores del atributo align pueden ser: Left (izquierda), right (derecha), center
(centro), justify (justificado), este último no funciona en Internet Explorer.
Para asignar un alineamiento a varios párrafos se haría lo siguiente:
<div> align=”valor”>
<p> párrafo 1
<p> párrafo 2
</div>
Encabezamientos o títulos: son párrafos que se formatean como títulos,
tenemos hasta seis títulos que establecerán desde <H1> hasta <H6>, ejemplo:
<H1> título </H1>
<H2> título </H2>
……
…
<H5> título </H5>
<H6> título </H6>
Líneas horizontales: Se establecen con la etiqueta <HR>, se dibuja una línea
horizontal que ocupa toda la pantalla, no tiene etiqueta de cierre, pero se pueden dibujar
líneas que no ocupan toda la pantalla, para reducir el ancho <HR width=”60%”>, la
línea será del 60% del ancho de la pantalla, también admite el atributo align, <HR
width=”60%” align=”right”>. También podemos utilizar el ancho de la siguiente
manera <HR Width=”400”>, el número indica el número de píxeles que ocupa la línea.
Para establecer el grosos de la línea se hará con el atributo Size (en píxeles) <HR
size=”20”>. El parámetro noshade es para que en vez de aparecer la línea gravada
aparezca plana completamente. Los atributos anteriores se pueden combinar todos, por
ejemplo:
<Hr noshade size=”20” width=”75%” align=”right”>.
Para realizar un retorno de carro sin que se inserte ninguna línea en blanco se
utilizara la etique <BR>
Formato de Texto:
<b>TEXTO </b> Negrita.
<strong> TEXTO </strong> Negrita.
<i> TEXTO </i> Cursiva.
<Em> TEXTO </em> Cursiva.
<center> TEXTO </center> Centrado en un línea independiente.
<u> TEXTO </u> subrayado (no se recomienda).
<s> TEXTO </s> Tachado.
<sub> TEXTO </sub> superíndice.
<sup> TEXTO </sup> Subíndice.
<big> TEXTO </big> Texto mas grande que el normal.
Texto normal Texto normal.
<small> TEXTO </small> texto menor que el normal.
<TT> TEXTO </tt> letra de paso fijo.
<address> TEXTO </address> cursiva u negrita.
<blink> TEXTO </blink> texto parpadéate (no funciona en Internet Explorer).
<blockquote> TEXTO </blockquote> Texto con resalte.
<!--Texto--> comentario.
<pre> TEXTO
Tamaño del texto: se establece con:
<fontsize=”tamaño”> el tamaño va de uno a siete, siendo el uno el más pequeño
con salto de línea </Pre> Mantiene el formato que tenga el texto.
preformateado
y el siete el más grande, ejemplo:
<fontsize=”1”>Tamaño 1 </Font>
<Fontsize=”2”> Tamaño 2 </Font>
.......
...
<Fontsize=6> Tamaño </Font>
<Fontsize= 7> Tamaño </Font>.
El tamaño normal o tamaño base el tres, se puede cambiar el tamaño base de una
cadena de caracteres con relación al tamaño base de la siguiente manera: <Fontsize
size=”+-1,2,3…”> Texto </Font> resta o suma al valor del tamaño base para
agrandar o menguar el tamaño del texto.
Para cambiar el tamaño base de toda la página se escribe debajo de <body>
<basefont=”tamaño”>.
Tipos de fuentes: Cada navegador utiliza un tipo de fuente por defecto. Además
si el usuario cambia el tipo de fuente el navegador cambiará la fuente de la página, no
obstante el autor de una página Web puede forzar que el texto se presente en un
determinado tipo de fuente. Sólo se verá el tipo forzado si el usuario tiene instalado
dicho tipo de fuente, de lo contrario se verá el tipo por defecto, para forzar un tipo de
fuente se hace de la siguiente manera:
<Font face=”tipo1,tipo2,tipo3,…,…”> por ejemplo:
<Font face=”arial,president,licilla,times new roman »>
Nota: este atributo no está recogido en el estándar HTML pero si lo soportan
Internet Explorer y Netscape.
Color del texto: Se establece con el atributo color dentro de la etiqueta font,
cada color se define mediante un número hexadecimal de seis cifras XX XX XX ,
correspondiéndose los posprimeros valores al color rojo, la pareja del medio al verde y
la de la derecha al azul, XX puede variar entre 00(h (o) y FF(h (255), por ejemplo:
<Font color=”#FFFFFF”> Blanco.
<Font color=”#000000”> Negro.
<Font color=”#FF0000”> Rojo claro.
<Font color=”#EE0000”> Rojo oscuro.
<Font color=”#00FF00”> Verde claro.
<Font color=”#00AA00”> Verde oscuro.
<Font color=”#FFFF00”> Amarillo.
A parte de escribir los números hay una paleta de colores preestablecida, es
escribieran: <Font color=”valor”> Texto </Font>, siendo el valor aqua, black, blue,
fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, tead, white, yellow.
CARACTERES ESPECIALES.
Hay una serie de caracteres que si bien pueden verse en Internet Explorer, puede
que no sean vistos por otros navegadores por ejemplo las letras acentuadas, se escribirán
estos caracteres de la siguiente forma:
< <:
> >
& &
“ "
La etiqueta <blink> la introdujo Netscape para poner texto parpadeante y en
Internet Explorer no funciona.
TEXTO EN MOVIMIENTO (MARQUESINAS).
Una marquesina es una ventana en la que se desplaza un texto, sólo en Internet
Explorer, la estructura es la siguiente:
<marquee> Texto que se desplaza </marquee>
Por defecto la anchura de la marquesina es igual a la de la ventana en que se
ejecute el navegador, la altura es igual a la de un línea es decir, la mayor altura del texto
que se desplace, el texto se desplaza lentamente de derecha a izquierda por defecto. Para
modificar el comportamiento por defecto se utilizan los siguientes atributos:
Bgcolor.- modifica el color del fondo, sus valores son los mismos que hemos
visto para modificar el color del texto, por ejemplo:
<Marquee bgcolor=”yellow”> Texto </marquee>
Para modificar los atributos del texto que se desplaza se una la etiqueta font con
los atributos size, face, font y color que hemos visto:
<marquee Bicolor=”yellow><fontsixe=”2” face=”arial” color=”red”> TEXTO1
</font><Font size=”7” color=”blue” face=”times new roman”> TEXTO2
</font></marquee>
Behavoir.- define la manera en que se rea
Crear cuenta
Comentarios de: 4.- Programación en html (0)
No hay comentarios