4.3   Elementos

Para los webzines y para los sitios web en general, existen una serie de elementos que se les puede incluir para darle mayor dinamismo o espectacularidad al mismo, y cada uno de ellos tiene a su vez varias opciones para escoger la más acorde con cada proyecto, es conveniente pues analizar las más importantes.

Imagen. Existen actualmente en el mercado un número inmenso de formatos para imágenes: JPG, JPE, GIF, BMP, ART, PCT, PIC, PNG, EPS, DXF, EMF, SWF, WMF, SPL, MOV, etc, los navegadores convencionales como Explorer, Netscape y American On Line pueden soportar la mayoría, eso nos da una gama muy amplia de donde escoger.

Las mejores opciones son .JPG para el grueso de las imágenes y las .GIF para todas aquellas que necesiten transparencias o que su gama de colores no sea tan amplia como lo sería una fotografía. Ello, porque ambos tipos de archivos son conocidos por el común de los usuarios de internet, si se utilizara por ejemplo, archivos tipo ART (un tipo de archivo increíblemente ligero y exclusivo de AOL), se podrían ver desde casi cualquier navegador, pero a la hora de explorar el contenido del CD le dificultaría la vida a aquellos que quisieran imprimir alguna imagen o utilizar cualquiera como papel tapiz, además mucha gente se asusta de ver archivos de un tipo que no conocen, entonces no explorarían el CD y hay algunas imágenes y otras sorpresas que no están vinculadas, son solo para los que examinen el CD desde fuera de los navegadores.

Cuando se distribuyen imágenes se piensa en dos cosas, “La gente va a querer imprimir alguna” y “La gente va a querer utilizarla como papel tapiz”. Para trabajar lo primero lo más común sería utilizar Photo Paint o Photo Shop, para colocar el papel tapiz se suele utilizar el explorer de Windows o colocarlo directamente desde el navegador, el inconveniente de esto último es que lo convertirá en Mapa de Bits (BMP) y aunque es el formato más aceptado por cualquier programa que maneje gráficos, es demasiado pesado para los usos que se le podrían dar a este CD. Ello me lleva de nueva cuenta a escoger los .JPG y los .GIF como las mejores opciones para las imágenes. Los .JPG tiene un buen índice de compresión, suelo utilizar el 5% para no arriesgarme a dañar la calidad de la imagen; en cuanto a los .GIF, permiten hacer trucos como transparencias o guardar en archivos ligeros imágenes con una gama de color poco amplia. En los dos casos suelo trabajar con los programas Photo Paint y Photo Shop, principalmente con el primero y con resoluciones de 96 a 150ppp.

Tipografía. Dos aspectos básicos hay que cuidar de la tipografía dentro de un CD interactivo o una página web, el puntaje y la legibilidad. Para el primero es conveniente saber en que tipo de monitor se va a mirar el CD, pero tomando en cuenta que se espera su distribución a mediana escala eso no es posible, aun así, basándose en monitores de 15 pulgadas en adelante (los más tradicionales) un puntaje de 13 es más que suficiente, a partir de ahí se aumentará puntos para títulos y otros aspectos resaltables completamente en base a la estética ya que la funcionabilidad no será problema. La legibilidad, por su parte, la primera parte de ella consiste en encontrar una fuente tipográfica que sea de fácil lectura, sin muchos adornos, patines, etc sobretodo cuando son grandes cantidades de texto, hay que tener en cuenta que no solo debe poder comprenderse bien, también debe evitar el cansar por su complejidad, el segundo aspecto de la legibilidad es su relación con el fondo, hay que tener mucho cuidado de no utilizar una tipografía oscura sobre un fondo negro, o por el contrario utilizar letras blancas cuando nuestro fondo es amarillo. Esto presenta sobretodo problemas cuando el fondo consta de un degradado o una fotografía, las áreas claras y oscuras van a estar alternándose unas y otras y no se puede dejar partes del texto claras y otras oscuras ya que su posición dentro de la pantalla cambiara dependiendo del tamaño del monitor con el que se le mire y el navegador que se utilice, aun así si existen trucos para este problema, un fondo en degradado vertical no nos dará problemas si por medio de Javascript se hace desplazar conforme el movimiento de la pantalla, los fondos en degradado horizontal y las imágenes representan un problema mayor, lo más fácil es buscar un color que se imponga al fondo y/o restarle legibilidad a este al convertirlo en una transparencia o aclararlo en demasía, otra opción es poner un fondo específicamente creado para el texto y colocarlo solo debajo de este. Opciones hay muchas, textos desplazables, mouse in-off, etc, todo es cuestión de ingenio.

Audio. Si uno se limita a imágenes (ya sea estáticas o animaciones de cualquier tipo), no está realmente trabajando un sitio multimedia, este es como su nombre lo indica, un lugar en donde podrás apreciar diferentes medios audio-visuales. Ya se habló de gráficos, ahora se verá el sonido.

Tanto flash como htm aceptan muchos formatos diferentes de audios, entre los que destacan los tipo: .MID, .AU, .MP3, .SND, etc, sin embargo se ha utilizado los tipo .MID por las facilidades que me da el programa llamado Sound Forge y por su tamaño, gracias al programa mencionado, se puede armar los archivos de audio pegando y cortando cada una de sus partes, o incrementando y desacelerando las mismas. Los audios sirven básicamente para dos cosas:

1.- Ambientar el sitio y acompañar la lectura visual y

2.- Dar efectos que remitan a las acciones dadas con imágenes o textos.

Animación. Sin importar el género, la calidad, la duración, las características específicas, etc, entendemos como animación cualquier imagen o forma que nos de la sensación de movimiento. “Hoy en día el término “película animada” se reserva en sentido limitado al trabajo de aquellos artistas gráficos que crean sobre el papel o sobre el celuloide fases separadas de movimiento, capaces de producir sensación de movimiento una vez que son proyectadas en pantalla”.

Ha pasado mucho tiempo desde que los doctores Kenneth Knowlton y Edward Zajac (considerados los pioneros de la animación por computadora) dieran a conocer su trabajo. En la actualidad y sin adentrarnos mucho a encuadres, tomas, perspectivas, etcétera se sabe que los sitios web tienen tantas o más animaciones que películas ha hecho Hollywood. Pero el tipo de animaciones más convencionales son de cuatro naturalezas distintas: GIF, Flash, Director y Javascript. De estas cuatro la primera corre absolutamente en cualquier tipo de navegador y hoy y desde windows 98, las otras tres tampoco encuentran ningún tipo de problemas en los equipos actuales. Si acaso Flash y Director podrían necesitar de un programa especial que aunque incluido en Explorer, Netscape y AOL se puede descargar gratuitamente en el sitio de Macromedia y en varios otros más. El proyecto utilizó las animaciones tipo GIF y SWF (Flash).

Las animaciones tipo GIF se utilizan cuando se quiera dar una sensación leve de movimiento y este se repita una y otra vez. Ciertamente se le puede sacar mayor partido a este formato, pero los archivos que resultarían serían increíblemente pesados (en este CD los cuatro archivos GIF más pesados son animaciones, y tres de ellas se componen solo de dos imágenes). Sin embargo algo que podemos hacer con las animaciones GIF y difícilmente darían igual resultado con cualquier otro tipo de archivo son las animaciones con transparencias, GIF da la oportunidad no solo de hacer un grafico animado, si no también de que este se pueda integrar al fondo como si este fuera un escenario y no verse forzosamente dentro de un recuadro (aunque si es lo que se quiere se puede hacer sin ningún problema).

Mucha gente piensa que las animaciones tipo GIF están limitadas a sensaciones de movimientos simples, tal vez tengan razón, pero los efectos que se pueden lograr con ellos solo depende de la creatividad del realizador.

Y complementando el trabajo se encuentran las animaciones SWF o tipo Flash. Sus ventajas son innumerables, sus características muchas y su peso no es tan grande. Pero posiblemente lo que las distinga por sobretodo es la facilidad que tienen para crear una interacción con el usuario que va mucho más allá de solo apretar un botón para pasar a la siguiente pantalla, se pude hacer que dependiendo de lo que hallan hecho antes vayan a determinada pantalla en particular. Entre las herramientas de Flash se encuentra la de crear los pasos intermedios entre dos puntos de una animación sin tener que hacer el diseñador cada uno, ello da una ventaja en peso y efectos respecto a GIF casi total.

Los archivos SWF utilizados en este CD son exageradamente pesados (T2070.SWF, el más grande de todos, pesa 805KB), pero eso tiene una razón, están hechos para correr en el CD, la precarga no gasta tantos recursos y es rápida, si este sitio se subiera a la red sería poco práctico, se cargaría muy lento y correría igual, a mí no me interesa evitar su distribución a la red, si adquiriste este trabajo tienes derecho a hacer con el lo que quieras (excepto decir que es tuyo o no darme mis créditos) pero si quiero dificultar su distribución. Volviendo al ejemplo de T2070.SWF, estas mismas animaciones para la red debieron de haberse hecho en ocho archivos distintos, uno para cada personaje  y dos para las introducciones, todo lo anterior decidí incluirlo en una sola mega animación que en la red tardaría varios minutos en descargarse.

Fondo. El fondo es la superficie de nuestra página web o de nuestra animación flash sobre la cual se van a colocar todos los elementos y se van a desarrollar todas las acciones. Su importancia reside en el hecho de que si no esta bien planeado el texto será completamente ilegible o las imágenes no tendrán el impacto que se deseaba o necesitaba. El fondo es generalmente una plasta de color o una fotografía, aunque por medio de la programación de algunos lenguajes scripts puede ser también un degradado entre dos o más colores, sin embargo para esto último es más usual colocar una imagen que tenga dicho degradado.

Para una página htm, una imagen con un degradado totalmente horizontal solo debe cuidarse de tener una anchura mínima de 1024 píxeles, esto a razón de que puede lucir sin problema tanto en monitores de 800 x 600 como en los de 1024 x 768 y tanto a ventana normal como a ventana + F11 (Pantalla Completa). Por otro lado si dicho degradado tiene una inclinación aunque sea mínima está será notoria durante la repetición constante de la misma ya dentro de la página en cuestión desplegada. Una página con un degradado vertical, por su parte, debe contar con una altura mínima de 768 píxeles por las razones arriba citadas. Pero aquí se presenta un problema adicional, si el degradado se da de un color oscuro a uno claro o viceversa no existirá un color para el texto que lo haga visible en toda la página, una solución simple es agregar una pequeña orden al código htm que da la instrucción de desplazar el fondo junto con el área de pantalla, la instrucción es:

onunload=spawntopfivewindow()

Nota: Algunos ejemplos de esto se pueden encontrar en: augal3.htm y todos sus archivos vinculados.

Cuando la imagen de fondo llama más la atención que el resto del contenido de la página es conveniente cambiarla o apagarla un poco (ya sea convirtiéndola en una transparencia o abrillantándola en distintas intensidades). Concluyendo, las mejores opciones para utilizar una imagen de fondo son un GIF animado o una imagen estática JPG, el primero por los efectos que nos puede dar, la segunda por su ligereza.