¿Cómo diseñar una web mobile?

Posted by Omar Benyakhlef on mar 19, 2013 in Diseño para móviles, iPhone, jQuery Mobile, Mobile, Usabilidad | 1 comment

Diseño de Web para Móviles

El tráfico de los dispositivos mobile empieza a ser un factor decisivo a la hora de replantearte el diseño de tu web. En este post no vamos a entrar en si es mejor un diseño adaptative o crear uno especial para este tipo de dispositivos, vamos a ver cuales son los factores decisivos que deciden entre el éxito y fracaso de un sitio mobile.

Los usuarios esperan que su experiencia mobile sea al menos tan buena como la de escritorio. Es muy fácil perder clientes y muy difícil ganarlos, sin embargo, no tener sitio mobile ayuda a tu competencia, así que parece claro que la opción es adaptarse, pero hacerlo bien.

CONTINUAR LEYENDO “¿Cómo diseñar una web mobile?” »

Share and Enjoy

Slide Down Box Menu, un menú completísimo con jQuery y CSS

Posted by Omar Benyakhlef on mar 12, 2013 in jQuery, Usabilidad | 0 comments

Menú con jQuery y CSS

En este blog de diseño web hemos mostrado numerosos ejemplos de menú, y seguiré añadiendo, porque el menú constituye una parte esencial del diseño web, cada proyecto es un mundo y requiere un menú diferente.

La mayoría de las veces, el menú viene condicionado o bien por la cantidad de secciones que vayamos a utilizar o por los absurdos títulos larguísimos que nos pide el cliente. En el segundo caso es casi esencial convencerle que el titular de un menú ha de ser conciso y breve si queremos que funcione.

Hoy os dejo un menú que me ha parecido muy vistoso y útil. Se trata de un menú en el que al hacer rollover sobre la opción la casilla que contiene el titular se abre con un efecto elástico, en la zona superior aparece una imagen y el texto se desplaza hacia abajo, mostrando, cuando es preciso un submenú a su derecha.

Además de poder descargar todo el código de forma gratuita, podréis consultar con amplio detalle todos los pasos del proceso.

VER DEMO Y DESCARGAR MENÚ SLIDE DOWN BOX

Share and Enjoy

Tooltipster, un plugin jQuery súper útil para el usuario

Posted by Omar Benyakhlef on feb 5, 2013 in jQuery, Usabilidad | 0 comments

Tooltipster

Tooltipster es un plugin muy ligero de jQuery, que nos permite facilitar información complementaria al usuario en nuestra web.

Las ventanas de ayuda son del todo customizables, podemos meter desde el simple mensaje de ayuda a una compleja maquetación en HTML. Este tipo de práctica supone un paso de gigante a la hora de hacer más usable una web.

Esta ayuda puede aplicarse tanto en formularios como en diversos elementos interactivos de la web, botones de opciones, imágenes de una galería, incluso como respuesta a la acción sobre un botón, podemos utilizar este plugin para avisar al usuario de que la acción del botón se ha producido con éxito o no, son múltiples los usos que podemos encontrarle.

CONTINUAR LEYENDO “Tooltipster, un plugin jQuery súper útil para el usuario” »

Share and Enjoy

Interfaz usuario en PSD gratis !!!

Posted by Omar Benyakhlef on oct 23, 2012 in Photoshop, Redes Sociales, Social Media, Usabilidad | 1 comment

CrazyPixels nos trae un interfaz de usuario súper completo para descargar gratuitamente.

El archivo es un PSD, en el que podremos encontrar múltiples utilidades para nuestros diseños de interfaz. Botones de sonido, controles, formularios, calendario, sliders de avatares, mapas, cajas de diálogo,… Todo lo que necesitas para diseñar tu interfaz de usuario.
El diseño es muy limpio y elegante, como todas las capas vienen separadas y bien guardadas en su carpeta, no te será difícil costumizarlo a tu gusto o necesidad.

CONTINUAR LEYENDO “Interfaz usuario en PSD gratis !!!” »

Share and Enjoy

La evolución web desde 1990 a 2012

Posted by Omar Benyakhlef on may 23, 2012 in accesibilidad, CSS, Diseño Web, HTML5, jQuery, Usabilidad | 0 comments

Evolución web desde 1990 a 2012

Desde hace unos años, el diseño web ha sufrido una tremenda transformación, gracias a las nuevas tecnologías y a la obligatoria necesidad de los distintos navegadores de adaptarse a ellas.

La web hoy en día es un Universo cada vez mayor de páginas web y aplicaciones web relacionadas entre sí, lleno de vídeos, fotos y contenido interactivo.

Pero detrás de todo esto, existe una interacción de tecnologías y navegadores que intentan día a día hacerse más compatibles y dar al usuario una mejor experiencia.
En los últimos años, la tecnología web ha evolucionado tremendamente, esto, permite a los diseñadores web,  la posibilidad de dar rienda suelta a la imaginación, sin tantas limitaciones como hasta ahora había. Las páginas web actuales, son el resultado de los esfuerzos de una comunidad web de código abierto que ayuda a definir estas tecnologías web, como HTML5, CSS3 y WebGL y asegurarse de que están apoyados en todos los navegadores web.

En http://evolutionofweb.appspot.com/, podréis ver toda la evolución que ha sufrido la web desde 1990 hasta 2012. Las bandas de color en esta visualización representan la interacción entre las tecnologías de la web y los navegadores. Como veréis es una lucha es interminable por poder dar al usuario una compatibilidad con las nuevas tecnologías que van surgiendo.

• VER EVOLUCIÓN WEB DESDE 1990 A 2012

Share and Enjoy

24 Ejemplos de HTML5 & jQuery & CSS3… Alucinante !!!

Posted by Omar Benyakhlef on jul 12, 2011 in accesibilidad, Ajax, Cool Web Design, CSS, Diseño de páginas web, Diseño Web, HTML5, jQuery, Usabilidad | 12 comments

24 Ejemplos de HTML5 & jQuery & CSS3… Alucinante !!!

El diseño webestá en constante evolución.

La aparición hace unos años del jQuery y CSS3, unido a las mejoras introducidas (aunque todavía ridículas) en las velocidades de conexión, han supuesto un cambio radical en la concepción de diseños web.

Ahora con la implantación cada vez mayor de las webs hechas con HTML5, llegamos a un periodo en el que “todo es posible“.

Con un poco de imaginación y atractivos diseños, vamos a ver una total revolución en el diseño web, sobre todo en la usabilidad.

A continuación os dejo con 24 ejmplos de páginas web realizadas en HTML5, jQuery y CSS3,  que me han sorprendido mucho, estamos entrando en una nueva fase de diseño y usabilidad, en la que ya no hace falta pulsar sobre un botón para realizar una acción, en la que podremos interactuar mucho más con la web y dejar de ser meros espectadores.

CONTINUAR LEYENDO “24 Ejemplos de HTML5 & jQuery & CSS3… Alucinante !!!” »

Share and Enjoy