Quiero hacer una web: primeros pasos

por , el 11 de Octubre de 2012, Internet

Soy diseñador web desde los 13 o 14 años cuando comencé usando el Frontpage para jugar haciendo una web de Dragon Ball Z. Lo primero que había que hacer, obvio, era recopilar toda la información y decidir cómo ibamos a agruparla en secciones. En esa web de Dragon Ball, recuerdo haberle pueso una guía de capitulos, las historia escrita por mi mismo, una galería de imagenes, fancfictions y unas cuantas cosillas más.

La mejor forma que se me ocurrió para empezar a diseñar un sitio web, era recopilando gifs animados (había uno muy famoso que era el de las antorchas hechando fuego) buscandolos en Google, lo cual en esa época era un truco...¡NADIE sabia buscar imagenes en Google!.

Luego que tenía los gifs, buscaba una buena imagen que iba a terminar repitiéndose horizontal y verticalmente, sobre un fondo, que casi siempre era negro.

Finalmente, escogíamos la tipografía: la famosa Comic Sans, que usaba para titulares con colores verdes fluor, o rojos para llamar la atención sobre el fondo rojo. Al costado de los titulares le ponía las dos antorchitas flameando y ya tenía mi homepage.

Una vez que teníamos el sitio, lo que hacíamos era entrar a geocities.com y alli subiamos mediante un FTP uploader en html, que casi nunca tenían forma rápida de subir muchos archivos a la vez...entonces había que subir de 5 archivos por vez, y a veces nuestras páginas tenían cientos y cientos de archivos! Un buen día, a Geocities y los demás hostings gratuitos empezaron a aggionarse, y ya te brindaban los datos del FTP para que pudieras usar tu propio gestor.

Y cuando ya tenias todo subido al servidor, te dabas cuenta que las URLS que te proporcionaban eran muy muy largas...como por ejemplo: members.geocities.com/tu_usuario.

Asi que me pasaba horas buscando algun redireccionador que me achique un poco ma URL. Recuerdo el más conocido de esa época: .tk. Entonces te conseguías tu-dominio.tk y ya era todo más simple.

Bien...a pesar de que esta metodología es antigua, podemos destacar pasos muy puntuales a la hora de decidir empezar a diseñar un sitio web:

  • 1. Recopilar TODA la información necesaria (textos, fotos, logos, etc.)
  • 2. Conseguir un hosting.
  • 3. Conseguir el dominio.

Una vez que tenemos todos estos pasos ya podemos empezar a armar nuestra página web.

1. Diseñando el sitio

Lo primero que les cuesta entender a los que no están en web, es que todos los diseños de páginas empiezan siendo un bosquejo...una idea. Muchos diseñadores usan lápiz y papel para comenzar a diagramar el sitio...pero no es del todo necesario. Lo que hay que entender es que primero hay que diseñar la parte gráfica del sitio. Para esto yo recomiendo usar Adobe Photoshop.

Una vez abierto el Photoshop, tenemos que tener en cuenta algunas pautas pequeñas antes de empezar el proceso creativo. Estas pautas son simples pero hay que aprenderlas y aplicarlas siempre. Resolución y colores.

Generalmente diseñamos sitios que se puedan ver sin problemas a partir de 1024x768 (ya casi nadie usa 800x600). Entonces teniendo esto en cuenta, tenemos que saber que si creamos un canvas de más de 1024, luego nuestra web no entrará en la pantalla (en resoluciones de 1024x768). Creamos un canvas de 1000px, porque tenemos en cuenta el tamaño de la barra de scroll que aparecerá cuando la web empiece a crecer en contenido verticalmente. De alto, le ponemos lo que querramos, dependiendo de cuanta información tendremos en la template que estamos diseñando.

Los dpi, podemos dejarlos en 72p, porque no necesitamos más que eso para la web.

Una vez que ya tenemos un canvas de 1000 x 1000 px (por ejemplo), el otro factor a tener en cuenta, es diseñar en RGB (nunca en CMYK), porque se trata de un para ver en pantalla. (que significa Red-green-blue) son los 3 colores primarios que componen la luz blanca que nos llega del sol. Siempre que se trata de ver algo en pantalla, se usa RGB...a diferencia de cuando hay que imprimir los documentos, que se usa el CMYK (que significa cyan-magenta-yellow-black) y un dpi de 300.

Una vez que ya tenemos nuestro canvas creado y nuestro color seteado...deberíamos ver nuestro Photoshop asi:

Una vez que ya tienes esto creado, dependerá de tu creatividad y de tus conocimientos sobre photoshop...de eso dependerá el resultado. Si no sabes usar el , eso ya es otro tutorial...y si no te consideras una persona creativa, hay muchas formas de explotar tu creatividad...solo necesitas practicar...quizás tomando algun curso de dibujo, o estudiando un poco de diseño gráfico para tener en cuenta las tipografías y combinaciones de colores, puedas desarrollar tu lado creativo!

Cuando estudias dibujo, lo primero que haces es copiar retratos de personas, paisajes, animales, etc. Porque no puedes crear sin antes haber copiado algo. Asi que mi recomendación es: escoge unos dos o tres que te gusten mucho, y empieza a ver si puedes reproducirlos en tu Photoshop. Este será el primer paso para lograr tu propia creación!

Aqui va una imagen de cómo se podría comenzar a diseñar un sitio:

Cuando ya hayan practicado bastante, y hayan diseñado algunos buenos sitios, ya tendrán más experiencia y podrán empezar a concentrarse en otros temas. Ya no será necesario crear un canvas de 1000px x 1000px, podrán crear uno más ancho para diseñar el fondo que tendrá el sitio, y luego marcar con la regla los limites de la misma.

Dentro de poco les prometo el segundo paso: cortar el diseño.

Aqui una última foto de una web diseñada en photoshop, en proceso.

Desarrollo de la web de Fernando Molinari

Si quieren ver como quedó la final, armada: www.fernandomolinari.com.ar

Juan Manuel Bosi

Diseñador

Tags: , ,

  • Te gusta este artículo?
  • 2
  • 0

Artículos relacionados

Opiniones sobre este artículo

No hay comentarios

Tu opinión sobre este artículo

  • Título de tu opinión
  • Tu opinión:
  • Por favor, introduce tus datos para poder enviar el comentario.