Talleres de diseño web

Diversos artículos, eminentemente prácticos, sobre diseño web. Creación de imágenes y gifs animados, manejo de programas de diseño, prácticas sobre diversos temas para aprender a diseñar webs.

Si te parece útil este manual ayúdanos compartiendo!! :)

1.- Introducción a los talleres de diseño web

Qué hay en este manual, cómo está organizado y otras referencias útiles que encontraremos dentro de DesarrolloWeb.com

2.- El color en la web. Nociones básicas

Comenzamos una serie de capítulos en los que enseñamos que el uso del color es básico y decisivo a la hora de crear un sitio web.

3.- El color en la web. Esquemas de color

Para que un diseño web resulte atractivo es importante mantener cierta sensación de armonía.

4.- GIFs animados

Sabes realizar pequeñas animaciones GIF? Aqui encontraras los pasos para realizarlas.

5.- Definiciones de pantalla

En la web, hay que tener en cuenta que van a visitarnos muchos usuarios, con definiciones de pantalla distintas. Hay que hacer páginas que se visualicen bien en todos los casos. Veamos cómo.

6.- Páginas fluidas

Son las que sus dimensiones se adaptan al tamaño del navegador. Cuando usarlas y cuando no.

7.- Deshabilitar la barra de imágenes de Internet Explorer

En este breve tutorial veremos de que forma podemos desabilitar la barra que aparece en IExlorer 6 al situar el ratón sobre una imagen.

8.- Nuestro primer banner

Como diseñar nuestros banners para que sean atractivos y atrapen la atención

9.- El banner perfecto

Análisis del uso de banners como herramienta de comunicación. Consejos para mejorarlos y más documentación.

10.- Cómo montar vectorialmente una página web

Cómo podemos ayudarnos de un programa de diseño gráfico vectorial para definir el aspecto de una página web.

11.- Navegabilidad, un factor fundamental

Un sitio debe ser cómodo para el usuario, debe ser fácilmente navegable. El usuario tiene que poder ir de un lado a otro del sitio rápidamente y sin perderse.

12.- Creación de un menú desplegable en Dreamweaver

Explicación detallada sobre la creación de un menú desplegable en Dreamweaver, en el que poniendo el ratón en las diferentes opciones se muestran unas capas con opciones secundarias.

13.- Colores y hojas de estilo que ayudan

En este artículo podemos ver los colores y hojas de estilos que ayudan a los visitantes a navegar de una manera más fácil e intuitiva por un sitio web.

14.- Efecto de degradado en diferentes formatos gráficos

Una muestra de imágenes que presentan un degradado en los formatos gráficos GIF, JPEG y PNG. Para ver cuál de ellos es el mejor por peso y calidad de la imagen.

15.- La imagen como elemento dinamizador del diseño

Cómo una buena imagen, ya sea fotografía o ilustración, puede ser clave para la realización de un diseño impactante.

16.- Enlaces sin subrayado

Es muy sencillo quitar el feo subrayado que presentan los enlaces de una página web. Aprende como hacerlo por la via rápida y bien.

17.- 23 puntos a tener en cuenta en el diseño web

El diseño web es algo en lo que normalmente se suele invertir tiempo, dinero, imaginación…

18.- Cómo optimizar fotografías para la web

Consejos para optimizar fotografías para el web. Optimización de fotos sin perder calidad de la imagen.

19.- Retoca tus fotografías con Photoshop Express

Photoshop Express es un programa online de retoque fotográfico que te puede servir para retocar tus fotos directamente con tu navegador web.

20.- Combinar y trabajar con colores

Herramientas que nos ayudan a elegir una combinación de colores adecuada. Aplicaciones web para combinar colores y crear una paletas a utilizar en nuestros diseños web.

21.- Crear archivos PDF con OpenOffice

Cómo crear archivos PDF fácilmente con el editor de textos de OpenOffice.

22.- Incluir una imagen en miniatura de las webs con Thumbshots

Explicamos cómo integrar Thumbshots en tu página web, un servicio gratuito que te permite presentar previsualizaciones de las páginas con las que enlazas.

23.- Prueba tus páginas en todos los navegadores con BrowserLab

BrowserLab es un servicio online de Adobe que permite comprobar el aspecto que ofrecen las páginas web en los principales navegadores sin salir de un mismo espacio de trabajo.

24.- Vídeo: Caja de diálogo dinámica con Photoshop, CSS y jQuery

Videotutorial en el que creamos una interfaz de usuario dinámica, desde el diseño con Photoshop, su maquetación CSS y los dinamismos con Javascript y jQuery.

25.- Colecciones de iconos gratuitos

Algunos de los paquetes de iconos con los que me gusta trabajar, todos iconos gratuitos, aunque con distintas licencias para utilizar en otros proyectos web.

26.- Programas de retoque fotográfico recomendables si no quieres usar Photoshop

Un listado con opciones diversas de programas de retoque fotográfico y editores gráficos que podrían ser recomendables cuando por cualquier razón no quieres usar Photoshop.

27.- Colecciones de fuentes tipográficas

Conoce lo más representativo de las tipografías que hemos venido presentando en los últimos tiempos en DesarrolloWeb.com, en este artículo donde encontrarás fuentes tipográficas gratuitas para todos los gustos y necesidades.

28.- Diapositivas de la conferencia Diseño web para dispositivos móviles

Diapositivas o slides de la conferencia impartida en febrero de 2012, en México, sobre diseño web para dispositivos móviles.

29.- Webcast técnicas para convertir un diseño Photoshop a HTML

Qué es lo más importante que debes saber para convertir un diseño realizado en Photoshop a HTML y CSS, con tamaños relativos. Fórmula de Target / Context.

30.- Verde en el Diseño Web: conectando con la naturaleza

Usos del color verde en la Web y en los negocios en general, sensaciones que nos transmite y ejemplos de diseños que mediante el verde consiguen comunicar mejor la noción de marca.

31.- Tendencia de Diseño Web: Bloques de Color

Analizamos una de las más recientes tendencias en el mundo del diseño web: el uso de los bloques de color: sus distintas vertientes y cómo puede usarse debidamente la combinación de los colores más chillones.

32.- Cómo crear las mejores Paletas de color

Inspiración y creación de paletas de color, junto con diversas herramientas actuales que nos facilitarán la posibilidad de jugar y combinar con colores.

33.- Crear un fondo tipo patrón o mosaico con herramientas online

Claves para usar las herramientas online de Colourlovers y crear todo tipo de patrones con formas y mosaicos que se pueden usar como fondo para diseños web.

34.- Configurar el Apple Touch Icon en tu sitio

Vemos como configurar un sitio web para proveer el icono de acceso directo a la web en un iOS, el denominado Apple Touch Icon.

35.- ¿Cómo optimizar una imagen para la web con Photoshop?

Videotutorial que nos enseña a optimizar una imagen para subirla a nuestra página web usando el programa Photoshop.

36.- Conceptos de UX Design con Verónica Traynor

Entrevista con Verónica Traynor, especialista en diseño de experiencia de usuario con la que vamos a realizar un taller de final de semana dedicado a UX Desing.

37.- Ventajas de usar iconos mediante fuentes tipográficas

Explicamos por qué usar iconos basados en fonts, por medio de fuentes tipográficas, es una maravilla en todos los sentidos, junto con recursos destacados.

Descargas

Este manual puedes descargarlo en formato amigable para impresión y lectura en dispositivos a través de la App de DesarrolloWeb.com.

Compartir

Comentarios

fernando_chocobar

20/5/2009
NOT FOUND
no puedo descargar el manual, aparece que no está disponible. pueden solucionar el tema? y/o enviarlo a mi correo para descargar?
gracias.
atte.

midesweb

04/9/2009
Descarga del manual comprobada
Hola,

La descarga de este manual sobre diseño web está comprobada. Si te da problemas procura descargarla de nuevo con otro navegador. Pero lo que hay te aseguramos que funciona.
Si continúas teniendo problemas, escribenos un mensaje de asistencia técnica.

Saludos,

Miguel

mauro

01/10/2009
excelente
me parece super bueno esta pag, que nos enseña tantas cosas productivas...gracias

jasleyvi

15/7/2010
manual del curso
hola buena tarde, me gustaria saber como descargar el manual, ya estoy inscrita al curso y cuando voy a descargarlo me niega el servicio.
que debo hacer?
gracias
jasleyvi

midesweb

09/3/2011
repito... la descarga está comprobada
Si te falla, inténtalo de nuevo o descárgalo desde otro navegador, que no se descuentan más descargas que la primera. En último caso, escribe a asistencia a descargas. Por favor, que no se hagan comentarios en este manual de nuevo con el mismo tema, que no es la vía correcta para pedir asistencia.
Gracias!

consuelo_quesada_mayorga

20/5/2011
Manual sobre Talleres de diseño web
Me funcionan correctamente los links. Gracias por este aporte tan valioso.

midesweb

24/6/2011
Para descargar el manual práctico de diseño web
Hola,

Para descargar este manual tienes que estar registrada en DesarrolloWeb.com y pulsar sobre el enlace "descargar manual" que tienes en la columna de la derecha o el enlace que hay en el recuadro "Descargas" de la columna de la izquierda.
Tendrás que haber hecho "login" con tu usuario y contraseña de DesarrolloWeb.com para poder descargarlo. El enlace "login" está justo debajo de la cabecera.

emilio bokuy mongo

04/11/2011
mas informacion
hola, soy un joven que estudia el desarrollo web, me gustaria conocer a los que ya lo son en realidad para que puedan orientarme de como se trabaja en la web...
un saludo y os quiero conocer

Daniel1114

28/2/2012
curso a distancia
Quisiera saber si dan curso a distancia de diseño web? y el costo que lleva realizarlo

dalmirojgg

28/7/2017
zz Hosting Gratuito
hola muy buen manual.
todos mis trabajos de diseño web los subo aquí en ZZ Hosting Gratuito https://www.zz.com.ve/
funciona bien! ;)