Diseño de Páginas Web

Integrantes: - Esteban Soto O.

- Diego Menéndez

Modulo: 601

Carrera: Ingeniería de ejecución en informática

Profesora: Alejandra Carolina Navarro

Introducción

El diseño de un sitio web debe ser el producto de un esfuerzo colectivo

orientado al usuario. Esto significa que, de ser posible, el proceso de diseño debe
abarcar la participación de un grupo de representantes de las empresas u
organizaciones y sus beneficiarios con la meta en común de obtener la máxima
satisfacción de los usuarios.
Por lo tanto, el proceso de diseño debe concentrarse principalmente en el usuario y
llevarse a cabo en colaboración estrecha con un panel representativo de usuarios,
por ejemplo, en una sesión de "lluvia de ideas".

Lo más importante de un proyecto es la satisfacción del cliente en el termino

del mismo. Para ello realizamos un análisis y un estudio de los objetivos planteados
por el cliente. Con ello pretendemos ofrecer soluciones creativas y personalizas.
También se realiza un estudio del mercado para lograr captar las necesidades de los
potenciales visitantes o clientes en caso de tratarse de comercio electrónico (E-
commerce).
Se evalúan los requerimientos técnicos del proyecto, el material proporcionado y se
optimizan los recursos necesarios para su puesta en marcha, respetando en todo
momento los objetivos marcados inicialmente.

Con estos pasos conseguimos la facilidad de utilización de la plataforma y la

escalabilidad de la misma con los mínimos costes necesarios para el cliente.

Hasta hace muy poco tiempo el diseño de páginas Web exigía el

conocimiento de los códigos propios del lenguaje HTML, DHTML, y últimamente XML
que aunque no son excesivamente complejos, resultaban confusos y de difícil
manejo para un no especialista en tareas de programación informática. Sin embargo,
actualmente la utilización de este lenguaje de programación está al alcance de
cualquier usuario. Existen en el mercado distintos programas creados
específicamente para facilitar el diseño de websites. Son los llamados editores

La forma de crear páginas Web con estos programas es de forma visual,

los cambios que hacemos se ven sobre la marcha, prácticamente igual que lo verían
los usuarios cuando visiten nuestra página. Así, una tabla de 3 celdas por 2 filas la
vemos visualmente de esa forma, y no como un código de programación HTML.

1. Contacto inicial: Se toma una primera impresión de las necesidades

del cliente y se resuelven dudas sobre las posibles formas de enfocar el proyecto.

2. Preventa: Se definen los objetivos del proyecto con el cliente. Se

analizan los costes, las estimaciones de tiempo y se presenta presupuesto en firme.

3. Análisis: Se establecen las fases del proyectos y se decide la solución

tecnológica más oportuna (dominios, hosting, plataforma, hardware...etc.)

4. Diseño de la página Web: Se hacen diversas propuestas visuales que

cumplan las expectativas de clientes y sean acorde con la imagen que quiera dar.

• Estudio de viabilidad: Al diseñar un sitio web, también debe analizarse el

proyecto en términos de presupuesto y tiempo. El proyecto debe incluir
planificaciones a largo plazo, es decir, la organización debe prever los medios
necesarios para crear el sitio pero también para mantenerlo y actualizarlo. De esta
forma, si el sitio web no se actualiza regularmente, la imagen comercial de la
compañía puede verse perjudicada en lugar de beneficiarse. Durante esta etapa se
pueden volver a evaluar los objetivos iniciales y priorizarlos con el fin de elegir, en
base al presupuesto y las fechas límite, sólo aquellos que sean más importantes.
 5. Desarrollo de la página Web: Se desarrolla la programación del
proyecto. Se evalua el desarrollo del proyecto sobre la marcha. Esta fase suele
solaparse con la de diseño web.

• Alojamiento Web: Para que un sitio Web esté disponible las veinticuatro
horas de los siete días de la semana debe estar alojado en un servidor que esté
permanentemente conectado a Internet. Es posible, técnicamente hablando, que
pueda alojar su sitio web usted mismo, siempre que tenga un flujo ascendente de
ancho de banda veloz. Debido a que los visitantes de un sitio web suelen descargar
información, esto significa que el servidor principalmente envía páginas web o las
carga. Por esta razón, y para prestar a los visitantes un servicio de alta calidad, se
recomienda contratar los servicios de un host, es decir, una empresa que se dedica a
alojar páginas web en servidores especializados que están siempre conectados a
Internet con un ancho de banda de alta velocidad.

6. Control de calidad y aprobación final: Una vez finalizado el proyecto,

se establece un plazo de test para corregir errores y cargas de datos.

• Estudio del comportamiento: Estudiar el comportamiento de los

usuarios de Internet en un sitio web puede ser un indicador importante que puede
usarse para mejorar la calidad de un sitio web. En consecuencia, es interesante
saber de dónde vienen los visitantes y qué buscan. También puede ser muy útil
determinar por qué abandonan el sitio web.

7. Promocion y formación: Con la aprobación del proyecto por parte del

cliente y habiendo contratado este servicio, se da de alta la Web en los principales
buscadores con las palabras clave más adecuadas. Para ello se establece un estudio
de medios.
 •Seguimiento de la competencia: Un competidor nuevo en la Web que
ofrece mejor contenido o servicios sumamente innovadores puede alterar el mercado
de manera fácil y rápida. Para garantizar el mejor posicionamiento posible de un sitio
web se debe realizar siempre un seguimiento de la competencia y se debe idear una
tarjeta de puntuación con dispositivos para medir el tráfico, la popularidad y hasta las
ventas, en el caso de tratarse de un sitio web comercial.

• Página Web publicada en Internet: es fundamental que la web tenga

visitas (tráfico) para que esto genere negocio a su empresa. Se podría decir que el
posicionamiento web es la "visibilidad" de su página web. Cuanto más visible, más
tráfico y cuanto más tráfico, más negocio. Es importante que el tráfico de su web sea
de calidad. Es decir, que sean potenciales clientes y que cumplan con su público
objetivo.

8. Mantenimiento de la página web: Se administran los contenidos de la

Web bajo demanda del cliente y se envía un informe mensual sobre el estado de la
Web. Se hace un seguimiento de el posicionamiento de la misma en los principales
buscadores.

•Verificación de vínculos: A menudo los hipervínculos de los sitios web

se vuelven obsoletos. Dichos vínculos se llaman vínculos rotos. El riesgo de que se
rompa un vínculo es mayor cuando dirige a los usuarios a un sitio externo. Es
recomendable verificar regularmente la validez de los vínculos en su sitio web con
una herramienta automática (por ejemplo: Xenu's Sleuth).

Un proyecto de sitio web por lo general incluye los siguientes trabajos (una
persona puede realizar varios):
Trabajo Descripción
Director del Es la persona que, en la base del proyecto, se encarga de la gestión
proyecto general del mismo
Jefe de proyecto Es la persona que se encuentra en el centro del proyecto, y se encarga
multimedia de administrar los equipos técnicos (desarrolladores, arquitectos web,
etcétera).
Editor principal Es la persona encargada de establecer el contenido escrito del sitio web
(editor o editor de a fin de cubrir de la mejor manera las expectativas de los usuarios y
sección) aumentar el tráfico.
Periodista web Es la persona encargada de redactar el contenido. El trabajo de un
periodista web es muy similar al de un periodista tradicional.
Desarrollador Es la persona cuya tarea es diseñar y desarrollar las partes dinámicas de
(programador) un sitio web. Este trabajo técnico se basa en el trabajo que realiza el
jefe de proyecto multimedia.
Director de arte Es la persona encargada de coordinar las creaciones artísticas para
adaptar las ideas del cliente a la dimensión multimedia. El director de
arte debe supervisar a todos los equipos artísticos para garantizar la
armonía visual del sitio web.
Infografista Persona que diseña los elementos gráficos del sitio web (las
ilustraciones, los diagramas, los logotipos, etcétera).
Diseñador web (o a Es la persona encargada de diseñar la parte gráfica del sitio web.
veces trazador)
Integrador HTML Es la persona encargada de diseñar las páginas del sitio web y de
ponerlas en línea. Son quienes incorporan los artículos y elementos
gráficos en la página.
Ergonomista Es la persona encargada de diseñar una interfaz apta para maximizar la
funcionalidad del sitio y establecer la fidelización del usuario. Este
trabajo podría incluirse perfectamente en alguno de los otros títulos de
trabajo.
Administrador de En la mayoría de los casos, el host es quien provee al administrador de
red red. Sin embargo, si el sitio web está alojado dentro de las instalaciones
de la organización o está construido en una gran arquitectura de red, el
administrador de red se encargará de su correcta operación tanto en
términos de calidad de servicio como de seguridad.
Moderador (a veces Esta función es esencial para el sitio web. Su mayor objetivo es lograr
mod) el funcionamiento sin dificultades de los intercambios en los espacios
de discusión (foros, salas de Chat). La intervención de los moderadores
consiste en eliminar, modificar o mover mensajes contrarios a la ética
del sitio web y, por otra parte, guiar a los principiantes. El moderador
 Programa para la creación de nuestra página. Por ejemplo el Microsoft
Front Page XP que es potente y relativamente fácil de aprender (sobre todo si se
está familiarizado con los programas de Microsoft), ya que su interfaz (menús,
aspecto, funciones, etc.) es muy similar al Microsoft Word que prácticamente todo el
mundo conoce.

Programas para diseñar páginas web

• Amaya : Es el editor WYSIWYG gratuito del World Wide Web

Consortium (W3C), encargado de discutir y establecer nuevos
estándares para la web. El editor se parece mucho al IMS Web
Dwarf, con unas cuantas opciones más. Si bien aún no es del todo
profesional, es un programa que habrá que tener en cuenta en sus
futuras versiones, ya que entre otras cosas está previsto que tenga
soporte para dibujo vectorial en formato SVG.

• Arachnofilia : Programa sencillo y gratuito (freeware) para crear y

editar páginas Web. Colorea los códigos HTML, e inserta código
fácilmente con botones que podemos desplegar personalizando
nuestro interfaz. Muy difícil de usar para inexpertos en HTML,
aunque tiene la ventaja de que apenas consume recursos al
sistema (ocupa muy poco).

• 1st Page 2000 2.0. : Editor HTML práctico y fácil de usar.

Entre sus componentes es bueno destacar: tamaño automático de
imágenes, efecto rollover de JavaScript, limpieza de código,
 asistentes, cliente de FTP etc.
Pero lo más llamativo de este programa son sus añadidos como
son 450 scripts, 15 scripts DHTML, 6 scripts HTML así como 2
scripts CGI. También incorpora una guía sobre HTML y CSS, etc.
Pocas veces se da en el mundo del software internacional un caso
como el de 1st Page 2000. Este potente editor de código HTML
tiene todas las prestaciones de los mejores programas
profesionales del mercado y a un precio inmejorable, es gratuito.

• Namo Web 4.0.: programa muy potente y fácil de utilizar que está
en español, no es caro. También existe la versión 5.0 (en Inglés).Ya
está disponible (en inglés) la versión 6.0 altamente recomendable.

• Nvu: es un editor gráfico HTML similar al Front Page de Windows

que ha desarrollado LindowsOS. Nvu está basado en el código de
Mozilla Composer, es un programa tipo FrontPage/Dreamweaver,
WYSIWYG y que promete la cómoda creación de contenidos web
como con un procesador de textos.

En http://www.abcdatos.com/tutoriales/index.html es un sitio
que recopila enlaces a páginas de consulta y desde las que se pueden descargar
guías completas para estudiar como funcionan algunas de las aplicaciones más
populares. Podrás encontrar los mejores manuales para empezar el estudio del
diseño Web. Da la posibilidad de suscribirse a su lista de distribución para estar
informado sobre nuevos tutoriales.
 También hay numerosos tutoriales “on line” que enseñan a manejar
numerosas aplicaciones, por ejemplo en http://www.aulaclic.com puedes
encontrar cursos de calidad de los programas de MS-Office 2000.

Uno que se recomienda especialmente es el (Curso de autoformación en

contenidos de Internet) además cuenta con enlaces de descarga de varios
programas para su utilización (clientes de correo, FTP, navegadores, compresores,
antivirus, etc.).

Direcciones de interés
• lafacu.com cursos sobre Access, Unix, SQL, Java, FTP y
muchas aplicaciones informáticas donadas por estudiantes.

• Trucostecnicos.com Excelente servidor con tutoriales sobre

ASP, Bases de datos CGI, Chat, C, C++, Delphi, Diseño grafico, E-mail, Hardware,
Internet, Java & JavaScript, Ofimatica, Pascal, Perl, programacion, web, redes,
sistemas operativos, software, Visual Basic. También dispone de un directorio y una
lista de "Trucos técnicos".
 • Cybercursos.net Aquí puedes encontrar una recopilación de
los mejores manuales y tutoriales que puedes bajarte para leerlos off-line. Todos los
meses se agregan distintos archivos.

• Vigital.com Una increíble página supercompleta sobre el

diseño gráfico y de páginas Web.

Conclusión.

La creación de una página web y su puesta en Internet tiene muchos

beneficios para su empresa:

-Un nuevo y cada vez más usado canal para su empresa. Hoy en día se
hace inconcebible una empresa sin página web en Internet.

-Publicidad constante y 24h para su empresa, la cual puede actualizar en

tiempo real según sus necesidades.

-Su mercado potencial es global. Millones de personas conectadas en

todo el planeta pueden saber de sus existencia. La publicidad para llegar a estos
potenciales clientes le sería mucho más costosa que el propio diseño de sus páginas
Web.

-Mejora de las comunicaciones de su empresa y reducción de costes. Un

punto de encuentro con sus clientes y proveedores.

-Generación y potenciación de su imagen tanto para su clientes como para

su proveedores. Una Web diseñada y adecuada a su negocio mejorara su imagen
notablemente. Cada día aumenta más el número de personas que conocen
empresas por sus páginas Web. La primera impresión de su empresa hacia sus
clientes es su página Web. De todo esto se desprende la importancia de un buen
diseño de páginas Web.

-El uso de la Web por parte de su empresa mejorará la comunicación y

entre sus departamentos, sedes o delegados.

Lo más importante y beneficioso de tener su propia web es un aumento de

volumen de negocio y por tanto de ventas.

Recomendaciones

Es recomendable leer el monográfico Gratis en Internet que ofrece

Telépolis. Aparecen recopiladas las mejores "ofertas" on-line:

Páginas como estas hay muchas, solo se tiene que teclear en (Google)
como palabras clave recursos gratuitos y aparecerán miles.

Se aprende mucho navegando y viendo como están diseñadas páginas

que nos gustan.

También pueden ser muy útiles programas auxiliares como: Un capturador

de pantallas. Uno gratis y fácil de usar es “SNAG IT”.
 Se pueden hacer páginas Web utilizando softwares utilizados
comunmente como OpenOffice, Word, Publisher, Power Point, FrontPage Express,
Netscape Composser etc., los dos últimos son gratis y aparecen al instalar el
Microsoft Explorer y el Navigator respectivamente.

Una buena forma de empezar si queremos algo sencillo y sin muchas

pretensiones es la creación de blog, que son paginas web predeterminadas con
distintas plantillas y editor html que nos facilita su uso y aprendizaje. Además nos
ofrecen espacio gratuito, asistentes de muy fácil utilización para poner en la página,
contadores, libros de visitas, formularios y otros muchos recursos.

Hay programas que permiten hacer la página fácilmente pues traen

plantillas y asistentes que facilitan la creación, recientemente en
http://www.webfacil.com se puede encontrar uno de estos programas listo para ser
descargado gratis, pero en cualquier página de freeware se pueden encontrar más.