Foros del Web » Creando para Internet » Diseño web »

Cómo iniciar el desarrollo gráfico de un sitio?

Estas en el tema de Cómo iniciar el desarrollo gráfico de un sitio? en el foro de Diseño web en Foros del Web. Hola a todos, me gustaría si brevemente me pueden indicar cómo hacen para desarrollar gráficamente un sitio. Es decir, una vez que el sitio armado, ...
  #1 (permalink)  
Antiguo 18/03/2007, 10:47
 
Fecha de Ingreso: octubre-2005
Mensajes: 607
Antigüedad: 12 años, 1 mes
Puntos: 7
Cómo iniciar el desarrollo gráfico de un sitio?

Hola a todos, me gustaría si brevemente me pueden indicar cómo hacen para desarrollar gráficamente un sitio.

Es decir, una vez que el sitio armado, diferentes gráficos ubicados en celdas contiguas se entrelazan para dar un aspecto de uniformidad al sitio, y evitar que parezca demasiado "cuadrado".

Ahora bien, cómo hacen ustedes? Primero diseñan un bosquejo gráfico y luego de ahí cortan y arman imágenes pequeñas que luego serán usadas en las celdas del sitio?

Como para tener un ejemplo pego una imagen de un sitio ya diseñado:

  #2 (permalink)  
Antiguo 18/03/2007, 10:54
Avatar de fer10  
Fecha de Ingreso: octubre-2005
Ubicación: Guadalajara - Mexico
Mensajes: 905
Antigüedad: 12 años, 2 meses
Puntos: 3
Re: Cómo iniciar el desarrollo gráfico de un sitio?

hola, yo no soy diseñador pero consco unos que hacen bosquejos, y principalmente antes de comenzar con el diseño es necesario conocer el punto de vista del cliente para saber que tipo de imagen quiere dar, depues que es lo que necesita de la pagina (para saber las secciones que quieres colocar y a donde) cuales se repite en todas las paginas, cuales no .. etc.. y el diseño se implementa a partir de esas necesidades.

__________________
Saludos
FT.
www.fernando.com.mx
  #3 (permalink)  
Antiguo 18/03/2007, 11:45
 
Fecha de Ingreso: octubre-2005
Mensajes: 607
Antigüedad: 12 años, 1 mes
Puntos: 7
Re: Cómo iniciar el desarrollo gráfico de un sitio?

Ya veo, y problablemente se use también el apoyo de programas como Fireworks no?

"Dividir y exportar componentes de páginas.

Divida un diseño de página de Fireworks y exporte a un editor HTML la página entera o divisiones seleccionadas de la misma (incluidos gráficos, formatos HTML y el código para los efectos rollover), al igual que con Dreamweaver o Microsoft FrontPage). "
  #4 (permalink)  
Antiguo 18/03/2007, 17:47
 
Fecha de Ingreso: noviembre-2006
Ubicación: Argentina
Mensajes: 28
Antigüedad: 11 años
Puntos: 1
Re: Cómo iniciar el desarrollo gráfico de un sitio?

Hola gmansi

Cuando me dispongo a desarrollar un sitio web, empiezo por hacer el PLANEAMIENTO, donde defino los objetivos, la audiencia y los requisitos. Seguidamente elaboro un mapa del sitio, donde se reflejarán las secciones del sitio y a partir de esto creo los wireframes los cuales son esquemas que muestran la estructura de navegación y la disposición de los contenidos, estos representan una guía de como debería quedar el sitio web.

Teniendo bien claro todo lo visto en el planeamiento, a partir de los wireframes empiezo por definir el aspecto visual del sitio, es decir, entro a la etapa de DISEÑO donde se deben de tener en cuenta temas como tipografìa, teoría de colores, etc. Para el diseño utilizarías una herramienta gráfica como Photoshop o Gimp, al final tendrás como resultado un boceto, nada de código aún.

Continuando con el proceso entraría en la etapa de pasar el boceto a código, la CODIFICACION, de tal manera que pueda ser visualizado en un navegador web. Empiezo cortando el boceto para de esta forma obtener las imágenes necesarias, yo utilizo el Image Ready para esta tarea.
Un principio fundamental que sigo para escribir código es separar mi código en tres capas:

Estructura - XHTML
Apariencia - CSS
Comportamiento - Javascript

De esta manera obtengo un código limpio y de fácil mantenimiento. Otra cosa muy importante durante la etapa de codificación es que debes guiarte según los estándares establecidos por el W3C y no codificar para que se vea sólo en un navegador, sino en todos. Firefox, Opera y Safari son los navegadores que se apegan más a los estándares, por esto primero verifico que mi diseño se vea bien en Firefox y para el caso de Internet Explorer, que siempre es una joda, utilizo los comentarios condicionales para IE en CSS para arreglar los problemas de este jodido navegador.

El proceso continúa...

Saludos.

Javier Guerrero

Última edición por JavierGuerrero; 18/03/2007 a las 18:06
  #5 (permalink)  
Antiguo 18/03/2007, 19:21
 
Fecha de Ingreso: octubre-2005
Mensajes: 607
Antigüedad: 12 años, 1 mes
Puntos: 7
Re: Cómo iniciar el desarrollo gráfico de un sitio?

Javier, muy interesante tu aporte, das lineamientos generales para tener en cuenta.

Si más adelante sigues desarrollando el tema podemos reunir tus post y agruparlos luego en uno solo.

Muchas gracias.
  #6 (permalink)  
Antiguo 18/03/2007, 21:09
Avatar de juaniquillo
Colaborador
 
Fecha de Ingreso: noviembre-2005
Ubicación: San Juan, Puerto Rico
Mensajes: 5.745
Antigüedad: 12 años
Puntos: 281
Re: Cómo iniciar el desarrollo gráfico de un sitio?

Siguiendo con lo que dijo JavierGuerrero, después de tener el diseño listo, trato de ver en que caso voy a usar (x)html y css, y que en caso utilizaré imágenes. Mientras menos imágenes uses mejor, ya que la página cargará mas rápido, así que yo intento usar recursos html lo más posible.
Después empiezo a hacer el html de lo general a lo particular, osea, que empiezo por lo más amplio y después hago los detalles.
__________________
Por fin.. tengo algo parecido a un blog
Y por lo visto ya estoy escribiendo...
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:34.