Formatos de video. MPEG, FLV y AVI.

Como existe diferentes tipos de formato de imágenes tales como TPEG, TIFF, GIF etc. También para los videos, entender porque y como funcionan dichos formatos ayudara considerablemente lograr mejores resultados en nuestra Web.

Que es un vídeo MPEG:

Las siglas MPEG corresponden a Moving Picture Experts Group el cual es un grupo de trabajo encargado de impulsar estándares con respecto al uso de las imágenes.

Los videos en dicho formato tienen por característica una compresión que los hace más livianos al momento de transportar. El sistema de compresión consiste de la fragmentación de los datos y el almacenamiento de aquellos que son diferentes, los cuales se repitan son quitados logrando una mejora en el peso total del archivo.

En la antigüedad este sin dudas fue uno de los formatos más adecuados y prometedores para la Web. Actualmente se considera desestimado con respecto a otros formatos como H264 o OGG Theodora que prestan mejor calidad / rendimiento.

Que es un vídeo AVI:

El formato AVI (siglas en inglés de Audio Video Interleave) es el formato propuesto por Microsoft desde 1992 como contenedor de videos y audio.

El video o audio no necesariamente tiene que ser AVI, ya que este es un contenedor, el códec que interpreta el flujo puede reproducir otros formatos como DivX, MP3, AC3 etc.

La propiedad más importante de este formato es sin dudas su capacidad de contener varios flujos de información en el mismo fragmento de datos. Esta capacidad se denomina interleave y es la que nos da la posibilidad de cuando vemos una película poder cambiar el audio de un idioma a otro. Por ende quiere decir que el cuadro y el sonido van vinculados unos con  el otro.

Este formato aun sigue siendo muy popular dado que la distribución de películas hogareñas en su mayoría CD-ROM contó con versiones en AVI DviX logrando muy buena calidad sin requerir un DVD-R.

En la actualidad es muy raro ver la implementación de AVI en Web.

Que es un vídeo  FLV:

Flash Video es un formato contenedor a igual que AVI diseñado para transmitir video en la Web. El formato fue creado por la empresa Macromedia y continuado por Adobe después de su adquisición. Flash video puede ser reproducido por el Flash Player principalmente aunque si se instala los códec de ffdshow tambien se pueden reproducir en otros player como Windows media. Actualmente Flash Player se encuentra en casi toda la población de equipos por lo tanto es un formato muy popular lo que llevo a sitios como YouTube, Yahoo video y Google video a utilizarlo como reproductor estándar.

La calidad del video en general es buena, después de las version 8 se introdujo un nuevo códec de compresión On2 TrueMotion lo que incremento la calidad considerablemente. Las últimas versiones de FVL ya trabajan con soporte H264 brindando calidad en alta definición (HD).

¿Entonces que formato de vídeo usamos para Internet?

Claro esta que para web lo ideal es usar Flash video, por sus prestaciones tanto en peso / calidad y la nueva disponibilidad de soportar video en HD. Pero no solo esas cualidades son las que lo destaca del resto, tenemos que considerar que Flash Video puede interactuar con el lenguaje de programación que interpreta el Flash Player (ActionScript).

Este ultimo nos abre un océano de posibilidades, desde la manipulación del tiempo, eventos, a interactividad. El video como secuencia lineal con Flash video ya no lo es mas, y pasa se ahora un medio interactivo con el usuario.

También Flash video cuenta con la posibilidad de manejar canales alpha (transparentes) para lograr montajes sobre fondos croma  y el poder transmitir en Flash video en modo streaming (vivo) a una cantidad de usuarios al mismo tiempo.

Actualmente es el formato de mayor uso, penetración y compatibilidad, desde películas, programas en vivo hasta salas de chat con audio y video, son las posibilidades que brinda Flash Video.

El reproductor de FLV.

Para reproducir un video en formato FLV, puede realizarlo desde una aplicación de terceros como por ejemplo Mplayer, o incorporar el video en un archivo FLA (Flash). También puede leerlos en modo streaming utilizando algún reproductor.

¿Como convierto archivos AVI, MPEG a FLV?

Cuando se instala el programa de desarrollo Adobe Flash, el mismo incluye una aplicación llamada Flash Video Encoder. Esta es la encargada de convertir formatos como AVI, MPEG, MOV, MP4, MP3 etc. a formato FLV.

También existen aplicaciones de conversión de terceros. Aunque lo recomendable es usar la de Adobe si es que queremos conseguir buenos resultados.

Es importante destacar que para convertir formatos de video a Flash video, es necesario tener instalado QuickTime, ya que este nos brindara de los códec secundarios que requiere el Flash Video Endoder.

Fuentes de sistema para la web

Cuando comenzamos un diseño para la web uno de los primeros errores que cometemos es el usar fuentes o tipografías que están fuera de los estándares normales. Me quiero referir para aquellos desarrollos que usan html, xhtml, php etc., caso contrario cuando se utiliza flash ya que este incorpora de cierta manera las fuentes utilizadas en el SWF para que el usuario final pueda verla de igual manera que el desarrollador el planteo como así también el uso de imágenes.

Cuando diseñamos entre  las cosas a definir antes de comenzar como colores, diagramación, elementos también debemos considerar las fuentes, familias y cuerpos. Esta pre selección de elementos nos dará un control más amplio en el ámbito de los resultados que esperamos para nuestra web. Las fuentes de sistemas son aquellas familias tipográficas que están disponibles en todos los sistemas operativos. Algunas de estas tipografías están en mayor porcentaje en diferentes plataformas pero hay ciertas familias que llegan hasta un 98% de presencia en todos los sistemas operativos. El uso de estas fuentes nos asegurar que nuestro diseño se muestre igual en todas las plataformas y evitaremos que el navegador las tenga que reemplazar por otras y que el diseño se rompa o no se vea de la manera adecuada que queríamos.

A continuación les dejo un listado de familias tipográficas y ejemplo de cómo se ven para que puedan utilizarlas en sus diseños. Cabe aclarar que hay varios métodos para incorporar fuentes que no están disponibles en todos los OS, para ello veremos otro tuto con respecto como utilizarlas.
Si quieren probar todas estas fuentes y simular como se ven visiten este site! http://www.fonttester.com/

Generador de fondos rallados

Una característica común que comparten los sitios creados en CSS es que tienen en algún lugar, mucho o poco algún detalle o fondo con rallas diagonales. Esta característica es sin dudas una firma del CSS en el mundo de los que diseñan, como muchos sabes y mas aquellos que usamos Firewoks es muy fácil hacerlos pero para los que son mas del PhotoShop se les complica la cosa un poco, bueno acá la solución para ellos!!! un generador de rallitas con todas las posibilidades que puedas imaginar!

http://www.stripegenerator.com/index.php?page=index

Iconos para diseño web

No hay mucho para esplicar, le paso la lista nomas:

http://somerandomdude.net/srd-projects/sanscons/ – iconos
http://gtmcknight.com/buttons/hosts.php – pastillas
http://www.antipixel.com/blog/archives/2002/10/22/steal_these_buttons.html – generador de pastillas
http://kalsey.com/tools/buttonmaker/ – generador de pastillas
http://www.famfamfam.com/lab/icons/mini/ – iconos
http://www.lighttek.com/themes/themes.php?D1=Icon%20Sets&D5=Date – iconos
http://www.ndesign-studio.com/resources/mini-pixel-icons/ – y mas iconos

Estilizar formularios con css

Esta es una excelente aplicasion realizada por badboy para estilizar o adornar mejor nuestros formularios usando CSS y Java el resultado son formularios muy agradables a la vista y personalizables si es que nos animamos a modificar un poquito el código y las imagenes, muy recomensable si queres despedirte de los habituales y aburridos formulario.

http://www.badboy.ro/articles/2005-07-23/niceforms_preview/