Recursos

Drawter: Dibuja y obtén el código CSS y HTML

Comments
publicado Ayer bajo , , , .

Esta página creada con JavaScript y jQuery ayudara a los diseñadores a crear páginas de forma sencilla y 100% visual. Simplemente dibujaremos las distintas áreas y etiquetas en el área de dibujo y el solo se encargara de generar el HTML y CSS para crear un diseño que luzca igual que nuestro dibujo.

Una vez que tengamos todo “dibujado” en Drawter podremos entrar al modo de edición donde podremos personalizar aún más las propiedades de cada elemento. Tipo de letra, tamaño, color, color de fondo, contenido y prácticamente cualquier propiedad y atributo.

Visto en el Tumblog de ThemeForest

JavaScript

Presentation Cycle: Presentaciones dinámicas con barra de progreso

Comments
publicado el 25 de January del 2010 bajo , , , , , .

Presentation Cycle es un plugin de jQuery creado por Gaya Kessler que nos hará presentaciones o transiciones de imágenes con texto y una barra de progreso.

En el ejemplo podemos ver el funcionamiento de este plugin en 3 diferentes formas, la básica, una minimalista y otra aún mas minimalista.

Para implementarlo en una página debemos de incluir en el header las hojas de estilo y archivos del script y del jQuery: Continuar »

Tutoriales

Creando un Plugin para Wordpress

Comments
publicado el 15 de January del 2010 bajo , , , , , , , , , , , , , , , , , , , , , .

Yo ya he creado alguna vez un plugin para Wordpress, pero nunca he hecho una entrada sobre como crearlo. En esta entrada vamos a crear un plugin para Wordpress sencillo para empezar con algo básico facil de entender.

Nuestro plugin será sencillo. Simplemente sustituirá [abbr="Descripción"]Palabra[/abbr] por <abbr title="Descripción">Palabra</abbr>. Además añadirá unas pocas lineas de CSS a la página para que se vea todo correctamente.

Esto no es más que una pequeña implementación de BBCode. Siguiendo este ejemplo literalmente podremos añadir más elementos a nuestros post fácilmente. Si le echamos más imaginación podremos crear cualquier plugin. Continuar »

Organizar el código muchas veces es algo tedioso aúnque muy necesario e importante. Francisco nos recomienda 3 herramientas para organizar nuestro HTML, CSS y PHP de forma sencilla.
Diseño/Desarrollo Web

Enlaces para el Sábado

Comments
publicado el 10 de October del 2009 bajo , , , , , , , , , , , , , , , , .
CSS

Página de prueba HTML para testear nuestro CSS

Comments
publicado el 24 de June del 2009 bajo , , , , , , , , , , , .

En Snipplr podemos ver los fragmentos de código que usan otros diseñadores. Algunos de ellos son realmente buenos como este que he encontrado hoy.

Es sencillo. Simplemente es una página HTML en la que encontraremos aquellos elementos más comunes y asi podremos probar nuestra hoja de estilo CSS y comprobar que elementos hemos definido, cuales no y cuales están bien y cuales no. Todo ello desde una solo página de un solo viztazo.

A continuación os dejo el código aunque también podeís verlo en snipplr. Continuar »

Menús desplegables, ¡solo con CSS! Normalmente solemos usar Javascript para añadirles efectos pero realmente si queremos realizar un menú desplegable sencillo lo podemos hacer solo usando CSS tal y como lo explica el señor Janko en su blog.
A veces para solucionar algunos de los problemas en cuanto a compatibilidad con los distintos navegadores de CSS no nos basta el CSS, a veces, tenemos que recurrir al Javascript. Por eso os dejo esta entra que recopila 8 Soluciones basadas en Javascript a los problemas más comunes de CSS.