El documento describe el desarrollo de una aplicación web para una empresa de telecomunicaciones. Explica la estructura del sitio, interfaces gráficas, paleta de colores, tipografía y recursos gráficos. El objetivo principal es generar ganancias mediante la promoción de ofertas y servicios dirigidos a pequeñas y medianas empresas para mejorar su comunicación a través de redes inalámbricas.

1. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
Desarrollo de Aplicaciones Web
Integrantes del equipo:
Iván Calderón Torres
Ana Lizbeth Xochipa Justo
Felipe Hernandez Juarez
Miguel Angel Nieto Marcos
Rolando Garcia Maceda
Grado: 9 Grupo: “B”
1 Lic. Manuel Méndez Montero
Grado: 9 Grupo: “B”

2. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
Tabla de contenido
ALCANCE DEL SITIO ............................................................................................................................... 3
OBJETIVO DEL SITIO .............................................................................................................................. 3
MERCADO META ...................................................................................................................................... 3
DIAGRAMA DE NAVEGACIÓN ............................................................................................................... 4
ESTRUCTURA DEL SITIO ....................................................................................................................... 5
INTERFACES GRÁFICAS ........................................................................................................................ 6
Venta de Inicio ........................................................................................................................................ 6
Ventana Conócenos .............................................................................................................................. 7
Ventana Servicio .................................................................................................................................... 8
Venta Contáctanos................................................................................................................................. 9
PALETA DE COLORES .......................................................................................................................... 10
TIPOGRAFÍA ............................................................................................................................................ 12
¿Por qué es Times New Román es la fuente más utilizada? ................................................. 12
Las otras opciones disponibles ..................................................................................................... 12
Títulos................................................................................................................................................. 13
Subtítulos ........................................................................................................................................... 13
Contenido .......................................................................................................................................... 13
Link ..................................................................................................................................................... 13
RECURSOS GRÁFICOS ........................................................................................................................ 14
Banner Flash ......................................................................................................................................... 14
Formato de imagen .PNG ................................................................................................................... 14
Audio ...................................................................................................................................................... 14
Video ...................................................................................................................................................... 15
2

3. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
ALCANCE DEL SITIO
Mediante el sitio web los usuarios y clientes podrán consultar información
detallada y precisa sobre los productos, servicios, ofertas, paquetes. De tal manera que
sé sientan animados a adquirir de nuestros productos y servicios que les ofrece la
empresa R-FLIM Solutions en el área de las telecomunicaciones, diseño y puntos de
ventas, así mismo estar en contacto con nosotros por medio del sitio.
En el sitio los usuarios consultaran documentación del proyecto de una red
inalámbrica, entre otros servicios.
OBJETIVO DEL SITIO
El principal objetivo de sitio es generar ganancias a nuestra empresa, ya que por
medio de esta el usuario consultara ofertas, paquetes, etc., de tal manera que se sienta
impulsado a adquirirlos. Al igual que dar a conocer los productos y servicios que ofrece
la empresa R-FLIM Solutions enfocada en Diseñar e implementar redes que mejoren la
comunicación de las empresas.
MERCADO META
El proyecto esta dirigido hacia las micro, pequeñas y medianas empresas con el
fin de mejorar e innovar su comunicación mediante la implementación de redes
inalámbricas.
3

4. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
DIAGRAMA DE NAVEGACIÓN
HOME.HTML
INICIO.HTML CONOCENOS.HTML SERVICIOS.HTML CONTACTO.PHP
UBICACIÓN.HTML
4

5. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
ESTRUCTURA DEL SITIO
HOME.HTML
INICIO.HTML CONOCENOS.HTML SERVICIOS.HTML CONTACTO.PHP
UBICACIÓN.HTML
5

6. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
INTERFACES GRÁFICAS
Venta de Inicio
Como esta ventana es lo primero que ve el usuario al ingresar al sitio se
mostrarán algunas ofertas, paquetes, etc., con la finalidad que el mismo se vean
interesado y conozca mas de nuestras ofertas, de tal manera que compre nuestros
servicios.
Banner
600 pixeles
600 pixeles
800 pixeles
6

7. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
Ventana Conócenos
En este lugar se mostrara la información de nuestra empresa, el cual consta de
visión, misión, valores y objetivos
200 pixeles
200 pixeles
400 pixeles 400 pixeles
7

8. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
Ventana Servicio
En esta sección se darán a conocer los distintos servicios que como empresa
ofreceremos, instalación de antenas de telecomunicaciones, diseño de sitios web y
puntos de ventas. Al igual que se contara con una sección en la cual se mostraran
distintas ofertas y paquetes.
600 pixeles
400 pixeles 400 pixeles
8

9. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
Venta Contáctanos
Es de suma importancia mantener comunicación con el usuario, ya que de esta
manera podrá contratar nuestros distintos servicios, al igual que mandar comentarios,
opiniones, etc.
600 pixeles
800 pixeles
9

10. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
PALETA DE COLORES
Los colores son una de las partes más importantes del sitio, más que las
imágenes
que se coloquen, los colores son los que van a producir sensaciones en la mente
de los visitantes, una buena combinación de colores puede hablar mejor que muchas
imágenes, lo importante del caso es mantener una distribución de colores de
manera que nuestro sitio no se vea de mal gusto, desordenado, incongruente o
que produzca desconfianza o incluso, moleste a la vista.
Cada color comunica un mensaje; así que se debe ser cuidadoso acerca del
mensaje que se quiere transmitir, de acuerdo a su logo e identidad corporativa. Por
principio de cuentas, los colores que controlan la base de nuestra página son el color
de fondo y el del texto, mantener un buen balance entre ambos es determinante para
que nuestra página no se vea mal, produzca sensaciones agradables y no haga que
nuestros visitantes se retiren con los ojos irritados por haber estado en nuestro sitio.
Azul: Simboliza la confianza, transmite seriedad y tranquilidad, estimula la
paciencia y la serenidad. Es el color del infinito, de los sueños y de las buenas
relaciones. También es el poder de la tecnología y la limpieza, usualmente
significa éxito, dinero y calidad.
Negro: Es un color que denota poder, misterio y estilo. En diseño web puede dar
imagen de elegancia y sofisticación y aumenta la sensación de profundidad y
perspectiva.
10

11. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
Verde: Representa armonía, crecimiento, exuberancia y fertilidad. Simboliza la
esperanza y se utiliza para neutralizar los colores cálidos. Actúa como relajante
y calmante. También significa abundancia, esperanza, dinero, riqueza, calma,
balance, amistad y prestigio.
Gris: seguridad, inteligencia, madurez, sólido, profesional, conservador,
sofisticado y duradero.
Elemento Color
Background(Fondo de página) Gris
Header (Cabecera de la página web Azul/Verde
azul)
Botones Azul
Body(Cuerpo de la página web) Gris
Footer (Pie de página) Azul
Letra Negro
11

12. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
TIPOGRAFÍA
La mayoría de los diseñadores web, obtienen una descripción detallada sobre
los tamaños de fuente y estilos que se están extrayendo de los demás requisitos del
cliente. Por otro lado, la mayoría de diseñadores web, recomiendan la fuente Times
New Román a sus clientes.
¿Por qué es Times New Román es la fuente más utilizada?
La mayoría de las páginas web utilizan Times New Román para el texto. Una de
las razones principales para la selección de este estilo es que se ve profesional, junto
con eso, no es irritante para el visitante; Además de eso, es el tipo de letra más legible.
Las otras opciones disponibles
Times New Román no es la alternativa de estilo de fuente única, también se
puede utilizar Arial y Verdana. Todas estas tres fuentes se utilizan a nivel profesional,
sin embargo, no son tan populares y de uso general como Times New Román.
La selección de fuentes también depende de la disposición general del sitio web y la
preferencia del cliente. Para representar una imagen profesional, es mejor usar una de
las opciones de texto antes marcadas. Mientras más legible sea el texto en la página
web los usuarios se sentirían más atraídos.
Times New Román
ABCDEFGHIJKLMNOPQRSTVWXYZ
abcdefghijklmnopqrstvwxyz
1234567890
Arial
ABCDEFGHIJKLMNOPQRSTVWXYZ
abcdefghijklmnopqrstvwxyz
1234567890
12

13. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
Títulos
Tipo de letra: Times New Román
Tamaño: 14
Color: Negro/Blanco
Subtítulos
Tipo de letra: Times New Román
Tamaño: 12 Negrita
Color: Negro
Contenido
Tipo de letra: Arial
Tamaño: 12
Color: Negro
Link
Tipo de letra: Arial
Tamaño: 12
Color: Negro Cursiva
13

14. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
RECURSOS GRÁFICOS
Banner Flash
Internet es en la actualidad un medio principal de información y comunicación, su
potencialidad es ilimitada, la nuevas pautas de publicidad inteligente de Google por ej.
Permiten que la publicidad esté destinada adal target correcto según su perfil de
búsquedas lo que potencia enormemente la capacidad comercial de los anuncios.
La creación de banners publicitarios es una excelente oportunidad para dar a conocer
nuestros servicios en la web, ante un número potencialmente ilimitado de personas,
con una vidriera las 24 horas del día publicitándote. Son una herramienta de
marketing muy importante y en determinadas web con mucho tráfico pueden ser de
gran masividad. Un buen diseño de banner que sea atractivo, original y que sepa
aprovechar las ventajas que brinda la web, como movimiento e interactividad, harán
que nuestra web sea un éxito, y pueda tener muchas visitas y mayores ventas de
nuestros servicios.
Formato de imagen .PNG
(Portable Networks Graphic). Es un formato gráfico que está basado en un
algoritmo de compresión sin pérdidas, y fue desarrollado para resolver las deficiencias
del GIF, principalmente en cuanto a profundidad de color.
Una de las principales ventajas de PNG, es que independientemente de la
profundidad de color que se use, la compresión permite archivos de muy bajo peso sin
pérdida de calidad, permitiendo optimizar la carga de la página web.
Audio
No se utilizaran videos en la página web porque eso requiere descargar MB al
ordenador y como consecuencia consume ancho de banda y la pagina podría cargar
muy lentamente.
14

15. Desarrollo de Aplicaciones Web
Versión 1.0 21/06/2012
Video
No se utilizaran videos en la página web porque eso requiere descargar códecs
al ordenador con regularidad para poder visualizarlos.
Otra desventaja es la lentitud de carga del video, lo cual, es un factor de peso,
ya que en la actualidad la tendencia de gustos de los usuarios indica que mientras más
veloz sea la carga de una web, más popular se vuelve.
15