La mala memoria

Estás viendo los posts archivados en Diseño web

Patrones, pinceles y tutoriales

Publicado el 8 de Junio (2009)

Archivado en ,

Ningún comentario

Hoy os dejo dos colecciones de recursos amplias y muy aprovechables. La primera reune, en Web Design Ledger, una serie de patrones bajo el nombre de “100 new and beautiful seamless patterns” que podemos usar como fondos y que en algunos casos se salen un poco de lo que vemos por ahí habitualmente.

La segunda, que encontraréis en Noupe, impresiona por lo amplia. Aunque el título sea “18 Absolutely Stylish Designs Using Photoshop Brushes and How to’s” no se refiere a 10 diseños sino a 18 estilos de diseño y cada apartado tiene sus webs de recursos y tutoriales.

Que ustedes los disfruten y, a ser posible, que les sean útiles.

Devel para Drupal

Publicado el 29 de Mayo (2009)

Archivado en ,

Ningún comentario

Muchos conoceréis el plugin Web Developer para Firefox, una herramienta que permite “diseccionar” una web elemento a elemento y nos hace mucho más fácil la vida a aquellos que tenemos que adivinar qué tenemos que manipular en los archivos CSS/HTML/PHP para darle a nuestras páginas el aspecto que queremos.

Ahora estoy peleándome con Drupal, por aquello de ampliar horizontes, y la verdad es que la cantidad de hojas de estilo, funciones y plantillas que utiliza este gestor de contenidos para generar cada página de una web puede ser abrumador, como para echar atras a cualquiera, y el plugin que mencionaba antes se queda corto. Necesitamos algo más específico, algo que nos diga qué funciones se llaman para generar cada elemento de la página, qué plantillas se están usando y qué variables se pasan a cada plantilla. Y precisamente eso es lo que nos dan el el proyecto Devel, un amplio conjunto de módulos de Drupal que nos muestra cada uno de esos detalles que necesitamos para empezar a manipular nuestros temas y conseguir la web que queremos. Si queréis echar un vistazo a las “habilidades” de esta herramienta al final del post os dejo un vídeo que también podéis ver en su fuente original. Si estáis pensando en crear algún tema para Drupal 6 estos módulos son imprescindibles y, en combinación con los ya tradicionales plugins para desarrolladores de FireFox, constituyen una máquina de ahorrar tiempo.

No tardando mucho os haré algún comentario sobre el libro que estoy utilizando como referencia, “Drupal 6 Themes” de Ric Shreves.

Todo sobre los “floats”

Publicado el 28 de Mayo (2009)

Archivado en ,

Ningún comentario

Esta artículo, “All about floats”, de Chris Coyier va camino de tener un año pero es bastante probable que, si andas buscando en google soluciones a tus problemas con los “floats” en CSS te lo encuentres una y otra vez.

Eso mismo me pasó ayer, cuando me lo reencontré mientras trataba de dar con una salida a un pequeño conflicto en un div con todos los elementos interiores “flotados” (y no es la primera vez que me pasa y encuentro la misma solución pero no llamé “la mala memoria” a esta página por nada).

Por lo general, cuando todos los elementos interiores de un div están flotados, el div no calcula por si solo la altura del mayor de sus elementos internos sino que colapsa a la altura del mayor de los elementos con una altura definida o bien desaparece por completo si ninguno tiene una altura declarada en CSS. La solución es muy sencilla, es suficiente con aplicar un overflow:auto al div superior para que este reaparezca en todo su esplendor. Obviamente no nos sirve si necesitamos que ese overflow tenga otro valor por alguna razón pero en la mayor parte de los casos es un muy buen recurso.

El artículo original que os enlacé al principio nos ofrece una buena introducción a los “floats” que es una de las herramientas más versátiles del CSS y a la vez una de las que más dolores de cabeza da si no se entiende bien.

Texturas y pinceles “grunge”

Publicado el 18 de Mayo (2009)

Archivado en ,

Ningún comentario

En Web Design Ledger han publicado un recopilación de texturas y pinceles para photoshop de estilo “grunge”. Este tipo de texturas suelen ser muy prácticas a la hora de dar profundidad y añadir un toque orgánico a los diseños. No sólo sirven como muy buenos fondos de imagen sino que, jugando con los modos de fusión y las opacidades, podemos mejorar con multitud de pequeños detalles diseños que de otra forma hubieran resultado planos.

Instalando Drupal

Publicado el 4 de Mayo (2009)

Archivado en ,

Ningún comentario

Después de haber dedicado unos cuantos meses a experimentar con Wordpress era hora de empezar a “jugar” con otros sistemas de gestión de contenidos y tras consultas diversas, he decidido que el afortunado ganador será Drupal (la otra opción era Joomla pero algunos programadores me han aconsejado este por ser más completo aunque seguro que hay opiniones para todos los gustos). Como los experimentos salen mejor con gaseosa he hecho una instalación de XAMPP en local (ya tenía una sobre Windows pero, puestos a experimentar, he decidido hacer esta sobre Ubuntu que es igual de sencilla aunque haya que arrancarlo desde el Terminal).

Instalar Drupal es bastante fácil. Una vez bajado de la web y descomprimido en la carpeta htdocs de nuestra instalación de XAMPP lo primero que tenemos que hacer, una vez accedemos en el navegador a la página http://localhost(o el dominio en que lo hayamos instalado)/drupal, es decidir si lo instalamos en inglés o preferimos tenerlo en español. La instalación nos ofrece directamente un enlace a la página de traducciones de Drupal así que nos bajamos el paquete para el español (o el idioma que nos interese), lo descomprimimos dentro de la carpeta donde habíamos descomprimido ya Drupal al principio (el paquete de idiomas trae archivos que van a varias carpetas distintas así que habrá que combinarlas, no “machacarlas”) y la propia instalación nos da el enlace para elegir entre los distintos idiomas accesibles. Si lo hemos hecho bien aparecerá el español y podremos seguir adelante.

En mi caso el primer problema tenía que ver con los permisos de lectura/escritura. Linux es algo más estricto que Windows en este aspecto así que he tenido que cambiar los permisos de las carpetas afectadas para poder seguir además de crear un archivo settings.php copia del default.settings.php que encontramos en la carpeta sites/default de la instalación. Ojo con no eliminar el archivo original, tendremos que tener los dos archivos con un contenido idéntico en esa carpeta.

Al contrario que Wordpress, Drupal no genera su propia base de datos y nos pedirá un nombre, usuario y contraseña antes de seguir así que tendremos que acceder a phpMyAdmin y crear la nuestra propia base de datos simplemente dándole un nombre que consideremos adecuado. Una vez que le hayamos pasado al instalador de Drupal estos datos el proceso de instalación sigue solo. Nos advertirá de que volvamos a cambiar los permisos de acceso a la carpeta defaults una vez que ha hecho los cambios pertinentes y nos pedirá que demos un nombre para el sitio, una cuenta de correo válida, un nombre de usuario y una contraseña. Ese usuario será nuestro superadministrador con acceso a todos los entresijos de Drupal.

Poca cosa más, definir la hora del servidor, marcar si tenemos disponible el sistema de URLs “limpias” (bastante práctico de cara a los programas de indexación de buscadores tipo Google) y si queremos que nos informen automáticamente de las actualizaciones del sistema. Con eso habremos terminado de instalar Drupal. Este primer paso no ha dado demasiada guerra, veremos los siguientes.


« Más recientes Más antiguas »


Diseño y desarrollo de Marcos Pérez Castell, 2009

Realizado sobre Wordpress 2.7