miércoles, 8 de septiembre de 2010

COLORES RGB

FUNDAMENTACIÓN TEORICA DE LOS COLORES RGB DE HTML

La paleta de colores RGB (RVA en español) consta, básicamente, de tres colores primarios aditivos: Rojo-Verde-Azul. Estos colores primarios aditivos, en HTML, están representados por tres pares hexadecimales del tipo 0xHH-HH-HH según el siguiente formato:(los colores básicos o primarios no aquellos que no son resultantes de mezclas)

#RRGGBB (= #RRVVAA)

Los valores que puede adoptar cada uno de los tres pares hexadecimales van del 0x00 (0 decimal) al 0xFF (255 decimal). sea el valor del par, tanto mayor será también la intensidad (matiz, brillo o claridad) del color correspondiente a ese par (y viceversa). Esto implica que el extremo inferior de la escala cromática parte de una intensidad (grado) de color mínima (nulo = par 0x00), pasa por una intensidad de color media (mediano = par 0x80 [128 decimal]) hasta llegar a una intensidad de color máxima (saturado = par 0xFF). El grado de más alta pureza (absoluto) de un color primario aditivo estará determinado por la presencia total del mismo (saturación = 0xFF) junto con la ausencia total (nulidad = 0x00) de los otros dos colores primarios aditivos.

Además de estos tres colores primarios aditivos (RVA), existen tres colores primarios sustractivos o CMY (CMA en español): Cian- Magenta-Amarillo. Estos colores surgen de la siguiente combinación (mezcla) de los primarios aditivos:

Cian = Verde + Azul

Magenta = Rojo + Azul

Amarillo = Rojo + Verde

En cuanto a su grado de pureza, ocurre algo inverso a los colores primarios aditivos, ya que el grado absoluto estará determinado por la nulidad de uno de sus componentes y la saturación de los otros dos. Los colores complementarios de los primarios, tanto aditivos como sustractivos, serán recíprocamente:

Rojo ↔ Cian

Verde ↔ Magenta

Azul ↔ Amarillo

La combinación simultánea de los tres primarios aditivos saturados produce el blanco (0xFFFFFF). Contrariamente, la combinación simultánea de los tres primarios sustractivos nulos produce el negro (0x000000). Resulta claro también que la combinación de dos colores mutuamente complementarios producirá el blanco, de igual modo que la sustracción (absorción) de ambos dará lugar al negro (ausencia total de color). Así, p. ej., el rojo (0xFF0000) más su complemetario que es el cian (0x00FFFF), generan el blanco (0xFFFFFF). De hecho, el cian no es otra cosa que la sustracción del rojo al blanco.

Por su parte, el gris mediano (0x808080), que es el exacto término medio entre el negro y el blanco, se obtendrá a partir de la combinación simultánea de los tres primarios aditivos medianos. Análogamente, el gris semisaturado (claro) se obtendrá a partir de la combinación 0xC0C0C0, mientras que el gris seminulo (oscuro) mediante 0x404040. De este modo, tenemos que el resto de los colores, que están comprendidos entre el negro (0x000000) y el blanco (0xFFFFFF), surgen de la combinación de los tres primarios aditivos en distintos grados. En otras palabras: bastará con reemplazar cada uno de los pares 0xHH-HH-HH por un valor comprendido entre 0x00 y 0xFF para obtener cualquiera de los colores posibles.

Aunque en la práctica, puede haber algunas combinaciones que no sean válidas. Eso pasaba antiguamente, cuando la paleta de colores más grande tenía 256 colores. Por eso, existen 216 colores seguros, que serán visibles en cualquier dispositivo sin necesidad de dithering. (otros 40 para el sistema), de los cuales algunos se muestran aquí.

Tabla simplificada de colores

Lo visto hasta aquí, lleva a obtener la siguiente tabla de colores con sus respectivos valores hexadecimales:

Primarios aditivos saturados (absoluto)

  • ROJO = FF0000
    VERDE = 00FF00
  • AZUL = 0000FF
  • Combinación de los tres primarios aditivos saturados (absolutos).
    • BLANCO = FFFFFF

Primarios sustractivos nulos (absolutos)

  • CIAN = 00FFFF
  • MAGENTA = FF00FF
  • AMARILLO = FFFF00
  • Combinación de los tres primarios sustractivos nulos. (absolutos)
    • NEGRO = 000000

Algunos secundarios y terciarios (medianos)

  • GRIS = 808080
  • ROSA = FF8080
  • VIOLETA = 800080
  • CELESTE = 80FFFF
  • MARRON = 800000
  • NARANJA = FF8000
  • LAVANDA = 8000FF
  • TURQUESA = 00FF80
  • ORO VIEJO = BBBB20

ETIQUETAS HTML

Etiquetas.

Las etiquetas o marcas delimitan cada uno de los elementos que componen un documento HTML. Existen dos tipos de etiquetas, la de comienzo de elemento y la de fin o cierre de elemento.

La etiqueta de comienzo está delimitada por los caracteres <>. Está compuesta por el identificador o nombre de la etiqueta, y puede contener una serie de atributos opcionales que permiten añadir ciertas propiedades. Su sintaxis es:

Los atributos de la etiqueta de comienzo siguen una sintaxis predefinida y pueden tomar cualquier valor propio del usuario, o valores HTML predefinidos.

La etiqueta de final está delimitada por los caracteres < /y >. Está compuesta por el identificador o nombre de la etiqueta, y no contiene atributos. Su sintaxis es:

Cada uno de los elementos de la página se encontrará entre una etiqueta de comienzo y su correspondiente etiqueta de cierre, a excepción de algunos elementos que no necesitan etiqueta de cierre. También es posible anidar etiquetas, es decir, insertar etiquetas entre otras etiquetas de comienzo y de cierre.

Ejemplo:

(p align="center")(font color="#993366" size="4" face="Comic Sans MS, Arial, MS Sans Serif")Bienvenidos a www.cbtis34.com(/font)(/p)

Es importante anidar bien las etiquetas, las cuales no se pueden 'cruzar', es decir, en el ejemplo hemos empezado por la etiqueta , antes de cerrar esta etiqueta hemos puesto la por lo que antes de cerrar la etiqueta debemos cerrar la etiqueta .

Mi primera página.

Lo primero es abrir el Bloc de notas y teclear lo siguiente:


(html)

(head)

(title)MI PRIMERA PAGINA(/title)

(/head)

(body bgcolor="#FFCC99")

(font color='*#CC3300" size="5") Hola, estoy haciendo pruebas.(/Font)

(/body)

(/html)

Por motivos de publicar en el blog se cambiaron los caracteres ( < ) por paréntesis, si acaso deseas comprobar el código, no cometas el error de utilizar los paréntesis.

¿Que es el HTML?

¿Que es el HTML?

El HTML (Hyper Text Markup Language) es el lenguaje con el que se escriben las páginas Web. Es un lenguaje de hipertexto, es decir, un lenguaje que permite escribir texto de forma estructurada, y que está compuesto por etiquetas, que marcan el inicio y el fin de cada elemento del documento.

Un documento hipertexto no sólo se compone de texto, puede contener imágenes, sonido, vídeos, etc., por lo que el resultado puede considerarse como un documento multimedia.

Los documentos HTML deben tener la extensión HTML o htm, para que puedan ser visualizados en los navegadores que se encargan de interpretar el código HTML de los documentos, y de mostrar a los usuarios las páginas Web resultantes del código interpretado.

Versiones de HTML.

En noviembre de 1995 se aprobó el estándar HTML 2.0. para la creación de páginas web. Se creó con objetivos divulgativos, orientado a la actividad académica, en el que el contenido de las páginas era más importante que el diseño.

En enero de 1997 se aprobó el estándar HTML 3.2. Este nuevo estándar incluía las mejoras proporcionadas por los navegadores Internet Explorer y Netscape Navigator.

En diciembre de 1997 se aprobó el estándar HTML 4.0, creado para estandarizar los marcos (frames), las hojas de estilo y los scripts.

En septiembre de 2001 se aprobó el estándar HTML 4.01.

Los Navegadores.

El navegador instalado en la computadora del usuario es el que interpreta el código HTML de la página que visita, por lo que a veces puede ocurrir que dos usuarios visualicen la misma página de forma distinta porque tienen instalados navegadores distintos o incluso versiones distintas del mismo navegador.

Los navegadores tienen que ser compatibles con la última versión HTML para poder interpretar el mayor número posible de etiquetas. Si un navegador no reconoce una etiqueta, la ignora y el efecto que pretendía la etiqueta no queda reflejado en la página.

Habrá páginas cuyo código podrá ser interpretado completamente por todos los navegadores, mientras que otras, al incluir nuevos atributos o etiquetas del borrador de la última versión de HTML, solo podrán ser interpretadas en su totalidad en los navegadores más actualizados.

Editores.

Un editor es un programa que nos permiten redactar documentos. Hoy en día existen un gran número de editores que permiten crear páginas web sin la necesidad de escribir ni una sola línea de código HTML. Estos editores disponen de un entorno visual, y generan automáticamente el código de las páginas. Al poder ver en todo momento cómo quedará la página en el navegador, se faculta la creación de las páginas, y el uso de menús permite ganar rapidez.

Estos editores visuales pueden generar en ocasiones código basura, es decir, código que no sirve para nada, en otras ocasiones puede ser más efectivo corregir directamente el código por lo que resulta necesario saber HTML para poder depurar el código de nuestra páginas.

Objetivos de una Pagina WEB

1. La página web debe estar orientada tanto a su negocio como a las necesidades de sus
clientes

Un buen diseño significa una web agradable a la vista y sencilla de usar. Su visitante debe ser capaz de encontrar la información que busca con el mínimo esfuerzo, de manera rápida y eficaz.

2. Un diseño que potencie la imagen de su marca y de su empresa.

Es importante que la página refleje la identidajl corporativa de la empresa y asimile a su negocio en el mundo real. El mejor diseño suele ser siempre el más sencillo, el que apenas se percibe.

3. Un sitio optimizado para los buscadores.

En la actualidad el mayor tráfico hacia tu web es generado por Google, MSN o Yahoo, y es importante que su web esté optimizada para que estos la encuentren e indexen sin problema.

4. Tiempo de carga mínimo.

La idea es que la web sea lo más ligera posible. Las imágenes justas y optimizadas. Una página que sea dinámica, cargarse rápido, y desplegar contenidos entendióles.

5. Claridad

Cuanto más sencilla sea la dirección del sitio web, más fácil resultará recordarla.

6. Actualización

Tiene que presentar transformaciones, novedades, estar siempre actualizada.

7. Organización

Los contenidos deben estar organizados pensando en el usuario y la información debe ser relevante para quien consulta la página.

8. Autoadministración

Es necesario contar con un formato establecido que permita modificar rápido y sin mucha complicación la pagina.

9 Belleza

El sitio web debe ser atractivo y diferente. Diferente, sobre todo, al de los competidores. La página tiene que permitir la rápida evocación de los productos y de la empresa.

10. Seguridad

El hosting (servidor o alojamiento de la página web) que contratemos debe ser fiable y seguro, de nada sirve un excelente diseño si el servidor se cae continuamente.