
Comenzamos una serie de tutoriales para crear tu primera plantilla para Joomla y WordPress. desde su diseño estático con Photoshop y su codificación en xHTML y CSS utilizando el Framework 960 Grid System hasta la implementación en Joomla 1.5.
Para este primer ejemplo crearemos una plantilla lo más sencilla posible que sirva de excusa para la posterior codificación e implementación como plantilla de Joomla.
Este primer tutorial aborda conceptos muy básicos de Photoshop, por lo que está recomendado para los que se inician con este Programa, utilizaremos la versión CS4 pero para seguir el tutorial podréis disponer de versiones anteriores.
Estas son las partes del tutorial:
- Parte 1: Diseño Estático
- Parte 2: Codificación xHTML/CSS (proximamente…)
- Parte 3: Implementación en Joomla 1.5 (proximamente…)
- Parte 4: Implementación en WordPress (proximamente…)
(más…)
Agrupado en: CSS, Diseño Web, Joomla by Miguel Puig
17 Comentarios »

Entrevistador: Adrián Rodríguez Mira.
Entrevistado: Miguel Puig García.
- Alumno de 2º de Diseño y Nuevas Tecnologías de la Escuela Superior Marcelo Macías. Amante de la fotografía, el cine, la música y el diseño gráfico. Con tan solo 22 años ya tiene una larga lista de premios en diseño web y una notable experiencia. Este es el perfil de Miguel Puig, un joven valor del diseño gráfico gallego.
(más…)
Agrupado en: Actualidad, Diseño Gráfico, Diseño Web, Entrevistas by Miguel Puig
Sin Comentarios »

AnythingSlider es un plugin basado en jQuery bastante personalizable, podrás:
- Cada slide es contenido HTML (imágenes, texto…)
- Con flechas de botones de siguiente y anterior.
- Enlace a los distintos slides
- Posibilidad de modificar el tipo de animación
- etc…
Demo
AnythingSlider jQuery Plugin
Descargar (500kb)
Agrupado en: Diseño Web, javascript by Miguel Puig
Sin Comentarios »

A mi modo de ver las cosas uno de los elementos principales a la hora de diseñar una página web es la elección de la tipografía. Existen ciertas reglas a la hora de usar una u otra en cuanto a legibilidad y aspecto.
Las fontstacks (conjunto de fuentes) son cada librería tipográfica que insertamos en los elementos de una Web mediante la propiedad CSS “font-family”. En grandes rasgos se dividen en fuentes serif (con adornos) o sans-serif (sin adornos o de palo seco), un ejemplo de serif es la “Times New Roman” y sans serif la “Helvética”.
En el siguiente enlace podremos ver las más usadas en cada sistema operativo y las más apropiadas para aplicar tanto en los párrafos como en los encabezados
Enlace:
Build better CSS font stacks
Agrupado en: CSS, Diseño Web by Miguel Puig
Sin Comentarios »

La gente de Smashing Magazine realiza una serie de lecciones sobre el Diseño Gráfico Suizo, el cual tuvo su apogeo a partir de la década de los 60. La recopilación se enfoca en el Diseño Web actual, estudiando las formas, las rejillas, los espacios en blanco…
Enlace: Lessons From Swiss Style Graphic Design
Agrupado en: Actualidad, Diseño Gráfico, Diseño Web by Miguel Puig
1 Comentario »

Si buscas alguna imágen de fondo para tu web, ava7 patterns, te va a gustar se trata de una web de más de 1000 fondos de pantalla para descargar, puedes ordenarlos a su vez po colores, formas, los más comentados, más descargados y mejor votados.
Sitio Web
Agrupado en: Diseño Web, Patterns by Miguel Puig
Sin Comentarios »

Interesante efecto el recogido de hv-designs.co.uk que utiliza jQuery para hacer un fundido fade-in fade-out. Proximamente publicaré más recursos de esta librería javascript.
Ver Demostración
Ver tutorial
Descargar Archivos Fuente
Agrupado en: Diseño Web, Recursos, javascript by Miguel Puig
1 Comentario »

Styled Menus es una colección de menus en css para tus diseños.
Han sido testeados en IE6, IE7, Firefox, Opera, Safari y Chrome.
Más info: http://www.styledmenus.com/
Agrupado en: CSS, Diseño Web, Recursos by Miguel Puig
Sin Comentarios »

Via Intenta
File Thingie es un administrador de archivos en web escrito en PHP. Muy práctico para proveer de acceso a parte de un servidor sin necesidad de un servicio FTP. Sus características principales son:
- Sencillo, sólo un fichero.
- Upload de múltiples ficheros a la vez.
- Múltiples usuarios y grupos de usuarios.
- Crear subdirectorios.
- Renombrar, mover, borrar y copiar ficheros y carpetas.
- Búsqueda por nombres de ficheros y carpetas.
- Control de acceso basado en listas negras o blancas.
- Editar ficheros de texto.
- Descomprimir ficheros zip sin necesidad de descargarlos.
- Fácil personalización basada en CSS
- Multilenguaje.
Web: filethingie
Descarga: filethingie
Demo: filethingie
Agrupado en: Diseño Web, PHP, mySql by Miguel Puig
Sin Comentarios »

Via Sentido Web:
Interesante hoja de trucos para evitar SQL Injection en nuestras aplicaciones. La explicación es bastante intensa y no solo se centra en MySQL sino en otros motores como Microsoft SQL Server, ORACLE y PostgreSQL, aunque para estos últimas son pocos los consejos.
Ver documento (ferruh.mavituna.com)
Agrupado en: Diseño Web, mySql by Miguel Puig
Sin Comentarios »

Malo es un pequeño CSS framework (0,25 kb comprimido) para crear la estructura base de un sitio web pequeño/medio
Es una derivación del Emastic CSS Framework
Malo tiene dos partes:
- Reseteo básico
- Sistema de rejilla
Es ideal para el que no quiera complicarse con un framework grande.
Más información (code.google)
Agrupado en: CSS, Diseño Web, Recursos, framework by Miguel Puig
Sin Comentarios »

OpenCart es una robusta solución e-Comerce basada en PHP, facil de usar y muy completa.
Podeis ver una demo del funcionamiento del front-end y del back-end (Username: demo / Password: demo).
http://www.opencart.com/
Descargar (openCart)
Agrupado en: Diseño Web, PHP by Miguel Puig
Sin Comentarios »

De Facto(Nottingham) son los responsables de la última campaña para Fred Perry. La compañía también actualizó su sitio con nuevas sorpresas.
Agrupado en: Actualidad, Diseño Gráfico, Diseño Web by Miguel Puig
Sin Comentarios »

Via dragonartz me encuentro con esta colección de 94 fondos en formato.png para usar en presentaciones, páginas web… Con una resolución de 4167×4167 px.
Descargar (Rapidshare)
Descargar (Depositfiles)
Agrupado en: Diseño Web, Recursos by Miguel Puig
2 Comentarios »

En formato .png Con estilo limpio y moderno. Vamos muy a lo que muchos llaman “estilo 2.0″.
Agrupado en: Diseño Web, Recursos, iconos by Miguel Puig
Sin Comentarios »

Esta nueva aplicación web será la delicia de los desarrolladores web, con ella podrás crear via web menus personalizados en CSS e integrarlos facilmente en tus proyectos.
Agrupado en: CSS, Diseño Web, Recursos by Miguel Puig
Sin Comentarios »

Set de 18 iconos en formato .png listos para usar en tu web/blog, consiten en imágenes de las aplicaciones web más usadas como facebook, flickr…
Están disponibles en 4 tamaños 62×62, 48×48, 32×32 y 24×24. Pueden ser usados tanto en proyectos personales como comerciales.
Enlace: webtoolkit4.me
Agrupado en: Diseño Web, Recursos, iconos by Miguel Puig
3 Comentarios »

BarackSlideshow es un script con que crea una interfaz simple para pases de imágenes mediante javascript. Está inspirado en el de la web de la conocida web de Barack Obama prueba la demo de funcionamiento. Solo son 30 lineas de código.
Agrupado en: Diseño Web, javascript by Miguel Puig
Sin Comentarios »

CSS Decorative Gallery. Tutorial de CSS con el cual podrás decorar tus imágenes sin editarlas en Photoshop, Todo lo que necesitas es una etiqueta <span> extra y aplicársela a la imagen de fondo para crear el efecto.
Este truco funciona con cualquier imagen de cualquier tamaño.
Via: visual-blast.com
Agrupado en: CSS, Diseño Web, Tutoriales by Miguel Puig
5 Comentarios »

Reciente entrevista la que me realizaron para la escuela Marcelo Macías. La podeis ver en el siguiente enlace:
entrevista miguel puig
Agrupado en: Actualidad, Diseño Gráfico, Diseño Web by Miguel Puig
Sin Comentarios »

JavaScript Form Validation es un script muy ligero que crea un pequeño tooltip a la hora de validar los campos del formulario. Es tan facil como llamar a la función inlineMsg() cuando quieras mostrar el mensaje.
Está testeado en IE6/IE7/IE8, Firefox, Opera y Safari.
via: visual-blast media
Agrupado en: Diseño Web, Recursos, javascript, scripts by Miguel Puig
Sin Comentarios »