Es el lenguaje de marcado predominante para la elaboración de páginas web. Es usado para describir la estructura y el
contenido en forma de texto, así como para complementar el texto con objetos
tales como imágenes. El HTML se escribe en forma de «etiquetas», rodeadas por corchetes angulares (<,>).
HTML también puede describir, hasta un cierto punto, la apariencia de un
documento, y puede incluir un script (por ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores web y
otros procesadores de HTML.
HTML también es usado para referirse al contenido del tipo de MIME text/html o todavía más ampliamente
como un término genérico para el HTML, ya sea en forma descendida del XML (como XHTML 1.0 y posteriores) o en forma
descendida directamente de SGML (como HTML 4.01 y anteriores).
Primeras especificaciones
La primera descripción de HTML
disponible públicamente fue un documento llamado HTML Tags (Etiquetas
HTML), publicado por primera vez en Internet por Tim Berners-Lee en
1991.1 2 Describe 22
elementos comprendiendo el diseño inicial y relativamente simple de HTML. Trece
de estos elementos todavía existen en HTML 4.3
Berners-Lee consideraba a HTML una
ampliación de SGML,
pero no fue formalmente reconocida como tal hasta la publicación de mediados de
1993, por la IETF,
de una primera proposición para una especificación de HTML: el boceto Hypertext
Markup Language de Berners-Lee y Dan Connolly, el cual incluía una Definición de Tipo de Documento SGML
para definir la gramática.4 El boceto
expiró luego de seis meses, pero fue notable por su reconocimiento de la
etiqueta propia del navegador Mosaic usada para insertar imágenes sin cambio de línea,
reflejando la filosofía del IETF de basar estándares en prototipos con éxito. 5 Similarmente,
el boceto competidor de Dave Raggett HTML+ (Hypertext Markup Format) (Formato
de marcaje de hipertexto), de 1993 tardío, sugería, estandarizar
características ya implementadas tales como tablas.
El lenguaje html
contiene dos partes:
·
el contenido, que es el texto que se
verá en la pantalla de un ordenador,
·
y las etiquetas y atributos que
estructuran el texto de la página web en encabezados, párrafos, listas,
enlaces, etc. y normalmente no se muestra en pantalla.
Etiquetas para HTML, Colores
E
Anteriormente os hemos explicado que todo lo que queramos que se vea en
nuestra página web deberemos escribirlo dentro de la etiqueta body. Eso es lo
que llamamos el "cuerpo" del documento. Es la parte visible. Pero
debes saber que ese cuerpo, o sea, que la etiqueta body también podemos
personalizarla para darle el aspecto que nosotros deseemos.
Esta personalización la conseguiremos a través de una serie de parámetros que a continuación te presentaremos. Bien, pues vamos a empezar.
Color de fondo: bgcolor
El primer parámetro que debes conocer es el del color de fondo, el "bgcolor". A través de este parámetro podremos definir el color de fondo que queramos que tenga nuestra página. Un ejemplo muy simple es el siguiente: Si queremos que nuestra página quede con un fondo rojo deberemos escribir:
Esta personalización la conseguiremos a través de una serie de parámetros que a continuación te presentaremos. Bien, pues vamos a empezar.
Color de fondo: bgcolor
El primer parámetro que debes conocer es el del color de fondo, el "bgcolor". A través de este parámetro podremos definir el color de fondo que queramos que tenga nuestra página. Un ejemplo muy simple es el siguiente: Si queremos que nuestra página quede con un fondo rojo deberemos escribir:
<body
bgcolor="#FF0000"></body>
Imagen de fondo: background
Puede que no quieres que tu página tenga un color sólo de fondo, sino que quieras que tu página tenga una imagen. En ese caso deberás indicarlo con la etiqueta "background". La etiqueta quedaría de la siguiente manera:
Puede que no quieres que tu página tenga un color sólo de fondo, sino que quieras que tu página tenga una imagen. En ese caso deberás indicarlo con la etiqueta "background". La etiqueta quedaría de la siguiente manera:
<body background="URL">
</body>
Dónde leemos "URL" deberemos escribir la dirección de la
imagen que queramos que sea nuestro fondo. Una cosa muy importante que debes saber
es que si la imagen no es suficientemente grande para rellenar toda la página,
la imagen se repetirá tanto a lo ancho como a lo largo hasta rellenar todo el
espacio.
Color de texto: text
Una vez tenemos el fondo definido, tendremos que predefinir ahora el color del texto de nuestra web. Es decir, tendremos que decirle al navegador de qué color queremos que sea nuestro texto. Esto lo definiremos con el parámetro "text".
Como ejemplo vamos a poner que queremos que nuestro texto sea en negro, con lo que escribiremos lo siguiente:
Color de texto: text
Una vez tenemos el fondo definido, tendremos que predefinir ahora el color del texto de nuestra web. Es decir, tendremos que decirle al navegador de qué color queremos que sea nuestro texto. Esto lo definiremos con el parámetro "text".
Como ejemplo vamos a poner que queremos que nuestro texto sea en negro, con lo que escribiremos lo siguiente:
<body text=
"#000000"></body>
Márgenes: leftmargin, topmargin, rightmargin y bottommargin
Ya sabemos de qué color será nuestro fondo y nuestro texto, pero también podemos predefinir los márgenes de nuestra página web para que queda mucho mejor. Porque no queremos que nuestro texto se quede muy pegada a los márgenes, ¿verdad?
Para especificar los márgenes utilizaremos el parámetro margin, con su correspondiente indicación delante. Así encontraremos "leftmargin" para el margen izquierdo, "topmargin" para el margen de arriba, "rightmargin" para el margen de la derecha y "bottommargin" para el margen de abajo.
Si queremos que nuestros márgenes sean de 10 píxeles por todas partes escribiremos lo siguiente:
Ya sabemos de qué color será nuestro fondo y nuestro texto, pero también podemos predefinir los márgenes de nuestra página web para que queda mucho mejor. Porque no queremos que nuestro texto se quede muy pegada a los márgenes, ¿verdad?
Para especificar los márgenes utilizaremos el parámetro margin, con su correspondiente indicación delante. Así encontraremos "leftmargin" para el margen izquierdo, "topmargin" para el margen de arriba, "rightmargin" para el margen de la derecha y "bottommargin" para el margen de abajo.
Si queremos que nuestros márgenes sean de 10 píxeles por todas partes escribiremos lo siguiente:
<body
leftmargin="10px" topmargin="10px"
rightmargin="10px" bottommargin="10px"></body>
Color de links: link, alink y vlink
En body también podemos ( y de hecho debemos hacerlo) definir el color de los vínculos de nuestra páginas, definir el color con el que se mostraran los links. Aquí debemos diferenciar tres tipos de instrucciones: Debemos definir el color del link (con la etiqueta "link"), el color del link activo (con la etiqueta "alink") y el color del link ya visitado (con la etiqueta "vlink").
Así pues, si queremos que nuestra página tenga un color de enlaces (de links) de color rojo y que esos enlaces sean rojos cuando estén activos y se queden en azul cuando estén inactivos deberemos escribir lo siguiente:
En body también podemos ( y de hecho debemos hacerlo) definir el color de los vínculos de nuestra páginas, definir el color con el que se mostraran los links. Aquí debemos diferenciar tres tipos de instrucciones: Debemos definir el color del link (con la etiqueta "link"), el color del link activo (con la etiqueta "alink") y el color del link ya visitado (con la etiqueta "vlink").
Así pues, si queremos que nuestra página tenga un color de enlaces (de links) de color rojo y que esos enlaces sean rojos cuando estén activos y se queden en azul cuando estén inactivos deberemos escribir lo siguiente:
<body link=
"#FF0000" alink= "#FF0000" vlink= "#
0000FF"></body>
Encontrar el color específico para un diseño en páginas web es difícil. Muchas veces
los diseñadores necesitan el código del color que necesitan para poder
utilizarlo en la página web. El sitio web html-color-codes contiene
una gran cantidad de códigos de colores especiales
(216 códigos de colores) para html. Se pueden buscar en forma hexadecimal (XHTML y CSS), decimal RGB y decimal alternativos;
todos completamente gratis.
,
Este recurso es especial para diseñadores gráficos
y para ser utilizado con programas de diseño como Photoshop e Illustrator. Colorjack es
una paleta de colores muy completa que permite
encontrar justo la tonalidad de color que se quiere para cierto proyecto gráfico. Incluye los códigos de colores para cada
una de las combinaciones.
Se utiliza con puntos o coordenadas en una paleta
completa, y proyecta la información del balance, saturación, y hue,
además de la cantidad de rojos, verdes y azules de
cada combinación. El sitio web contiene
también más opciones para crear combinaciones de grises, colores análogos,
triadic, y tetradic, entre otros.
Si te cansaste de los iconos que trae incluido el Sistema Operativo
Windows, puedes cambiarlos por unos más coloridos y divertidos.
Lo mejor de todo es que son gratis.
