Autor Tema: Diseño web by Alan++ (clase 05)  (Leído 806 veces)

0 Usuarios y 1 Visitante están viendo este tema.

Desconectado Alan++
  • [L0] Ladrón de espacio en la BD
  • Mensajes: 19
    Ingreso: Abril de 2014
  • Sexo: Masculino
  • ar
  • ¿donde estoy?
    • Ver Perfil
Diseño web by Alan++ (clase 05)
« on: 15 Julio de 2014, 05:24 pm »
¿Que seria de las paginas webs sin color?¿que seria de la vida sin colores?¿que seria de las banderas de los equipos de futbol sin sus colores?... solo luz y oscuridad...

Esta bien... no dramaticemos tanto.. es cierto, el color en cualquier diseño web es en alguna forma el concepto mas complejo de manipular, es tan definitivo que puede llevarnos al fracaso o ignorar nuestros errores...

¿Es esto cierto?

Claro que si!, una pagina web ademas de poseer un contenido ofrece una vision especifica del producto y el mundo, el color acertado acentua dramaticamente esto, el color errado nos hace preguntar como la humanidad ha llegado a este punto

Lo interesante de los colores en diseño web es que se pueden definir de varias formas y mirandolo en perspectiva marcan de la misma forma nuestra evolucion dentro de este fantastico mundo mal pagado

Cuando comence, mi astucia (esta bien, tampoco era tanta), me permitio entender que a un color podia definirlo con su nombre en ingles, de esta forma cuando a algun objeto le queria poner un color negro solo tenia que buscar en las secciones mas reconditas de mi cerebro cual era su traduccion en ingles, "black" salia de un lugar inaccesible y se depositaba en el diseño... de esta forma empece a jugar con los convencionales que se le ocurren a uno... black, white, green, red, yellow, blue, grey y unos cuantos mas que no creo hagan falta mencionar

Sin embargo la gama que podes definir es bastante pobre, por esta razon necesite indagar mas y llegue a los colores hexadecimales... algo asi como #00ff00...

Lo principal es aclarar que se llama hexadecimal porque posee 16 numeros en vez de los 10 habituales que usamos, estos son 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e, f

Podemos ver por lo tanto que a = 10, b = 11 ... etc (es mas complejo pero es la idea)

La particularidad de estos con respecto al anterior es que posee una gama mucho mas amplia de colores que nos permite asignar una tonalidad exacta, en diseño web cada pequeño detalle constituye una pieza del rompecabezas que es la pagina, si todas entran delicadamene la obra es magnifica... si tengo que recortar bordes para que las piezas entren seguro es que algo esta mal y posteriormente lo vere en el resultado

De esta forma el color hexadecimal se podria separar en un numeral "#" (obligatorio) y tres pares de numeros, also asi

# 00 ff 00

Esto es muy util para comprender como funciona...

Al separarlo en 3 pares de numeros podemos comprender que los valores varian en cada segmento del 00 al ff pasando por el todas las combinaciones posibles

00, 01... 0b, 0c... fe, ff

Llegado a este momento cada par de digitos representa un color

El 1º par el rojo, el 2º par el verde y el 3º par el azul... entre mas elevado el numero mas fuerte va a ser ese color, y teniendo en cuenta que todos los colores visibles se forman a partir de esos tres es solo de jugar y ver que sale...

#0000ff --> azul
#dddddd --> gris claro
#003300 --> verde oscuro
#ffffff --> blanco
#000000 --> negro

Se que en un principio suena extraño pero con el tiempo solo con pensar que tipo de color uno busca el cerebro entiende como encontrar la mezcla y empieza a "adivinar" mas o menos el valor del color

Finalmente llegamos a los rgb, estos son los que uso en la actualidad y me parecen los mas utiles, en vez de un par de digitos para definir el color, en rgb uno define en los tres colores principales (y de ahi su nombre, red, green, blue) cuanto deseo que valga desde 0 a 255... y lo defino mas o menos asi

rgb(255, 255, 255) --> blanco
rgb(0, 0, 0) --> negro
rgb(255, 200, 200) --> rojo claro

Y si uno lo piensa friamente, la cantidad de combinaciones que uno puede crear con dos numeros hexadecimales son 256, por lo que tanto en hexadecimal como en rgb podemos optar por cada uno de los colores principales en 256 valores diferentes (rgb llega hasta 255 pero arranca desde 0)...

Entonces... ¿si es igual? ¿cual es la diferencia?

Desde no hace mucho rgb integro un 4 valor con la letra "a", es decir que ahora rgb se puede definir como rgba y la gran diferencia radica en esa "a", esa "a" significa alpha y es la encargada de darle transparencia, por lo cual ahora no solo tenes la posibilidad de mezclar 3 colores sino que ademas contamos con la posibilidad de asignarle transparencia y el punto exacto de esta...

Podriamos generar

rbga(0,0,0,0) --> negro transparente
rbga(0,0,0,0.6) --> negro traslucido
rbga(0,0,0,1) --> negro opaco

Como notan, los valores de alpha oscilan entre 0 (transparente) y 1 (opaco), esto nos da una nueva herramienta para realizar diseños mas esteticos, el color ya no es solo el color sino que ademas la fuerza con la que se percibe...

A partir de este nuevo aspecto se abre un nuevo universo de variantes en cada color de los que ya existian, esto de alguna forma mejora las posibilidades pero a su vez complica la decision del color adecuado, ya no se trata de elegir solamente el color exacto sino cuan transparente es ademas...

Pero calma, lo que no nos mata nos hace mas fuerte, y los colores en especial estan siempre pensando como hacernos mas fuertes, lo importante de todo esto es comprender como algo tan pequeño en cuanto a codigo afecta en tan poderosa manera una pagina

Intentarlo es la clave...

Y como decia Darth Vader

"Que el color te acompañe"

♪♫ Tan... tan... tan... tan tatan tan tatan... tan... tan... tan... tan tatan tan tatan ♪♫

------------------------------------------

¿Cuanto de color le falta a este post?... dejo la pregunta en el aire

----->
No podemos matar el tiempo sin herir la eternidad