Documente Academic
Documente Profesional
Documente Cultură
TEMA:
Disear e implementar una pgina web para mejorar los ingresos por ventas de los
productos en la importadora Snchez S.A de la parroquia totoras provincia Tungurahua en el
ao 2017
AMBATO - ECUADOR
AO 2017
I
APROBACION DEL ASESOR
En mi calidad de catedrtico Asesor del Proyecto de grado previo a la obtencin del ttulo de
Tecnlogo en Informtica, titulado tema del proyecto, elaborado por el seor estudiante:
Quishpe Ruiz Hector Tobias. Certifico que dicho proyecto ha sido revisado en todas sus
partes y considero que rene los requisitos y mritos suficientes para ser sometido a la
presentacin pblica y evaluacin por parte del tribunal examinador que se designe.
ASESOR
II
DECLARACION DE AUTENTICIDAD
El abajo firmante, declara que los contenidos y resultados obtenidos en el presente proyecto,
como requerimiento previo para la obtencin del ttulo de Tecnlogo en Informtica, son
absolutamente originales, autnticos, personales y de exclusiva responsabilidad legal y
acadmica del autor.
Hector Quishpe
C.I: 220043640-6
III
DEDICATORIA
Hector Quishpe.
IV
AGRADECIMIENTO
V
INSTITUTO TECNOLGICO SUPERIOR BOLIVAR
CARRERA DE INFORMTICA
RESUMEN EJECUTIVO
TEMA:
Disear e implementar una pgina web para mejorar los ingresos por ventas de los
productos en la importadora Snchez S.A de la parroquia totoras provincia Tungurahua en el
ao 2017
EI objetivo de este trabajo fue mejorar los ingresos por ventas, posicionando la marca de la
empresa, mediante el diseo de una pgina web. Para ello es necesario incorporar textos,
videos, imgenes, sonidos. Todo esto representa una innovacin en cuanto a creaci6n de un
sistema de publicidad en internet, el empleo de asistente virtual va Web y la inclusin de
visualizacin de imgenes panormicas y multimedia son elementos innovadores. Esta
aplicacin se puede desarrollar mediante los lenguajes de programacin Java y Ruby, etc. Sin
embargo la pgina Web en este caso va ser desarrollado mediante lenguaje de programacin
PHP y sern generadas de forma automtica, o bajo la solicitud de un usuario con suficientes
privilegios, a partir de un XML obtenido de la base de datos. Los datos que puedan ser
representados mediante un estndar bibliogrfico, como es el caso de las publicaciones de las
ofertas de productos.
A travs de la realizacin de este proyecto se concluy que la ventajas de la pgina Web son
amplias, debido a que a travs de este medio el cliente obtendr la informacin necesaria si
necesidad de acercar a la empresa para solicitar informacin, lo que origina mayor tiempo
para los empleados en ocupacin de otros trabajos. Tambin mantendrn un contacto directo
con los clientes, adems de la promocin permanente de sus productos y servicios las 24
VI
horas, 7 das de la semana y los 365 das al ao.
VII
INSTITUTO TECNOLOGICO SUPERIOR "BOLIVAR"
COMPUTER RACE
EXECUTIVE SUMMARY
THEME:
Design and implement a website to improve the sales revenue of the products in the
importer Snchez S.A of the parish Totoras province Tungurahua in the year 2017
From the "importer Snchez S.A" originated the subject of the following investigation.
Because this company has more than 16 years in the market and does not have any of the
interactive advertising media, to publicize its services, so the need arises for the creation of a
web page.
The objective of this work was to improve sales revenues, positioning the brand of the
company, through the design of a web page. For this it is necessary to incorporate texts,
videos, images, sounds. All that represents an innovation in the creation of an internet
advertising system, the use of virtual assistant via web and the inclusion of visualization of
panoramic and multimedia images are innovative elements. This application can be
developed using Java and Ruby programming languages, etc. However, the Web page in this
case is developed by the PHP programming language and was generated automatically, under
the request of a user with sufficient privileges, from an XML obtained from the database. The
data that can be represented by a bibliographic standard, as is the case of the publications of
the product offers.
Through the completion of this project it was concluded that the advantages of the web page
are wide, so through this means the client will obtain the necessary information the need to
approach the company to request information, which causes more time For employees in
other jobs. It will also maintain direct contact with customers, in addition to the permanent
promotion of its products and services 24 hours a day, 7 days a week and 365 days a year.
VIII
INDICE
APROBACION DEL ASESOR --------------------------------------------------------------------------- II
DECLARACION DE AUTENTICIDAD ----------------------------------------------------------------- III
DEDICATORIA ---------------------------------------------------------------------------------------------IV
AGRADECIMIENTO--------------------------------------------------------------------------------------- V
RESUMEN EJECUTIVO ---------------------------------------------------------------------------------VI
EXECUTIVE SUMMARY ------------------------------------------------------------------------------- VIII
INDICE -------------------------------------------------------------------------------------------------------- 9
INTRODUCCION ----------------------------------------------------------------------------------------- 11
CAPITULO I ------------------------------------------------------------------------------------------------ 12
1 EL PROBLEMA ------------------------------------------------------------------------------------- 12
1.3 ANTECEDENTES---------------------------------------------------------------------------------------------- 12
9
2.2.7 SOFTWARE DE DISEO Y PROGRAMACION PARA LA ELABORACION DE PAGINAS WEB.
36
3 BIBLIOGRAFA------------------------------------------------------------------------------------- 41
10
INTRODUCCION
Los medios masivos se consideran como una herramienta que es de gran ayuda, ya que
facilita todo tipo de comercio a travs del internet como medio de publicacin. Esto facilita a las
personas emprendedoras a posicionar una marca de su empresa con la finalidad de atraer o los
clientes. Hoy en la actualidad existe una gran variedad de sitios en la red que facilita a las
empresas a comercializar sus productos a nivel nacional e internacionales sin tener un lmite
dando una mejor presentacin a sus productos. Al final de la dcada del siglo XXI ha existido
algunos cambios, los medios masivos no solo es aprovechado como un medio de transmisin de
informacin, si no que estn siendo transformados en una herramienta para definir, competir y
gestionar las empresas. Las nuevas tendencias en estos das son el uso y manejo de
informacin por medio de pginas web tanto por medio de internet, extranet e intranet. La
pgina web se ha visto como una herramienta indispensable para todas las empresas y pymes
debido a que ayuda y facilita una nueva forma de comercializar basado en E-business.
Imaginase una publicidad 24 horas al da durante 365 das al ao con un bajo coste de
publicidad, donde no tenga que pagar por impresiones de catlogos, por anuncios costosos en
la televisin, radio o peridicos, adems donde pueda obtener nuevos clientes, ofrecer
informacin acerca de sus productos y servicios, obteniendo informacin sobre las
preferencias y gustos de sus clientes, impulsando su empresa hacia otros pases y nuevos
mercados.
11
CAPITULO I
1 EL PROBLEMA
Bajas ventas de los productos en la importadora Snchez S.A
1.1 TEMA
Disear e implementar una pgina web para mejorar los ingresos por ventas de los productos
en la importadora Snchez S.A de la parroquia totoras provincia Tungurahua en el ao 2017.
1.3 ANTECEDENTES
La evolucin del servicio de Importadora Snchez S.A. es notable, en sus inicios era una
pequea ferretera con pocos productos elctricos y para la construccin, ubicada ubicado en la
parroquia Totoras de la provincia de Tungurahua, empez a atender al pblico en el ao de 2001,
su nombre era Comercial Snchez, empez a comercializar bloques, tubos y postes de
cemento, lo cual genero ingresos considerables a la empresa.
La empresa empez con las ventas de productos bsicos, luego se surti de accesorios PVC,
qumicos, pinturas y ltimamente productos de mayor costo como cemento, hierro, tejas, canales,
productos de obra pesada, maquinarias industriales, etc.
12
franquicia de este tipo en el mundo. Importadora Snchez S.A. ya constituida como una
compaa ha crecido en infraestructura y estructura organizacional, ofertando a sus clientes
variedad, diversidad de productos, tipos de marcas, calidad, servicio y responsabilidad.
Hoy en da, el servicio es muy diferente porque cuenta con personal calificado y capacitado,
tiene suficiente espacio fsico, su atencin es muy rpida, ya que posee todas las herramientas
necesarias para dar un servicio de calidad.
Franquicia de este tipo en el mundo. Importadora Comercial Snchez Ca. Ltda. ya constituida
como una compaa ha crecido en infraestructura y estructura organizacional, ofertando a sus
clientes variedad, diversidad de productos, tipos de marcas, calidad, servicio y responsabilidad.
Hoy en da, el servicio es muy diferente porque cuenta con personal calificado y capacitado,
tiene suficiente espacio fsico, su atencin es muy rpida, ya que posee todas las herramientas
necesarias para dar un servicio de calidad.
VISIN
Ser el lugar preferido en el momento de adquirir los materiales de construccin para su vivienda
MISIN
OBJETIVO
Nuestro objetivo es ofrecer una amplia gama de productos para la construccin, brindndoles
mejores opciones de compra a nuestros clientes. De esta manera, entregamos un mayor nmero
de productos, al por menor y mayor, a costos competitivos y mediante una atencin
personalizada que nos permite evaluar su satisfaccin. Continuando con el concepto de oferta
total, la canasta de productos ofrecida a nuestros consumidores finales se centra en productos
para la construccin y dems productos de la industria
13
1.4 PLANTEAMIENTO DEL PROBLEMA
El principal problema que afronta la importadora Snchez S.A son las bajas ventas de los
productos, para que esta entidad sea ms conocida y tengan una mayor proyeccin dentro de la
sociedad, con el objetivo de que pueda seguir creciendo y proyectando en el mercado. Como
medio de ingreso para acrecentar el capital de la empresa a travs de este medio, la pgina web,
se emplearan dos estrategias, entre ellas, la venta de TIPS por medio de E-commers y el otro
medio de ingreso es la publicacin y elaboracin de banner`s dentro del sitio web.
Partiendo de este problema existente, es en cuanto las bajas ventas de los productos, buscar
estrategias para que los clientes a travs de esta pgina web puedan observar todo los materiales,
herramientas y muchos ms, que estn siendo ofrecidos por la empresa. Debido a la inexistencia
de una pgina web toda la informacin est siendo transmitida al correo o a travs de llamadas
telefnicas, lo que resulta una explicacin muy escasa y confusa al no obtener un apoyo visual. A
travs de este sitio web se colocaran todos los eventos del momento y se levantaran los
informes en tiempo real, para que los clientes puedan observar el progreso y noticias que salen
acerca del evento, permitiendo a su vez una mayor conexin y satisfaccin por parte del cliente
Hoy en el da, la comunicacin entre pases de forma rpida y entiempo real, es posible gracias al
internet. Este medio se ha vuelto una herramienta indispensable para una empresa, debido a que
permite un acceso rpido y permanente de informacin, mostrando a su vez caractersticas
esenciales y concretas, para dar a conocer las virtudes y servicios de una empresa a sus clientes.
14
Desconocimiento de
Cartera de Desconocimiento de lugar de ubicacin
Clientes la oferta de de la empresa.
limitada productos
Efectos
15
1.5 JUSTIFICACIN
El propsito de este proyecto no es solo disear una pgina Web con el objetivo de posicionar
una marcar de la Importadora Snchez S.A. Si no tambin es dar a conocer su servicio y ampliar
su cartera de clientes, lo que les permitir el crecimiento constante de la empresa. Tambin
mostrar estrategias que fortalezcan la comunicacin entre empresas actualmente la mayora de
los problemas existentes son debidos al mal manejo de la informacin y como transmitirla a sus
clientes.
Los motivos y razones que conllevan a la realizacin de este proyecto es principalmente porque
no cuentan con uno de los servicios ms empleados como hoy en da para conocer un producto o
servicio, los clientes buscan a travs de internet. Otro de los aspectos que se resolveran con esta
investigacin, es minimizar los problemas que se generan dentro de la empresa por falta de
comunicacin de empresa-cliente, y as lograr rapidez, eficiencia, practicidad, ahorro de tiempo
y gastos operativos. Obtener ms que un servicio publicitario un beneficio lucrativo para
acrecentar el capital actual de la empresa
Entre los beneficios que se presentan en la elaboracin de este proyecto, esta principalmente para
facilitar la comunicacin entre empresa-cliente; Ya que el sitio web se convierte en un punto de
contacto, donde estar la direccin, telfono y correo electrnico, ste ltimo, de gran aceptacin
y utilizacin entre todos los tipos de clientes con esto solucionara los puntos mencionados en
este proyecto: como tambin se crea una gua o manual para que otras empresas puedan crear su
pgina web y consolidarse dentro de segmentos del mercado en los cuales se estn posicionando
su marca .
16
1.6 OBJETIVOS
1.6.1 General
Mejorar los ingresos por ventas, posicionando la marca de la empresa importadora Snchez S.A
al nivel nacional
1.6.2 Especficos
Determinar las necesidades de la importadora Snchez S.A inherentes a su misin, visin y
objetivo
Determinar los elementos comunicacionales ms adecuadas para la imagen de importadora
Snchez S.A en funcin de posicionamiento en el mercado que se quiere alcanzar
Determinar el contenido y seccione del sitio web
Disear la propuesta de la imagen de la pgina web
1.7 ALCANCE
Este presente proyecto va ser beneficiado no solo para la importadora Snchez S.A. sino,
tambin todas las pequeas y medianas empresas que estn interesados a posicionar una marca
de su institucin y ser reconocidos al nivel regional.
17
1.8 RECURSOS
DESCRIPCION COSTO
Diseo y programacion (costos generales) 2.700,00
regidtro de dominio 30,00
el costo de alojamiento (hosting) 150,00
TOTAL EN DOLARES 2.880,00
18
CAPITULO II
2 MARCO TEORICO
2.1 ANTECEDENTES INVESTIGATIVOS
Actualmente, las pginas web se han vuelto una herramienta indispensable dentro de las
compaas, empresa o cualquier otra entidad que dedica a la comercializacin, es por esa razn
que existe una gran cantidad de tesis y proyectos referentes a la elaboracin de pgina web.
Esta investigacin busco introducir nuevos estilos y herramientas para dar una mejor
presentacin a la institucin educativa y ofrecer una buena navegabilidad, usabilidad e
interactividad, a travs de la creacin de una pgina web. Con la finalidad de facilitar la
comunicacin entre docentes-padres de familia de una manera ms rpida y sencilla, en lo que
esto implica es en minimizar los gastos por las impresiones y aprovechamiento de tiempo.
Cumpliendo con este propsito final, en este investigacin no solo trata de establecer una
comunicacin sino que tambin ser una institucin educativa ms reconocida ante las
sociedades.
19
Este antecedente se toma de manera directa, para presente investigacin, ya que posee
elementos importantes como el uso de color los conceptos relacionados con internet y diseo
grfico, tcnicas para elaboracin de un sitio web, aplicaciones grficas para la elaboracin de
una pgina web con programas como Photoshop, ilustrador, flash y Fireworks. Elementos
necesarios y tcnicos para disear el sitio web.
Por lo tanto aporta conocimientos importantes para creacin de pginas web, en cuanta a la
elaboracin de catlogos, y as publicitar los diferentes productos de una empresa a travs de la
web. Adems aporta fundamentos en cuanto al diseo referente al tipo de tipografa, geometra,
tambin menciona las reglas, estructuras y los estndares necesarios para la creacin de una
pgina web.
2.2.1 INTERNET
El autor (Blaider Correa, 2002) en su libro define a internet Internet es una red de redes
porque est hecha a base de unir muchas redes locales de ordenadores, sea de unos pocos
ordenadores en un mismo edificio empresa. Adems esta es red de redes porque es la ms
grande. Prcticamente todos los pases s del mundo tienen accesos al internet. Por la red
internet circulan constantemente cantidades increbles de informacin. Por este motivo se llama
tambin autopista de informacin. Hay ms de 50 millones de personas que navegan por
20
internet en todo el mundo. Se dice navegar porque es normal el ver informacin que proviene de
muchas partes distintas del mundo en una sola sesin.1
El autor (Blaider Correa, 2002) en su libro nombra algunos ventajas que ofrecen el internet
Acceso global: Uno ingresa a la red a travs de una llamada telefnica o una lnea alquilada
directa a internet y el acceso a la informacin no posee un costo de comunicacin esta para la
informacin este donde est, puede ser localmente o en otro pas.
Acercamiento con los clientes: Mediante el interne y el correo electrnico, se tiene llegada a
personas e informacin dentro y fuera de la empresas que para realizarlo por medio de otras
tecnologas en algunos casos se tronaran imposible.
Unos de los medios que actualmente predominan dentro de la mercadotecnia para ayudar
1
CORREA ABURTO; Eddy Blaider; Introduccin a la Computacin; 2002
21
a dar a conocer las marcas corporativas dentro de las organizaciones son la denominadas
pginas web, que no son otra cosa que diseos informticos con la finalidad de globalizar una
marca. Las pginas web estn desarrolladas con lenguajes de marcado como el HTML, que es
interpretado por navegadores. De esta forma presentar informacin de manera ms atractiva e
interactivas mostrando textos, imgenes, audios, videos, etc.
El autor Milenium afirma que Una pgina Web tiene la caracterstica peculiar de que
el texto se combina con imgenes para hacer que el documento sea dinmico y permita que se
puedan ejecutar diferentes acciones, una tras otra, a travs de la seleccin de texto remarcado o
de las imgenes, accin que nos puede conducir a otra seccin dentro del documento, abrir otra
pgina Web, iniciar un mensaje de correo electrnico o transportarnos a otro Sitio Web
totalmente distinto a travs de sus hipervnculos.
2
MILENIUM; Pginas web; 2003
22
discutiendo sus problemas y sus necesidades con otros individuos que trabajan e indagan sobre el
mismo tema. Internet es la gran superautopista de la informacin.
(Rubn Villavicencio) Con respecto a las pginas web concluye diciendo que Hoy en el
da cuando hablamos de internet, generalmente se hacen referencia a las pginas web, las que
se han convertido en uno de los servicios estndar de comunicacin. Estas pginas son
documentos que permiten mostrar informacin haciendo uso de texto, imgenes, sonido, enlaces,
animaciones y otros elementos multimedia. 3
El autor Rubn Villavicencio afirma que Las pginas web son creadas de muchas
formas. Generalmente se cuentan con dos formas estndar: mediante un editor de texto
utilizando los comandos e instrucciones del lenguaje HTML, DHTML, JavaScript o utilizando
programas de edicin y/o administracin de pginas web. Tal como FrontPage 2003.
Segn el autor (Jos Alarcon, 1997) en su libro define El sitio web es el servicio ms
espectacular y que ms ha contribuido a la popularidad de internet por dos razones: su amplia
utilizacin de la imagen y la capacidad multimedia, por un lado, y su sencillez de uso por otro
lado. Si se calcula que el internet es consultado en promedio de cada da por 30 millones de
usuarios, aproximadamente la tercera parte, unos 10 millones, utilizan web. Dicen que la
3
VILLAVICENCIO LUNA; Rubn; Programacin Orientada la Web; 2004
23
imagen valen ms que mil palabras, y esta es una delas ventajas del web que lo convierten en un
servicio de informacin sumamente vistoso y atractivo.4
El hipertexto es una de las formas de la hipermedia con estructura secuencial que permite
crear, agregar, enlazar y compartir informacin de diversas fuentes por medio de enlaces
asociativos. El hipertexto no est limitado a datos textuales, podemos encontrar dibujos del
elemento especificado o especializado, sonido o vdeo referido al tema. El programa que se usa
para leer los documentos de hipertexto se llama navegador.
Por otro lado Milenium (2003) dice que Un sitio web es un conjunto de archivos
electrnicos y pginas web referentes a un tema en particular, que incluye una pgina inicial de
bienvenida, generalmente denominada home page, bajo un nombre de dominio y direccin en
Internet especficos. El World Wide Web, o simplemente Web como se le llama comnmente, est
integrado por sitios web y stos a su vez por pginas web.
Un sitio web no es lo mismo que una pgina web, por lo tanto puedo decir que es
un espacio virtual en Internet con un conjunto de pginas web que son accesibles desde un
mismo dominio o subdominio de la WWW. Es importante establecer que en Internet
encontramos una gran variedad de tipos de sitios web que suelen diferenciarse fundamentalmente
por la clase de contenido que ofrecen o por el servicio que brindan a cualquiera de las personas
que se encuentran navegando por la Red.
Milenium (2003), afirma que, Al igual que los edificios, oficinas y casas, los Sitios Web
requieren de una direccin particular para que los usuarios puedan acceder a la informacin
contenida en ellos. Estas direcciones, o URL (por sus siglas en ingls Uniform Resource
4
ALARCON CONTRERAS; Jos Manuel; Internet; 1997
24
Locator), aparecen cotidianamente en todos los medios de comunicacin como son prensa
escrita, radio, televisin, revistas, publicaciones tcnicas y en el propio Internet a travs de los
motores de bsqueda (por su denominacin en ingls search engines). Los nombres de estos
sitios Web (dominios) obedecen a un sistema mundial de nomenclatura y estn regidos por el
ICANN (Internet Corporation for Assigned Names and Numbers).
El HTML es una serie de elementos que estructuran el texto y son presentados en forma
de hipertexto por agente de usuario o navegadores. Esto se puede hacer con un simple editor de
textos, sin ningn tipo de formato y con extensin .html. Las pginas web estn escritos en
lenguaje HTML, por esa razn para para posicionar una marca de la empresa se necesita disear
una pgina web compleja para desarrollar se necesita disponer de un software para
programacin orientada a la web, como puede ser JavaScript, PHP, etc.
Segn (Rubn Villavicencio, 2004) en su libro menciona que HTML es el lenguaje que
todos los programas navegadores de internet (Netscape, Microsoft Internet Explorer y otros)
utilizan para presentar informacin en la World Wide Web (WWW). Es un lenguaje sencillo
que se basa en el uso de etiquetas consistentes en un texto ASCII encerrado dentro de un par
de parntesis angulares (<..>). (pgs. 5, 6)
25
atributo tenga ms de una palabra deber expresarse entre comillas, en caso contrario no ser
necesario.
Para disear una pgina web lo primero que se necesita es tener conocimientos en la
programacin no importa el tipo de software que haya sabido utilizar para programar porque
casi todos las lenguajes de programacin es de alto nivel es decir es un lenguaje similar a la del
ser humano la nica diferencia es que se utiliza idioma ingles.
Segn (Fredy Barzola, 2004) dice Para crear aplicaciones en HTML necesitaremos
emplear un editor HTML. Adems podemos utilizar el NotePad, el FrontPage, El visual
Interdev y PHP.5 (pg. 8)
5
BARZOLA SUARES, Freddy Paul; El Portal de las Paginas HTML; 2004
26
Todo lo definido entre las etiquetas <HEAD> .... </HEAD> conforma la cabecera del
documento.
Entre los elementos de la cabecera hay que destacar el elemento <TITLE>, que es obligatorio, e
indica el ttulo de la pgina. Este ttulo es utilizado por los navegadores visuales para dar nombre
a la ventana en la que se est viendo la pgina.
El cuerpo del documento, donde se define el contenido visible de la pgina web. Por
ejemplo:
Al igual que para la cabecera, todo lo definido entra las etiquetas <BODY> ... </BODY>
constituye el cuerpo de la pgina. Adems, existe otra etiqueta (<HTML>) que sirve para indicar
27
donde comienza y termina la pgina web. De esta forma, la estructura completa de la pgina web
sera:
Los editores de pginas web nos ahorran mucho trabajo ya que slo con seleccionar la
opcin de crear una nueva pgina, han escrito automticamente todas las etiquetas que definen la
estructura del nuevo documento. En el caso de Front Page se crea una nueva pgina pulsando
sobre el icono A partir de aqu veremos los elementos bsicos que podemos poner en una
pgina web, con las caractersticas que se pueden definir sobre cada uno de ellos, as como la
forma en que se especifican estas caractersticas en Front Page.
Los hipervnculos don los que se visualiza de una manera distinta en el navegador, el
texto aparece subrayado y de color azul, y de la misma forma las imgenes son rodeadas por un
borde de un mismo color. Al pulsar sobre el enlace seremos enviados al documento que apuntaba
el enlace es decir a otra pgina web.
28
Una de las caractersticas principales que define (Rubn Villavicencio, 2004) sobre las
pginas web es: la posibilidad de incluir hipervnculos. Un hipervnculo (tambin conocido
como hiperenlace o link) es una zona de texto o grafico de una pgina web que al hacer clic
sobre l, nos traslada a otra posicin dentro de misma pgina, a otra pgina web de un mismo
sitio, a una pgina de otro sitio web se puede estar fsicamente en el otro lado del planeta, a un
archivo, a una imagen, etc.
Por otro lado (Fredy Barzola, 2004) dice: la caracterstica que ms ha influido en la
espectacular xito del web ha sido, parte de su carcter multimedia, la posibilidad de unir los
distintos documentos repartios pro todo el mundo por medio de enlaces hipertextos.
29
tengan en cuenta a la hora de las bsquedas. En resumidas cuentas un diseo web es la unin de
distintas piezas en un lenguaje de programacin para entregar un resultado final en una pgina
web.
El diseo grfico busca transmitir las ideas esenciales del mensaje de forma clara y
directa, usando para ello diferentes elementos grficos que den forma al mensaje y lo hagan
fcilmente entendible por los destinatarios.
Los primeros aos del diseo de pginas web segn (Phillip Meggs, 2000), asumieron
una posicin de restriccin para los diseadores grficos. El tamao de la pantalla de una
computadora y las fallas tipogrficas a menudo reconfiguraron el diseo de pgina proyectado,
hasta que un software ms sofisticado permiti bajar los tipos con la pagina planteada. 7
Los elementos grficos se usaron inicialmente poco en la web, sobre todo debido al peso de
los ficheros grficos necesarios, que con las conexiones a Internet que disponan los usuarios
medios haca que las pginas tardaran demasiado en descargarse desde el servidor.
6
MORENO, Luciano; Elementos grficos para el diseo de Banners; 2000
7
PHILLIP, Meggs; historia de diseo de pgina web; 2000
30
Hoy en la actualidad existen diferentes objetos grficos que podemos usar en nuestros
diseos, entre los que podemos citar logotipos, banners, iconos, bullets, fotografas, ilustraciones,
etc. Cada uno de ellos posee unas caractersticas de diseo y unas capacidades de comunicacin
propias, jugando un papel diferente en la composicin. Ya conocemos los tipos de ficheros
grficos, su naturaleza y sus propiedades. Vamos ahora a estudiar los diferentes elementos
grficos existentes y cmo podemos utilizarlos de forma adecuada en nuestros trabajos.
Sans Serlf: Segn (Fotonostra, 2005) dice que Est basada en las proporciones
de las romanas. Las maysculas inscripcionales y el diseo de caja baja de las romanas
de los siglos XV-XVI.
Ilustraciones: (Garcia Torres, 2003) dice que las ilustraciones que est constituida por
las ilustraciones propiamente dichas, las fotografas o formas grficas, pudiendo
adoptar toda clase de configuraciones. Habremos de combinarlas con el resto de
elementos grficos de modo que podamos conseguir el mximo impacto visual.
8
GARCIA TORRES, A; composicin y ubicacin de los elementos de diseo; 2003
9
FONOSTRA; diseo de pgina web; 2005
31
La forma: (Pereyra, 2005) a la forma dice que es el resultado de cada elemento
grafico aislado. Comprende un orden interno, su lgica. su apariencia final depende de
la estructura, le da sentido y habilita la morfognesis.10
Los contornos: este elemento permite distinguir de los dems y del fondo, pudiendo
estar definidos mediante bordes, cambio de color o cambios de saturacin. (Moreno)con
respecto a los contornos dice que es el objeto grafico creado cuando el trazo de una
lnea se une en un mismo punto
Color: Segn (Fotonostra, 2005) dice que los colores RGB, tambin son llamados
colores luz, colores producidos por luces, tales como el monitor, el cine, la televisin,
entre otros. Estn conformados por los colores: rojo, el verde, y el azul.
El contraste: intensidad de visualizacin de cada elemento con relacin a los que rodean
y al grafismo completo. Moreno Luciano dice que es el efecto que permite resaltar el
peso visual de uno o ms elementos o zonas de una composicin mediante la oposicin o
diferencia apreciable entre ellas, permitindonos a traer la atencin de espectador hacia
ellos.
Segn (Gonzales Virgilio, 2005) en su libro menciona Un buen diseo web es aquel que
considera dentro de su desarrollo tanto los elementos bsicos del diseo grfico (la
10
PEREYRA, Nora; diseo de pgina web; 2005
32
diagramacin, el color, los grficos y las fuentes) como los fundamentos tcnicos (estructura,
compatibilidad, funcionalidad e interactividad) para crear tanto el impacto visual como la
experiencia de usuario ptima para la asimilacin del contenido.11
Para poder llegar a ser un buen diseador de las pginas web, es necesario guiarnos en el
libro de (Gonzales Virgilio) en donde nombra tres sugerencias conocidos como etapas de
desarrollo, que servir como una gua, que facilitara al diseador a desarrollar una pgina web
utilizando procesador de texto o cualquier otro software que sea orientada a la web.
2.2.6.1 Planificacin.
Este proceso exige respetar una serie de pasos que fijan en un primer momento la meta hacia
dnde vamos a llegar y que es lo que queremos lograr como en este caso diseo de una pgina
web, en base al objetivo planteado debemos seguir un conjunto de mtodos y estrategias que
facilite concluir con el objetivo propuesto, la primera, es el diseo visual de la informacin que
se desea editar o mejorar. En esta etapa se trabaja distribuyendo el texto, los grficos,
los vnculos a otros documentos y otros objetos multimedia que se consideren pertinentes. Es
importante que antes de trabajar sobre el computador se realice un boceto o prediseo sobre el
papel. Esto facilitar tener un orden claro sobre el diseo.
1. Definicin de la Temtica.
Se ha de definir los temas que se van a exponer en el sitio Web, permitiendo definir
trminos claves de bsqueda para posteriormente realizar una metodologa de
posicionamiento.
11
GONZALES AGUILAR, Virgilio; Metodologa Para Diseo de Pagina Web; 2005
33
2. Planteamiento de objetivos.
Se han de plantear los objetivos que se quieren alcanzar con la creacin del sitio Web,
para posteriormente marcar estrategias funcional para la consecucin de dichos objetivos.
3. Escalabilidad.
La escalabilidad se define como las visiones a corto y largo plazo acerca de nuestro sitio
Web, si a lo largo del tiempo queremos ampliar nuestro sitio Web con nuevas aplicaciones,
nuevas pginas, actualizaciones constantes.
34
2. Aplicaciones Web.
Creacin de las aplicaciones que contendrn nuestro sitio Web, encuestas,
foros, soporte al cliente, pedidos on-line, mediante programacin especfica y creacin de bases
de datos.
3. Posicionamiento.
Una vez que tenemos terminado nuestro sitio Web lo que queremos es que en cualquier
buscador, especialmente google, aparezcamos en las primeras posiciones para recibir
ms visitas a nuestra Web. Es este punto donde se ha de implementar una metodologa
especfica para alcanzar un posicionamiento ptimo, definiendo las palabras claves de
bsqueda, creacin de archivos robots.txt.
4. Testeo.
Realizacin de pruebas para comprobar la usabilidad y correcto funcionamiento de
nuestro sitio, no queremos mostrar pginas con links rotos, pginas en con un formato diferente
a las anteriores, aplicaciones no funcionales....ya que aportan una imagen negativa y harn que
los visitantes no vuelvan a nuestra pgina.
1. Ampliaciones y actualizaciones.
Es muy importante ofrecer informacin novedosa que atraiga y fidelice a
nuestros visitantes o clientes, es importante definir una pgina de novedades o noticias donde
los visitantes obtengan rpidamente las informaciones novedosas y aprecien que el sitio
Web se mantiene "vivo" y puede ofrecerle nuevos servicios.
2. Posicionamiento.
35
El arte del posicionamiento es una metodologa que requiere un seguimiento para poder
posicionarnos y mantenernos en los primeros puestos de los buscadores, gran parte de
nuestro xito depende del nmero de visitas que reciba la Web.
3. Marketing.
Realizar una estrategia de marketing para dar a conocer nuestra Web ya puede ser
mediante publicaciones en peridicos, panfletos, links de otras Web.
4. Mantenimiento.
Realizacin de programas de mantenimiento para que nuestro Web est en
funcionamiento durante toda su vida.
Hoy en el da los diseadores cuentan con los programas que hacen la parte digital y
programacin mucho ms sencilla. Las compaas ms poderosas en la creacin de software
son adobe y Macromedia. Estas compaas actualmente se han unido para integrar e innovar
software atractivo y eficaz que satisfacen las necesidades de clientes y mercado que van desde
diseadores y cineastas hasta empresas y gobiernos, pasando por desarrolladores y usuarios
domsticos. Entre los programas ms reconocidos entre los diseadores se encuentran:
(informacin suministrada por la pgina oficial de adobe disponible en:
http://www.adobe.com/es/products/photoshop/)
FreeHand: a travs de este programa se trabaja la parte de vectores como tambin parte
del diseo para la creacin de la pgina web. Se crean diseos e ilustraciones sofisticadas que se
pueden usar para la impresin, internet y proyectos.
36
Entre los programas de Adobe para el montaje y programacin de pginas web se encuentran:
37
2.2.7.1 Programa para hacer animaciones multimedia
Segn (Liedo Jos, 2006), el programa flash es el futuro de la verdadera web multimedia
animada e interactiva. Incluye herramientas de dibujo, de animacin de imgenes, de gestin de
sonidos e interactividad, y que permite crear imgenes a partir de nada, sin tener que recurrir a
otro programa.12
Flash permite exportar el archivo original a un formato que comprime y compila toda la
informacin. Este formato se denomina .SWF.
.SWF es una extincin su objetivo es crear archivos pequeos para ser publicados dentro
de una pgina web, pero que permitan la interactividad y que funcione en cualquier plataforma,
aun cuando el usuario este navegando con una ancho de banda reducida.
Segn (Liedo Jos, 2006), dice que es un formato de archivo de grficos vectoriales
creado por la empresa Adobe. Los archivos SWF pueden ser creados por el programa Flash,
aunque hay otras aplicaciones que tambin lo permiten. Bsicamente es un formato vectorial,
pero tambin admite bitmaps y, necesita para ser ejecutado el plugin Flash, el cual permite
mostrar las animaciones vectoriales que contienen los ficheros.
12
LIEDO GOMES, Jos Luis; Macromedia flash; 2006
38
El formato es bastante simple, si bien es escrito que est en formato binario y por lo tanto
no es de lectura accesible, como el SVG (estndar abierto basado en XML, recomendacin del
W3C). SWF ha utilizado la compresin zlib desde el 2002, y en general el objetivo del formato
es almacenar todos los datos usando el menor nmero de bits, minimizando la redundancia.
JavaScript le puede permitir detectar el navegador utilizado por los visitantes y dirigirlos
a una pgina optimizada; mostrar informacin variable como la fecha, la hora, etc.; interactuar
con los usuarios por medio de cuadros de dialogo personalizados; crear men dinmicos, etc.
(Levior, 2006), Por otra parte, JavaScript tambin se combina con frecuencia con otras
tecnologas o lenguajes, tales como DHTML, para construir sitios dinmicos. As que ya sabe:
A donde quiera que le conduzca la web, sin duda escuchara el nombre JavaScript.
Los script de JavaScript se aaden fcilmente al cdigo HTML. Todo lo que tiene que hacer es
colocar el cdigo requerido entre etiquetas <SCRIPT> y </SCRIPT>, que a su vez se deben
insertar en la seccin de cabeza de la pgina denotada por el elemento HEAD.
13
LEVIOR , Claude; Introduccin a JavaScript; 2006
39
<html>
<head>
<script type="text/javascript">
</script>
</head>
<body>
</body>
</html>
40
3 BIBLIOGRAFA
Blaider Correa, A. E. (2002). Introduccion a la Computacion (PRIMERA EDICION ed.).
LIMA, PERU: MEGABYTE.
Fotonostra. (2005). Palo seco y sans Serif. Recuperado el 20 de junio de 2007, de
http://www.fotonostra.com/grafico/geometricas.html+tipografia+palo+seco&hl=es
&ct=cink=cd=1&gl=es
Fredy Barzola, P. S. (2004). El Portal de las Paginas HTML (1ra Ediccion ed.). Lima,
Peru: RITISA.
Garcia Torres, A. (2003). Composicion y ubicacion de los elementos de diseo.
Recuperado el 19 de enero de 2007, de
http://www.imageandart.com/tutoriale/teoria/composicion_ubicacion/index.html
Gonzales Virgilio, A. (2005). Metodologia Para Diseo de Pagina Web (2da Edicin
ed.). Lima, Peru: DELTA.
Jorge, M. A. (01 de Octubre de 2009). Milenium. Recuperado el 2003, de milenium:
http://www.oocities.org/es/msimoz2/ihai/InfografiasTG1/INF009.htm
Jos Alarcon, M. C. (1997). Internet (Tercera Edicion ed.). Madrid, Espaa: Paraninfo.
Levior, C. (2006). Introduccin a JavaScript. Recuperado el 12 de enero de 2008, de
librosweb:
https://librosweb.es/libro/javascript/capitulo_1/javascript_y_navegadores.html
Liedo Jos, L. G. (2006). Macromedia Flash. Obtenido de eHow:
http://www.ehowenespanol.com/definicion-macromedia-flash-hechos_78686/
Moreno, L. (2000). Elementos Graficos para el diseo de banners. Recuperado el 7 de
julio de 2007, de http://www.desarrolloweb.com/articulos/1327.php
Pereyra, N. (2005). Forma y Diseo. Recuperado el 7 de julio de 2007, de
http://www.sema.org.ar/downlonds/De%20la%20forma%20y%20el%20diseo.pd
Rubn Villavicencio, L. (2004). Programacion orietada a la web (Primera Edicion ed.).
Lima, Peru: Servilibros.
41