de webmaster a webmaster

Lo que tenemos clasificado como ‘Utilidades gráficas

Y mil banners volverán…

sin comentarios, by the moment porfaplis, deja uno que "é grati"

…voooolverán… como nos cantaba, en referencia a unas gaviotas y no a unos banners, la canción ya lejana en el tiempo de aquel cantante vasco de dientes entrecortados, creo que de nombre Mikel Eretxun no? y qué decía “volverán” o “ande irán” 😉 ?

Decir que Adobe Flash está tocado y hundido es una opinión muy personal y de aquellas que siempre genera polémica entre desarrolladores. Y que creo que esta debe ser ya la duodécima vez que saco este tema a debate en el blog, tanto ajo es lo que tiene.

Si, quiero leer el resto de este rollo »

Conversor de vídeo Online

sin comentarios, by the moment porfaplis, deja uno que "é grati"

Observa la diferencia entre estos dos formatos de vídeo online uno realizado con la herramienta de conversión online Vid.Ly y otro con el clásico <object> de YouTube

Vídeo en Vid.ly funcionando bajo HTML 5

El mismo vídeo en YouTube

Ahora saca tu Smartphone, sea iPhone sea Android o incluso un iPad o cualquier table con Android por debajo del 2.2 y prueba a visitar este mismo artículo.

Las diferencias son:

El vídeo bajo Vid.ly es universal, es decir se visiona correctamente en cualquier dispositivo.
El vídeo bajo Vid.ly empieza en negro, es decir, no tiene un preview como el de YouTube
El vídeo bajo YouTube tiene publicidad o vídeos relacionados, posiblemente de tu competencia al final de la reproducción del mismo
Los controles del vídeo de YouTube no se ocultan los de Vid.ly sí
El vídeo bajo Vid.Ly funciona mejor a pantalla completa en sistemas Ubuntu 64 bits que el de YouTube

Y no sólo es eso, el sistema Vid.ly se encarga de comprimir tus vídeos y convertirlos gracias a la aplicación web que encontrarás en: http://vid.ly/

Te proporciona versiones incluso bajo .flv para sistemas antiguos y te los almacena gratis en la red de contenidos o CDN de Amazon S3.

También, tras comprimir un vídeo te muestra enlaces directos a vídeos en su versión móvil para que puedas enviar esos enlaces a tus vídeos por SMS de forma gratuita a través de la propia interface de la aplicación web aunque eso a mi no me ha funcionado, obviamente también puedes enviarlo por email, por ejemplo este vídeo lo tienes en: http://vid.ly/0l6f0i

Blogueado por uvedobles.com alias uvedobles.com

March 16th, 2011 a las 11:20 am

Botones en CSS3

sin comentarios, by the moment porfaplis, deja uno que "é grati"

Sencilla colección de botones bajo CSS3 desde botones cuadrados a botones con esquinas redondeadas y estilo burbuja o bubble.

Puedes descargar la hoja de estilos CSS en el siguiente enlace.

http://horaciobella.com/zardi/

Ver la disposición de una página web

sin comentarios, by the moment porfaplis, deja uno que "é grati"

ver-wireframe-de-una-pagina.jpg

O como dicen los de lengua inglesa, ver el Wireframe, see the wireframe.

¿Qué es un wireframe?

Pues como ya decimos en el título un wireframe es un esquema de disposición de los diferentes elementos de una página web. Los módulos visuales sin textos en los que se distribuyen los contenidos.

La utilidad que le podemos dar es la del estudio y la inspiración, por ejemplo cuando una página web te gusta o te atrae por su usabilidad, ejecutas la herramienta y podrás ver su estructura, a partir de aquí inspira y expira código fuente hasta que la mejores.

En la captura de pantalla anterior te mostramos el wireframe de la página corporativa de nuestra aplicación de gestión online invOOice.com, una distribución la mar de sencilla y clara, en el header, selector de idiomas, logo, menú de navegación cuerpo de a tres columnas con imagen en cada una y un footer.

La aplicación para ver el wireframe

Esta aplicación es un Bookmarklet, es decir una aplicación web que se puede instalar como favorito, para instalarla:

Arrástra ESTO hasta tu barra de favoritos, si no te funciona dirígete a la página de autor y allí encontrarás más botones para instalarlo y una mayor documentación.

Os copiamos un vídeo de youtube sobre el funcionamiento de esta aplicación:

Enlace original: http://www.volkside.com/2010/12/introducing-wirify-the-web-as-wireframes/

Uso de las webfonts de Google

sin comentarios, by the moment porfaplis, deja uno que "é grati"

comparar-webfonts.png

Hoy vamos a jugar un poquito con las fantanbulosas webfonts de Mr. Google

¿Qué que son las webfonts?

Eso se lo preguntas a Google. http://code.google.com/apis/webfonts/

¿Cómo funcionan?

Para usarlas debes incluir cada fuente tipografía webfont que quieras usar en la sección header del HTML con un:

<link href="http://fonts.googleapis.com/css?family=Orbitron:bold&subset=latin" rel="stylesheet" type="text/css">

Luego en la hoja de estilo de tu página la debes definir, recuerda también tirar de segundas opciones, tal como lo reflejamos aquí, aria o cualquier tipografía “serif” esto es más que nada porque hay navegadores viejos o paratos como el iPad on iOS 3.x a los que se le atragantan las Webfonts.

font-family: 'Orbitron', arial, serif;

¿Dónde previsualizarlas?

Supongo que como a mi, te interesa ver de forma rápida que fuentes hay por la red, que pinta hacen y tal para poderlas meter en tu página o blog, pues bien los chicos y chicas de Google te las muestran en la siguiente dirección:

http://code.google.com/webfonts

¿Dónde comparar las Google Fonts?

Como el visualizador de Google es quizá demasiado escueto te recomendamos otro que está algo mejor, no mucho, pero algo es algo dijo un geek cuando se encontró un byte en la sopa…

http://www.fontcomparer.com/

¿Donde estamos usando ya webfonts?

Nosotros hemos empezado a incorporarlas en un proyecto en el que estamos trabajando basado en ecOOmmerce.com nuestro software de tiendas virtuales.