MODULO 5 - CURSO DE DISEÑO DE PÁGINAS WEB

En este modulo veremos un poco acerca de la Investigación de Proyectos Web, Estructura y Organización de una página web

Tipos y Categorías de una página web
Que Necesito para tener una pagina en Internet
Como empezar a diseñar nuestra pagina
Introducción a la Investigación de Proyectos Web
Evaluación

Antes de diseñar y desarrollar una página web, debemos tener muy claro el tipo de diseño que queremos hacer. Por ejemplo: si nuestra empresa vende productos, nuestra página debe ser de tipo catalogo virtual. Si nuestra empresa ofrece servicios, la página debe ser de tipo profesional.

PRIMER TIPO:
Informativas (Sencillas)

Este tipo de páginas es el más utilizado ya que es el más sencillo de realizar. En este tipo de páginas, solo se muestran información de la empresa: Quienes Somos, Mision, Visión, Historia, Servicios, Productos, Noticias, Eventos, Contacto, etc.

Estas páginas no tienen aplicaciones web avanzadas, pero si debe tiene una aplicación sencilla para la parte de contacto, en la cual, además de mostrar la información de la ubicación, emails y teléfonos de la empresa, debemos tener un formulario de contacto en el cual, el visitante puede enviarles un mensaje instantáneo de una forma muy sencilla y fácil.

Miremos un ejemplo de este tipo de páginas web:

La página principal es la más importante y a la que debemos diseñar con mucho cuidado. Debemos utilizar un diseño muy cómodo y ligero, que no pese demasiado (Imágenes y/o animaciones de bajo peso) y su contenido debe ser muy resumido pero con la información necesaria, Es decir: La página principal debe tener resumido toda la información importante de la página web (Productos, Noticias, Eventos, Mensaje de Bienvenida, etc. con pequeños párrafos e imágenes si es necesario.

Cuando una persona ingresa a un sitio web, lo primero que hace es mirar en la página principal, si está lo que él necesita. Si no ve nada relacionado con lo que está buscando, cierra la página y va hacia otra. Por tal razón, es que es de gran importancia el contenido de la página principal. En la imagen de arriba, se observa que la página principal tiene: Mensaje de Bienvenida, Noticias, Servicios y Productos.

Las páginas secundarias son más fáciles de diseñar, ya que utilizan un mismo mismo estilo para todas. Muchos diseñadores utilizan el mismo estilo de la página principal, para las páginas secundarias como lo podemos observar en la imagen de arriba, en la que el contenido de abajo, es el que cambia, El banner y pie de página son los mismos de la página principal.

SEGUNDO TIPO:
Negocios - Profesionales

Este tipo de páginas web combina el primer tipo de diseño (informativas) con aplicaciones web básicas y avanzadas. Un ejemplo de estas aplicaciones y el más utilizado por este tipo de páginas son las cotizaciones en-línea, en donde la persona llena un formulario, éste se almacena en una base de datos y se le responde por cualquier vía de contacto que el visitante ingresó en el formulario (Email, Teléfono, Celular, etc).

También se puede realizar una cotización personalizada automática, en donde el cliente puede seleccionar las opciones que necesita de un producto o servicio, y automáticamente puede ver el valor total final. luego de agregar todas las opciones, el sistema le pide los datos, los cuales se almacenan en la base de datos con toda la información que el visitante ingresó en el formulario.

Veamos un ejemplo de este tipo de aplicaciones web:

En este ejemplo, la persona que ingresa a la página de un hotel, registra sus datos en la base de datos del hotel para realizar una reserva.

El administrador del sitio, ingresa a la aplicación y tiene varias herramientas (Ver Reservas, Estadísticas de Reservas, Opciones y Salir)

Aplicaciones parecidas se pueden utilizar para capturar la información del visitante como: registro para recibir noticias de un producto, registros para promociones, libros de visita, etc.

TERCER TIPO:
Portales

Estas páginas son muy complejas y tienen aplicaciones web avanzadas: manejo de grandes cantidades de información y contenido, manejo de clientes, etc.

Normalmente utilizan administradores de contenido para actualizar la página web. Estos administradores de contenido son aplicaciones avanzadas que almacenan el contenido en una base de datos, que luego es consultada automáticamente por la página web y muestra el contenido actualizado. Estos administradores son muy fáciles de usar y son escalables ya que en grandes empresas, existen varios administradores de contenido, cada uno se encargará de una sección diferente.

Se dice que existen dos tipos de portales: Los portales Horizontales y los Portales Verticales. Si quieres saber un poco más hacerca de estos tipos de portales, has clic aquí.

Ejemplo de estos grandes portales son los más conocidos: Yahoo, AOL, etc.

Hay varias categorías para los portales y para las páginas web:

	Abogados		Finca Raíz
	Agencias de Viajes - Viajes		Floristerías - Flores
	Agencias Matrimoniales		Foros de Discusión
	Agricultura		Hoteles
	Amistades - Encuentros		Hospedaje Web
	Animales - Mascotas		Industriales
	Arquitectura		Internet
	Arte y Fotografía		Juegos
	Automóviles		Joyerías
	Belleza		Libros - Librerías
	Café - Restaurantes		Medicina
	Casinos		Militar
	Científicas		Diseño Interior - Muebles
	Clubes Nocturnos		Medicina
	Computación - Sistemas		Moda y Fashion
	Comunicaciones		Música
	Cultura y Sociedad		Negocios
	Deportes		Políticas
	Diseño Interior - Muebles		Portales
	Diseño de Exteriores		Paginas Personales
	ECommerce - Electrónica		Religiosas
	Educativas - Educación		Regalos
	Eventos y Entretenimiento		Supermercados
	Familiares		Viajes - Agencias de Viajes
	Transporte

Para tener una página web en internet y que pueda ser accedida y navegada, debemos tener dos cosas importantes:

Servidor de Hosting o un servicio de alojamiento de páginas web
El servidor hosting o servicio de alojamiento de páginas web es un computador o servidor que está conectado a las redes de internet a una velocidad muy alta, en donde se alojan todos los archivos de nuestra página web (html, imágenes, documentos, etc.) para poder visualizarlos.

Un dominio
El dominio nos permite conectarnos al Servidor Hosting. El dominio es un conjunto de letras compuestas por un nombre y una extensión de dominio.

El nombre puede ser cualquiera, pero no podemos utilizar caracteres especiales, únicamente letras (a-z) exceptuando la ñ, números (0-9) y algunos caracteres como el guión (-). El tamaño del nombre solo puede tener un máximo de 63 letras o números.

Existen los llamados subdominios los cuales, sirven para tener una página totalmente diferente de la principal, pero con el dominio de la página principal, en otras palabras, Podríamos tener un contenido totalmente diferente y que no depende de la página principal. Los subdominios se conocen como Dominios de Segundo Nivel.

Muchas otras empresas, crean subdominios para conectar su intranet a su página web. Un ejemplo de un subdominio podría ser: http://atletico.tuimagen.net, en donde atletico, es el subdominio

También estan los dominios de tercer nivel, en donde se crean subdominios de un subdominio, por ejemplo: http://mod1.redes.tuimagen.net. En donde Mod1 es el dominio de tercer nivel.

En el modulo 4, puedes configurar tu dominio y hosting totalmente gratis.

Lo primero que debemos hacer para iniciar a diseñar nuestra página web, es pensar en el tamaño de nuestra página web, el cual podemos medir con la cantidad de información que se tiene para construir el sitio, ejemplo: Quienes Somos, Misión, Visión, Valores, Productos, Servicios, Contactos, etc.

Si aún no entiendes como medir la cantidad de información, debes empezar a construir la página web del tipo informativa o sencilla, y después, le puedes ir agregando nuevas páginas o aplicaciones nuevas.

Organizar la estructura del Contenido

Esta es una parte fundamental para construir nuestro sitio web, y es la clave para decidir el tipo de página que debemos desarrollar, para empezar creamos una tabla en nuestro editor de textos o datos: excel, word, etc. de la siguiente forma:

En la tabla organizamos la estructura y dimensión de nuestra página web:

PRIMERA COLUMNA:
En la primera columna, enumeramos la cantidad de páginas que va a tener nuestro sitio web, en este ejemplo, la página va a tener un total de 8 páginas que son: 1 principal y 7 secundarias.

SEGUNDA COLUMNA:
Titulo de las páginas

TERCERA COLUMNA:
Contenido de la página (solo títulos)

CUARTA COLUMNA:
% Terminado

Trabajar con esta tabla es de gran ayuda, ya que nos permite observar el estado del total finalizado de nuestra página web. El valor total de terminado se toma del promedio de todos los porcentajes: se suman todos los porcentajes y se divide entre el total de número de páginas.

Esta tabla también nos sirve como la página que se conoce como MAPA DEL SITIO En la cual, nos muestra una tabla que contiene toda las páginas que componen el sitio, con sus respectivos enlaces y descripción.

Cuando Tengamos el TOTAL FINALIZADO DE LA PAGINA WEB hasta en un 85%, podremos empezar a diseñar nuestro sitio web. Si lográsemos llegar al 100% es mucho mejor y más fácil y rápido de trabajar.

Este tema es muy importante para empezar a organizar nuestra página web.

Lo que veremos a continuación, será esencial para el correcto diseño y desarrollo de una excelente página web, con un enfoque dirigido hacia el cliente deseado. La investigación de proyectos web nos permite organizar correctamente el tipo de diseño, el contenido y aplicaciones necesarias que debemos implementar en nuestra página web. La investigación comprende varios pasos:

1 Paso:
Contenido del Sitio Web.

En este paso debemos buscar y analizar todo el contenido que tenemos sobre la empresa a la cual vamos a realizar el diseño. Por Ejemplo: El manual de imagen, misión, visión, productos, servicios, tecnología, alianzas, clientes, etc.

De acuerdo al material contenido que se tenga de la empresa, se desarrolla la tabla de la estructura de la página web que está en la parte de Como empezar a diseñar nuestra página.

Si no se cuenta con material de la empresa, o no sabe que material se necesita para diseñar una página web. Le recomendamos que visite otras páginas que sean parecidas a su negocio y mire la información que ellos tengan. De esta forma, usted puede analizar, la información que su empresa necesite.

2. Paso:
Seleccionar el Tipo de Diseño

Luego de desarrollar la tabla, y de acuerdo a las necesidades del cliente, se pueden diseñar tres tipos de páginas web: Sencilla, Profesional, Portal.

Para saber cual de todas escoger, debemos tener en cuenta la cantidad de información que tenemos de la empresa: Si la empresa solamente tiene: Quienes Somos, Productos y Servicios; la página web debe diseñarse como una página web del Tipo 1 - Informativas o Sencillas; esto no significa que su diseño también sea sencillo, podríamos realizar un diseño muy profesional para una página sencilla.

Ideas para seleccionar el Tipo de Diseño:

De acuerdo a la tabla de la estructura, mire la cantidad de información requerida y las aplicaciones requeridas. Si la página requiere de aplicaciones web, entonces puede ir pensando en el segundo tipo (Profesionales). Si requiere manejar Bases de Datos, Usuarios, Contenido Dinámico, Aplicaciones Web Avanzadas, E-Commerce o Comercio Electrónico, entonces su página debe ser de tipo Portal.

3. Paso:
Seleccionar la Categoría de la Página

Todas las páginas estan categorizadas de acuerdo a su contenido, por ejemplo, si la empresa es una que vende celulares, la página estará en la categoría de Comunicaciones, Si la empresa es una Floristería, debe estar en la categoría de Floristería.

Para saber cuales son las categorías de las páginas web, debes ir a la sección de Tipos y Categorías de una página web.

4. Paso:
Dibujar un bosquejo de la página web

Este paso es muy importante también, ya que te permitirá imaginar como va a quedar tu página web según el contenido que tengas de la empresa, Por ejemplo:

BOSQUEJO DE LA PÁGINA PRINCIPAL

BOSQUEJO DE LAS PAGINAS SECUNDARIAS

Normalmente y por creatividad, uno diseña estos bosquejos a mano, en un papel en blanco cuadriculado, como una especie de borrador el cual nos servirá como guía.

En un módulo siguiente a éste, aprenderemos a utilizar el Macromedia Fireworks, como nuestro editor de imágenes, en donde diseñaremos el bosquejo y toda la página, para luego pasarla al Macromedia Dreamweaver.

Empezaremos a utilizar mientras tanto, el bosquejo que hemos hecho a mano, para empezar a desarrollar nuestra página web que veremos en el siguiente módulo.