Diseno-y-creacion-de-un-sitio-Web-para-la-empresa-Telediez-Mexico-SA-de-CV

Vista previa del material en texto

UNIVERSIDAD NACIONAL AUTÓNOMA DE MÉXICO
FACULTAD DE ESTUDIOS SUPERIORES DE CUAUTITLÁN
CAMPO 1
“DISEÑO Y CREACIÓN DE UN SITIO WEB PARA LA EMPRESA 
TELEDIEZ MÉXICO S.A DE C.V”
T E S I S
QUE PARA OBTENER EL TÍTULO DE:
 
LICENCIADA EN DISEÑO Y COMUNICACIÓN VISUAL
PRESENTA: 
MARISOL LÓPEZ ESCUTIA
ASESORA: L.C.G. MARIA DE LAS MERCEDES SIERRA KEHOE
CUAUTITLÁN IZCALLI, EDO. DE MÉXICO, 2006 
 
UNAM – Dirección General de Bibliotecas 
Tesis Digitales 
Restricciones de uso 
 
DERECHOS RESERVADOS © 
PROHIBIDA SU REPRODUCCIÓN TOTAL O PARCIAL 
 
Todo el material contenido en esta tesis esta protegido por la Ley Federal 
del Derecho de Autor (LFDA) de los Estados Unidos Mexicanos (México). 
El uso de imágenes, fragmentos de videos, y demás material que sea 
objeto de protección de los derechos de autor, será exclusivamente para 
fines educativos e informativos y deberá citar la fuente donde la obtuvo 
mencionando el autor o autores. Cualquier uso distinto como el lucro, 
reproducción, edición o modificación, será perseguido y sancionado por el 
respectivo titular de los Derechos de Autor. 
 
 
 
AGRADECIMIENTOS
A mis padres por su fé y su apoyo.
A mi hermano, pieza fundamental en mi vida.
A Xchel por su incondicional amor.
A mis amigos, ¡mendigos como los quiero!.
A mis maestros, especialmente a aquellos que me legaron
 más que conocimientos y por último, pero no menos importante,
a mi asesora y amiga Mercedes Sierra por su apoyo, tiempo y paciencia.
A Dios.
INTRODUCCIÓN
CAPITULO 1. LA RED INTERNET, UN MEDIO MÁS DE COMUNICACIÓN
1.1 INTERNET 1
 1.1.1 BREVE HISTORIA DEL INTERNET 3
 1.1.2 WORD WIDE WEB 5
 1.1.3 IMPORTANCIA DE INTERNET COMO MEDIO DE COMUNICACIÓN 6
 1.1.4 IMPACTO DE INTERNET EN LOS USUARIOS 7
 1.1.5 INFLUENCIA DE INTERNET EN EL ÁMBITO EMPRESARIAL 8
 1.1.6 SERVICIOS DE INTERNET 9
 1.1.7 HOSTING, MANTENIMIENTO Y ADMINISTRACIÓN DE UN SITIO 10
1.2 SITIOS WEB 12
 1.2.1 CLASIFICACIÓN DE SITIOS WEB 13
 1.2.2 COMPONENTES BÁSICOS DE UN SITIO WEB 14
 1.2.3 ARQUITECTURA DE LA INFORMACIÓN 19
 
1.3 EL DISEÑO Y COMUNICACIÓN VISUAL EN UN SITIO WEB 22
 1.3.1 CONCEPTOS DE DISEÑO RELACIONADOS CON EL SITIO WEB 23
 1.3.2 EL DISEÑO DE LA INTERFACE 28 
 1.3.2.1 COLOR 32
 1.3.2.1.1 COLOR EN LA WEB 38
 1.3.2.1.2 IMPACTO VISUAL DEL COLOR EN LA WEB 39
 1.3.2.2 TIPOGRAFÍA 42
 1.3.2.2.1 TIPOGRAFÍA EN LA WEB 45
 1.3.2.3 ELEMENTOS GRÁFICOS 48
 1.3.2.3.1 GRÁFICOS PARA LA WEB 50
 1.3.2.3.2 RESOLUCIÓN DE GRÁFICOS 53
 1.3.2.4 SONIDO 57
 1.3.2.4.1 FORMATOS DE SONIDO MÁS COMUNES PARA LA WEB 58
 
 
ÍNDICE
CAPITULO 2. TELEDIEZ MÉXICO, LA TELEVISIÓN DE TU COMUNIDAD
2.1 LA EMPRESA 61
2.2 HISTORIA DE TELEDIEZ 62 
 2.2.1 CARTERA DE CLIENTES 63 
2.3 TELEDIEZ EN LA ACTUALIDAD 63
 2.3.1 SERVICIOS QUE OFRECE 63
 2.3.2 TRANSMISIÓN Y CENTROS DE EMISIÓN 68
 
2.4 VISIÓN A FUTURO 69 
 
 
CAPITULO 3. DESARROLLO DEL PROYECTO
3.1 METODOLOGÍA DE BRUNO MUNARI 71
3.2 DEFINICIÓN DEL PROBLEMA Y RECONOCIMIENTO DE NECESIDADES DE LA EMPRESA 73
3.3 RECOPILACIÓN Y ANÁLISIS DE DATOS 74
 3.3.1 BRIEF CREATIVO 74
 3.3.2 APLICACIÓN DE ENCUESTAS 76
3.4 ETAPA CREATIVA 78
 3.4.1 LLUVIA DE IDEAS 78
3.5 ESTRUCTURA DE LA INFORMACIÓN 79
 3.5.1 ESTRUCTURA DEL SITIO 80
 
3.6 MATERIALES Y TECNOLOGÍA 81
 
3.7 MODELADO DE INTERFACE 82
 3.7.1 DIBUJOS CONSTRUCTIVOS 86
 
3.8 CONSTRUCCIÓN DEL SITIO 90
 3.8.1 DISEÑO DE LOS COMPONENTES BÁSICOS DEL SITIO 91
 3.8.2 CREACIÓN DEL SITIO 98
 3.8.3 PRODUCCIÓN DE CÓDIGO Y FUNCIONALIDAD 106 
3.9 SOLUCIÓN DEL SITIO 116
3.10 VERIFICACIÓN DEL SITIO 118
3.11 WEB HOSTING 122
3.12 MANTENIMIENTO 124
 
CONCLUSIONES
ANEXO
GLOSARIO DE TÉRMINOS
BIBLIOGRAFÍA
El presente trabajo se organiza en tres capítulos:
 El primero se divide en tres secciones, en la primera de ellas se explican bre-
vemente conceptos de internet, sus antecedentes históricos y los servicios que se 
ofrecen dentro de éste; se hace referencia a internet como medio de comunicación 
en un breve análisis desde sus funcionalidades y ventajas hasta el impacto social que 
ha provocado cambios radicales en la vida cotidiana, las empresas no están exentas 
de estos cambios, pues el impacto de Internet no solo afecta ciertos sectores o áreas 
específicas. El trabajo cotidiano, la educación, la política, el comercio, y en general 
la forma de desenvolvimiento de las instituciones encuentran constantemente en las 
tecnologías de Internet nuevas oportunidades de crecimiento, por esta razón también 
se hace un breve análisis de su influencia en el ámbito empresarial. Por último, dentro 
de esta sección se encuentran descritos los tipos de hosting que existen actualmente, 
con la finalidad de crear un panorama completo de qué es la red internet y cuales son 
las formas de publicar en ella un sitio web.
 
 En la segunda parte de este capítulo se define que es un sitio web y cual es su clasifi-
cación según el objetivo principal por el que fueron concebidos, por lo que sus diferen-
cias son dadas de acuerdo a sus características y a su contenido. Un sitio se compone 
de páginas y cada una de ellas tiene una denominación de acuerdo a las opciones que 
presenta, por esta razón también se hace referencia a la definición de arquitectura del 
sitio, como una forma de diseñar y organizar la información, con el objetivo de facili-
tar al usuario el entendimiento del sitio para encontrar lo que busca.
 En la tercera parte se encuentra descrita la acción que desempeña el diseño en 
internet, así como su importancia en la elaboración de sitios web, a partir de la base 
de los fundamentos del diseño y comunicación visual se puede empezar a planear la 
construcción de un sitio. Posteriormente se sugiere al diseño de la interface gráfica 
como un elemento importante en el diseño de un sitio, en esta parte se plantea una 
RESUMEN
metodología propuesta para la elaboración de la interface gráfica óptima, que se ade-
cue a los objetivos planteados por la necesidad principal, dicha metodología abarca 
tres etapas básicas para conocer las necesidades del usuario potencial y con ello fa-
cilitar la navegación a través del sitio. El siguiente punto trata de los elementos de 
diseño de un sitio web, en él se contemplan cuatro elementos como primordiales: el 
color, la tipografía, los gráficos y el sonido. Se plantea el color desde sus caracterís-
ticas formales, categorías, propiedades, mezclas entre colores, llamadas aditiva en 
colores luz (muestra en pantalla) y sustractiva cuando son colores pigmento (sustan-
cias para impresión); ya en la Web el color se comporta de manera diferente, debido 
que cada usuario posee diversas características en su ordenador, se habla de aquellos 
factores que puedan ocasionar estas diferencia, como el tipo de imagen, la resolución 
del monitor, la resolución de la imagen y la profundidad del color. De acuerdo a esto se 
sugiere el uso de una paleta de colores seguros para la Web conocida como Websafe, 
el uso de estos colores asegura la visualización correcta del color como lo dispuso el 
diseñador. Pasando a lo referente a la tipografía se define brevemente su importancia, 
sus características y su empleo específico en la Web, donde se hace mención de los 
tipos especiales para publicaciones Web, que son aquellos que posee todo sistema ope-
rativo. Se habla también de la tipografía creativa, que consiste en modificar los tipos 
convirtiéndolos a gráficos, así mismo se presentanlas características y estilos tipográfi-
cos que son de gran utilidad para crear variedad visual dentro del texto que se incluye 
en las páginas. A continuación se mencionan las características de los gráficos y los 
formatos especiales para la Web, estos se clasifican en imagen, animaciones, botones 
y tipografía animada. Por ultimo, se toca lo relacionado con el sonido y los formatos 
más comunes empleados en los sitios Web. 
 El capítulo dos describe un panorama general de la empresa Telediez México, a 
través de los datos más relevantes acerca del papel que desempeña como televisora 
y la responsabilidad social que ello implica, esta recopilación reúne la historia de la 
empresa, su estado actual, los servicios que ofrece y la visión a futuro.
 El tercer capítulo muestra el desarrollo del proyecto basado en la metodología del 
diseñador Bruno Munari, primero se explica brevemente cuales son las etapas del mé-
todo y luego se desglosan secuencialmente los pasos adquiridos de ella. Se define cual 
es el problema y por lo tanto las necesidades de la empresa, después se recopila la 
información o datos necesarios y se analiza en un brief creativo, éste paso deja claros 
los límites y objetivos del sitio, a través de esto surge la creatividad y genera la lluvia 
de ideas (todas aquellas soluciones posibles del problema). Posteriormente se define 
la estructura visual del sitio y se crea un mapa de sitio que muestra todos los caminos 
posibles para llegar a la información. En la siguiente etapa se lleva a cabo la metodo-
logía propuesta para el desarrollo de la interface gráfica señalada en el capitulo uno. 
Para reconocer las necesidades de los usuarios se realizó una encuesta, que se puede 
consultar en el anexo. Subsecuentemente se desarrolla la navegación del sitio y se 
evalúa el resultado final de la interface sugerida, a partir de este punto se comienza 
a bocetar, para luego construir el entono completo en Flash, lo que sigue se refiere al 
código y funcionalidad del sitio, en este caso la funcionalidad se refiere al trabajo de 
construcción de los objetos para que funcionen correctamente, se enlazan las películas 
en un sistema en que se cargue solo lo que el usuario quiere ver y los demás archivos 
independientes no obstruyan ni su visualización ni el peso del sitio. Se plantea cual es 
la solución del sitio y finalmente se verifica el resultado. 
En la actualidad existe la red internet como medio de comunicación masiva, el cual ha 
representado un desarrollo tecnológico constante. Este medio aporta nuevas formas y 
aplicaciones de diseño, es por ello que en este campo se presentan retos y posibilida-
des para el futuro del diseño y comunicación visual, debido a que reúne características 
de los medios impresos y audiovisuales. 
 Internet funciona también como un medio comercial, este tipo de sitios pretenden 
lograr principalmente un fin lucrativo y a su vez favorece el posicionamiento de las 
empresas.
 Telediez, es una empresa joven en búsqueda de crecimiento continuo, pero aún no 
posee un sitio Web en internet que le dé presencia, métodos de publicidad y posiciona-
miento en el ramo de la televisión de paga y eso ocasiona un bajo reconocimiento de 
la empresa como casa productora, canal de servicio publicitario o simplemente como 
canal de entretenimiento e información. Dicho problema pretende ser resuelto con la 
inserción de la empresa en Internet. 
 El objetivo de este proyecto es diseñar un sitio para la empresa Telediez México, el 
cual le dé promoción con el fin de captar clientes para su sector de comercialización, 
proporcionando una solución práctica y eficiente que permita difundir y posicionar la 
imagen y marca de la empresa. Además, a través de este sitio Web se pretende difundir 
la empresa, los servicios que ofrece, así como una plataforma televisiva rentable para 
el público en general, obteniendo de esta manera una mayor cobertura y promoción de 
los canales de emisión. El sitio debe ser consistente con las expectativas de la empresa 
así como con las del usuario, por lo tanto debe contener características apropiadas 
para el acceso, alcance, manipulación y uso efectivo.
 
INTRODUCCIÓN
 El método empleado para la realización de este proyecto es la metología de diseño 
propuesta por Bruno Munari, acoplado a las etapas que sigue la creación de un sitio, 
incluida la metodología propuesta para la creación de la interface gráfica. El método 
de Bruno Munari permite el desarrollo creativo a través de los pasos que sugiere y a su 
vez es idóneo para proponer nuevos modelos de construcción.
 Con la publicación de un sitio Web de la empresa Telediez en Internet, realizado 
con propuestas ricas en cuanto a diseño y contenidos, será capaz de captar la atención 
y el interés del usuario y resolver problemas de promoción, posicionamiento y ventas 
de la empresa.
 Otro interés por abordar este tema es por que aún no hay muchos texto publicados 
acerca de como realizar un diseño Web, desde el punto de vista de que es importante 
no solo saber como se estructuran los sitios, sino conocer más acerca de los compo-
nentes y elementos de diseño que forman parte del sitio (color, tipografía, gráficos, 
sonido, etc.), su manipulación y puntos que hay que tener en cuenta antes de publicar 
un sitio en la red.
 El siguiente trabajo está dividido en tres capítulos. El primer capítulo trata de 
internet y sus características. El segundo capítulo abarca brevemente la explicación de 
lo que es un sitio Web y sus clasificaciones. El tercer capítulo se hace alusión al papel 
del diseño en la creación de sitios Web y sus elementos primordiales: color, tipografía, 
gráficos y sonido.
 Las dificultades presentadas a lo largo de este proyecto relacionadas a la parte de la 
investigación del marco teórico, derivan en la poca presencia de material bibliográfico 
en español relacionado a sitios Web, por esta razón se pretende aportar una base para 
los interesados en el diseño multimedia para la Web. La construcción del sitio presentó 
dificultades diversas, debido a que para una mejor funcionalidad y desempeño del sitio 
se separaron los contenidos en películas y se enlazaron en un sistema de niveles, con 
el fin de no perjudicar el tamaño general del sitio y optimizar la agilidad del tiempo 
de carga.
1
1.1 INTERNET
La red Internet es un territorio virtual 
al que puede acceder cualquier persona 
desde un ordenador, siempre que tenga 
los requerimientos indispensables para 
ello. Esta red, permite visualizar sitios 
Web que pueden contener información, 
imágenes, sonidos, animaciones y videos, 
para que el usuario disponga de ellos en 
forma conveniente según sus necesidades 
y objetivos. 
 Internet es uno de los avances tecno-
lógicos de mayor impacto en los últimos 
años; cada vez se hace más necesario en 
empresas, escuelas o instituciones de go-
bierno, con el fin de mejorar los negocios 
y la educación.
 “Es una red de información distribuida, 
pues la información no esta dispuesta en 
un servidor único”1. Un servidor es un or-
denador que tiene información disponi-
ble y la ofrece de manera libre o restrin-
gida al público por medio de conexiones 
entre ordenadores, bajo un sistema de 
cable especial. 
 Para lograrlo esta red emplea el lengua-
je TCP/IP (Protocolo de Control de trans-
misión / Protocolo Internet), que permite 
la localización y comunicación de topo 
tipo de máquinas conectadas. El sistema 
de nomenclatura en Internet es el DNS 
(Domain Name System, Nombre del Siste-
ma de Dominio): el protocolo IP usa unos 
números para identificar a cada computa-
dora en la red, para lograrlo descompone 
la información en pequeños paquetes. El 
paquete IP contiene la dirección del emi-
sor y la del receptor en forma de números 
de 32 bits que identifica en forma única 
cada equipo de la red; normalmente se 
dan en notación decimal, divididos por 
puntos en cuatro partes.
 Por ejemplo: 128.642.128.32 o192.56.32.9
 • La primera parte ellos representa el 
nombre del ordenador propiamente dicho, 
e identifica a las máquinas propias de una 
determinada organización. Es decir, las 
máquinas que se encuentran en una misma 
1 CARRADA, Yerenia. La aplicación de la comunicación gráfica en un sitio Web. p. 12 1
2
red tendrán una misma poción de sus direc-
ción IP que será común para todas ellas.
• El resto de campos forman el nombre 
del dominio identificador de una empresa 
u organización. Un dominio está organi-
zado de forma jerárquica y ascendente y 
debe tener un mínimo de 2 campos. El úl-
timo campo indica el tipo de organización 
o país al que pertenece.
 Existe otro protocolo al mismo nivel 
que TCP, el UDP (User Datagram Prot.) 
que ofrece servicios similares pero con 
una forma de llevarlos a cabo diferente.
 Recordar la dirección IP de un equipo 
puede resultar difícil, por ello es posible 
asignar un nombre o bien, varios alias. 
Tanto los nombres como los alias deben ser 
únicos en toda la red y estar definidos en 
el equipo que se este utilizando como ter-
minal; HOSTS es un archivo de texto que 
se puede utilizar para resolver nombres de 
dominio en direcciones IP de forma local. 
 Cuando se escribe un nombre de do-
minio en una aplicación TCP/IP (como un 
navegador web), éste nombre tiene que 
traducirse a una dirección IP antes de po-
der localizar el servidor solicitado. Este 
proceso de traducción se conoce como 
resolución de nombres. Por ejemplo: al 
escribir “www.telediez.com.mx” en la 
barra de direcciones de internet explo-
rer, se formulará una consulta de reso-
lución de nombres que responderá con 
la dirección IP correspondiente, en este 
caso (194.106.33.39) y finalmente se ac-
cederá al servidor web para cargar la pá-
gina. 
 Una página es la unidad básica para 
la estructura de un sitio Web; la Web es 
el componente más importante de la red 
Internet y su exploración se realiza por 
medio de un software denominado brow-
ser o explorador.
 “Las redes privadas se conectan en ge-
neral a Internet (o mejor, a otras redes per-
tenecientes a Internet) a través de Proxys 
o Gateways:”2 son enlaces entre dos redes, 
que además de proporcionar compatibilidad 
de protocolos, deben dar servicios de segu-
ridad, dirección, etc.
2 http://www.aunmas.com/future/internet/historia/ 2
33 Ibid.
4 http://www.master-net.net
1.1.1 BREVE HISTORIA DE INTERNET
La primera descripción documentada 
acerca de las interacciones sociales que 
podían ser propiciadas a través del net-
working (trabajo de red) esta contenida 
en un ensayo escrito en 1962 por J.R.C. 
Licklider sobre el concepto de red inter-
galáctica.
 En Julio de 1961 Leonard Kleinrock ex-
puso su teoría que decía: que la conmuta-
ción de paquetes en lugar de circuitos era 
el método más eficiente. Para explorar 
este terreno en 1965 “Roberts conectó un 
ordenador TX2 en Massachusetts con un 
Q-32 en California a través de una línea 
telefónica conmutada de baja velocidad, 
creando así la primera, aunque reducida, 
red de ordenadores de área amplia jamás 
construida”3. 
 En búsqueda de una solución al pro-
blema de la seguridad y supervivencia hu-
mana, Paul Baran de Rand Corporation, 
cuestiona la manera de crear un sistema 
de comunicaciones que permitiera a la 
milicia de Estados Unidos prever cualquier 
ataque y mucho menos la tan temida gue-
rra nuclear; pero esta red era frágil, razón 
que llevó a Blt, Beranek y Newman a di-
señar en 1969 una red que asegurase que 
la información llegara a su destino. Esta 
red, se llamo ARPANET (Advanced Rsearch 
Projects Agency, Agencia de Proyectos de 
Investigación Avanzados). 
 En sus inicios ARPANET se empleó fun-
damentalmente en instituciones militares 
y universidades. Una de sus motivaciones 
fue compartir recursos.
 En agosto de 1968, después de que 
Roberts y la comunidad de la DARPA hu-
bieran refinado la estructura global y las 
especificaciones de ARPANET, DARPA lanzó 
un RFQ para el desarrollo de sus compo-
nentes clave: los conmutadores de paque-
tes llamados interface message proces-
sors (IMP´s procesadores de mensajes de 
interface).
 “ARPA Internet empezó a ser utilizada 
por la NASA y otras agencias gubernamen-
tales, sirviendo de conexión entre todas 
las redes creadas por las Universidades y 
los estados federales basados en el proto-
colo TCP/IP (Transmision - Control Proto-
col/Internet Protocol)”4, desarrollado por 
Kahn como una nueva visión, que pudiera 
satisfacer las necesidades de un entorno 
de red de arquitectura abierta. 
 En 1978 inicia la explosión de Internet 
desde un nuevo conjunto de nichos indus-
triales de software y modems, que empie-
zan a crear computadores pequeños con 
potencial real de comunicarse vía MODEM. 
Más tarde, en 1989 Tim Berners-Lee crea 
un concepto de Hypertext que es compa-
tible con distintos sistemas operativos, 
3
4
dando nacimiento a la World Wide Web 
(gran telaraña mundial), mejor conocida 
como www.
 En 1986 la Fundación Nacional de Cien-
cias USA (NSF) contribuyó a la expansión 
de Internet, al desarrollar una red que 
conectaba a investigadores de Estados 
Unidos, con otros centros de supercompu-
tadoras, la cual comienza a reemplazar a 
ARPANET, que desaparece en 1990.
 En 1992 el número de computadores 
conectados crece a 1, 000,000 y el de re-
des a 7,500. Por primera vez la red trans-
porta video y audio. 
 Los países latinoamericanos, también 
han entrado de lleno a la conectividad ha-
cia la gran red Internet. Algunos de ellos 
como Costa Rica y Colombia, contemplan 
inversiones en instituciones académicas 
para la creación de redes. Por ejemplo, 
Costa Rica se conecta a BITNET en 1990 
enlazando el primer nodo de esta red in-
ternacional en Centroamérica. Formán-
dose la Red Nacional de Investigación de 
Costa Rica, CRNET, que es la plataforma 
para la interconexión de los países cen-
troamericanos a la gran red.
 En México los primeros intentos por co-
nectar computadoras en red se realizaron 
en las universidades. El campus Monte-
rrey del Instituto Tecnológico de Estudios 
Superiores de Monterrey (ITESM), fué la 
primera institución que se incorpora a la 
súper-red en 1988.
 En julio de ese mismo año, la Universi-
dad Nacional Autónoma de México, UNAM, 
se conecta permanentemente, mediante 
una línea privada de 9 600kbps al nodo del 
ITESM, quedando conectada a la red BIT-
NET. Debido al auge que obtiene el enla-
ce a las redes BITNET se decide fundar la 
asociación REDMEX, con la finalidad de in-
tegrar una gran red académica nacional.
 En 1993 Internet deja de ser una red 
únicamente al servicio de instituciones 
gubernamentales y universidades para 
convertirse en la red pública más grande 
del mundo, que ayuda a una amplia co-
munidad de investigadores y desarrolla-
dores.
 El año 1994 es decisivo en la historia de 
Internet, pues se eliminan las restricciones 
comerciales existentes hasta entonces, lo 
cual genera un aumento considerable de 
sitios lucrativos. 
 La Web se implementa, dando un auge 
importante a la cultura Internet, que no 
fue diseñada para una única aplicación, 
sino como una red dentro de la que po-
dían incorporarse nuevos servicios.
 El internet ha tenido un gran creci-
miento en muchos sentidos: contenidos, 
recursos, usuarios y plataformas tecno-
lógicas de acceso. Anteriormente era ne-
cesario desconectar el cable de teléfono 
para conectar a la red, hoy es posible co-
nectar vía satelital, por señal de cable o 
por un enchufe en la pared.
4
5
No se debe confundir Internet con la Web. 
La Web es solo una parte de internet que 
se define como hojas de texto que pueden 
estar enriquecidas de imágenes, sonidos, 
video, este conjunto de recursos puede 
accederse utilizando un navegador como 
Netscape o Internet Explorer, mediante 
el protocolo HTTP (HyperText Transport 
Protocol). 
 
 Este servicio se basa en hipertexto e 
hipermedia, esto significa que los enlacesdentro de un sito funciona de acuerdo a 
una codificación de lectura no lineal, ha-
ciendo uso de ligas o vínculos con textos 
alternos que pueden situarse en otro lugar 
o película del sitio. El hipertexto es un sis-
tema para manejar y organizar informa-
ción, en el cual los datos se almacenan 
en una red de nodos conectados por enla-
ces. Los nodos5 pueden contener textos, 
gráficos, imágenes, audio, animaciones y 
video, así como código ejecutable u otra 
forma de datos.
 A través de este servicio se puede ac-
ceder a diversos servidores Web en todo 
el mundo. Para la localización de esta 
información se hace uso de buscadores o 
browsers, que son los encargados de bus-
car en la red. 
DOMINIOS: Un nombre de dominio es una 
dirección en Internet. Con éste se hace 
más fácil recordar una dirección. (http://
www.empresa.com). 
 A través de la estructura del nombre 
de dominio se puede identificar que tipo 
de sitio es y su ubicación. Cabe mencionar 
que las abreviaturas designadas a cada 
país se determinan a través de la “norma 
ISO-3166”6, donde se identifica a los paí-
ses mediante dos letras de su nombre en 
inglés. Por ejemplo: 
Dirección de un sitio de España 
 “www.empresa.es”
De acuerdo al área estos son algunos tipos 
de dominio:
 .com comercio
 .edu educación
 .gob gobierno
 .mil ejercito
 .net soporte de internet
 .org organizaciones no lucrativas
 Si se contrata un nombre de dominio, la di-
rección de la página Web de la empresa ten-
dría una presencia más profesional, además 
de tener cuentas de correo personalizadas 
y ser más sencilla de recordar.
1.1.2 WORLD WIDE WEB
5 NODO: se le denomina a las páginas que conforman los enlaces de un sitio Web.
6 CARMONA, Araceli, Rediseño del sitio Web de la Escuela Nacional de Música, p. 24
5
6
La comunicación de datos por medio de 
la red Internet se ha convertido en una 
parte fundamental de los medios de co-
municación de las sociedades modernas. 
Internet es al mismo tiempo, medio de 
información, medio de comunicación y 
medio de transacción. Como medio de 
información, puede ser comparado con 
la prensa, la radio o la televisión, pero a 
diferencia de estos Internet ofrece conte-
nidos multimedia. 
 Como medio de comunicación, com-
pite con otros medios como el correo, el 
fax o el teléfono, con la ventaja de ser 
un medio más económico y ofrecer nuevas 
funcionalidades a sus usuarios, como por 
ejemplo: el correo electrónico, Chat, te-
lefonía IP, fax IP, videoconferencia, men-
sajería instantánea, etc. 
 Por último, Internet como medio de 
transacción se comporta como un gran 
mercado en el que tienen lugar las opera-
ciones de compra y venta de productos.
 La introducción de la red internet, 
ha obligado a las sociedades del mundo 
entero a disponer de los conocimientos 
necesarios para navegar en la red y estar 
al día con el conjunto de información que 
allí se maneja.
 “Especialmente en esta época de cam-
bios acelerados, creciente competitividad, 
libertad de mercado y globalización eco-
nómica, las personas deben tener muy 
presente el papel que desempeñan los 
medios de comunicación e información, en 
todos los ámbitos de su vida. En tal senti-
do, se puede citar, a manera de ejemplo, 
que para las organizaciones el éxito de 
la función gerencial depende de diversos 
factores, entre los cuales la visión que se 
tenga del ambiente donde está inserta se 
considera uno de los más importantes y en 
consecuencia, el camino de la innovación 
tecnológica ha contribuido notablemente 
con sus aportes, al desarrollo y expansión 
de las empresas modernas”7.
 Sin embargo, no todo son ventajas 
en este nuevo medio, ya que existen al-
gunas limitaciones que hay que tener en 
cuenta en relación al uso de Internet, 
por ejemplo: las limitaciones tecnológi-
cas que generan lentitud en su funciona-
miento. La falta de seguridad en la con-
fidencialidad en los datos de los usuarios 
y la ausencia de regulación de las normas 
de Internet.
 Quienes emplean la tecnología en su 
trabajo reciben 64 veces más información 
que hace 30 años. 
1.1.3 IMPORTANCIA DE INTERNET COMO MEDIO DE COMUNICACIÓN
7 Chttp://www.ilustrados.com/publicaciones/EpyVAAVupkbLSOVWin.php6
7
Internet ofrece la posibilidad de tener 
acceso a la información de todo tipo de 
temas. Es por esto que esta modificando 
lentamente y casi de manera impercepti-
ble las vidas de los usuarios.
 La atracción que este medio produ-
ce, puede causar una adicción en sus 
usuarios, muchos de ellos van dedicando 
cada vez mas horas a estar conectados a 
Internet, con lo que van abandonando ru-
tinas que anteriormente hacían. Hay per-
sonas que han hecho de esta tecnología 
una parte importante de sus vidas, es en 
ellas en quienes se pueden explorar, las 
consecuencias y cambios del impacto que 
provoca este medio.
 El profesor canadiense Marshall Mc-
luhan se dedicó a estudiar las relaciones 
entre los medios de comunicación y las 
sociedades que los albergan. A pesar de 
que Mc-Luhan no vivió la era de Internet, 
sus trabajos acerca de los medios electró-
nicos en general se acercan al problema 
del impacto de Internet en sus usuarios.
 Es fundamental conocer los lenguajes 
de la nueva cultura tecnológica – argu-
menta Mc-Luhan - porque “todos somos 
unos idiotas tecnológicos, que solo pensa-
mos en lo antiguo y no en el presente, en 
lo actual”8.
Negroponte argumenta que en cuanto a 
las nuevas tecnologías y su incorporación 
a la sociedad, “la vida digitalizada inclui-
rá muy pocas emisiones en tiempo real. 
A medida que las transmisiones se vayan 
digitalizando, todo el planeta se conver-
tirá en una maquinaria con un medio úni-
co(...) tecnología”9.
 Las nuevas tecnologías van creándonos 
un penetrante ambiente que nos satura 
con una serie de percepciones de las que 
no estamos enterados. Hay que analizar 
estos nuevos medios y para ello se debe 
entender que las nuevas tecnologías per-
turban las relaciones sensoriales y alteran 
la forma de pensar y de actuar.
 “La etapa de transición entre la era 
industrial y la post-industrial o era de la 
información, ha sido discutida tanto y du-
rante tanto tiempo, que ahora se vive la 
era de la pos-información“10 .
 
 De la misma manera que un sitio Web 
anula las limitaciones de la página impre-
sa, la era de la post-información anula las 
limitaciones geográficas. La vida digitali-
zada hace a las personas cada vez más in-
dependientes del hecho de tener que es-
tar en un lugar específico, en un momento 
determinado y depender de las comodida-
des que la tecnología nos ofrece.
1.1.4 IMPACTO DE INTERNET EN LOS USUARIOS
8 MCLUHAN, Marshall y Parker, Harley. Counterblast citado por Velasco, Javier. El impacto de Internet en sus usuarios. Pág. 82
9 Ibid.
7
10 Ibid.
8
 La penetración de Internet en el ámbi-
to empresarial ha provocado importantes 
cambios en esta área. Las empresas que 
quieren estar a la vanguardia en su sec-
tor de comercialización, deben aprove-
char las nuevas herramientas informáticas 
como medios para definir una estrategia 
en la cual ofrecer sus productos o servi-
cios al público.
 La red Internet ofrece a las empre-
sas una dimensión global que les permite 
rebasar las barreras geográficas y tem-
porales, para llegar a un número mayor 
de receptores que pueden convertirse en 
clientes potenciales de su negocio. Cada 
día, son más las empresas que adoptan en 
sus estrategias el servicio de Internet de 
subir a la red un sitio Web en el que se 
incluya toda la información que el usuario 
desea saber para considerar adquirir pro-
ductos o servicios.
 Es una excelente opción para empresas 
que buscan ampliar sus mercado a otros 
países e incluso continentes. Los sitios 
comerciales bien estructurados, puede 
convertirse en una herramienta poderosa 
para persuadir al usuario y convertirlo en 
cliente de la empresa.
 La red internet cada día se convierte 
en una necesidadapremiante en las em-
presas y significa una avance de las comu-
nicaciones en el ámbito de los negocios y 
la educación.
 Gracias a este nuevo sistema de co-
municación e información, cada una de 
las etapas comprendidas en los procesos 
básicos de las organizaciones, (creación, 
producción, comunicación, venta, servi-
cio y control), pueden encontrar amplias 
posibilidades de proyección para resolver 
operaciones de cualquier tipo, también 
para simplificar o suprimir pasos innecesa-
rios, detectar irregularidades, e inventar 
nuevas maneras de coordinar procesos, de 
un modo más ágil y efectivo, en busca de 
la innovación.
 Además el servicio de hosting en 
Internet que se explicará más adelante, es 
mucho más económico que otros medios 
de comunicación que ofrecen espacios pu-
blicitarios, como la televisión, la radio, la 
prensa, por mencionar solo algunos.
1.1.5 INFLUENCIA DE INTERNET EN EL ÁMBITO EMPRESARIAL
8
9
Internet es una red que ofrece múltiples 
servicios, básicamente esa es su razón de 
ser. Un Servicio de Internet es una aplica-
ción que se le proporciona al usuario para 
que pueda hacer uso de él, entre ellos po-
demos encontrar los siguientes:
 • CORREO ELECTRÓNICO (E-Mail)
Es un tipo de comunicación que permite 
intercambiar mensajes entre usuarios de 
computadoras. Estos mensajes, pueden 
contener archivos con imágenes, video, 
animaciones y audio. Es la aplicación de 
mayor uso en la red y ofrece la posibili-
dad de enviar información a un grupo de 
personas.
 • PROTOCOLO DE TRANSFERENCIA DE 
ARCHIVOS (FTP) 
 “Este servicio se utiliza principalmente 
para transferir archivos o software de una 
computadora a otra a través de Internet 
(…)”11. La aparición de la Web es realmen-
te reciente. Antes la transferencia públi-
ca de información se hacía con texto, más 
tarde la Web introdujo las posibilidades 
gráficas y los hiper-enlaces, lo que la con-
vierte en la herramienta más poderosa de 
información en Internet. 
 • CORREO DE NOTICIAS O NEWS GROUPS
 “Es un servicio al que se puede acceder 
a informes de noticias de cualquier tema 
que nos interese”12 Estos usuarios con un 
interés común, reciben y envían textos 
sobre ese tema. 
 • CONFERENCIAS
 Con este servicio se puede mantener 
una conversación entre varios usuarios de 
la red, mientras ven a su interlocutor. Las 
conferencias pueden sostenerse de tres 
maneras posibles: texto (donde se teclea 
el texto para comunicar algo con el o los 
receptores), con sonido (a través de un 
micrófono y altavoces) y las videoconfe-
rencias (donde se requiere de una video-
cámara y micrófonos en cada una de las 
terminales).
 • CHAT
 Mediante el chat se puede estable-
cer una conversación en tiempo real, con 
una o varias personas que usen simultá-
neamente el servicio, no importando en 
que lugar y a que distancia se encuentren. 
Además este sistema permite enviar y re-
cibir archivos y en algunos escuchar mú-
sica.
 • TELNET
 Este servicio es conocido como pro-
tocolo de acceso a terminales virtuales, 
que permite que desde una computadora 
se pueda acceder a varios equipos mul-
tiusuarios, este proceso requiere conocer 
la dirección IP del equipo al que se desea 
conectar o bien su alias en la tabla de hosting.
11 CARMONA, Araceli, Rediseño del sitio Web de la Escuela Nacional de Música, p. 24
12 Ibid. P. 25
1.1.6 SERVICIOS DE INTERNET
9
10
Hosting es un servicio de hospedaje que 
prestan algunos proveedores de Internet 
(ISP), a través del cual brinda a sus clien-
tes un espacio dentro del servidor para la 
operación del sitio. Otros autores la de-
finen como, una computadora capaz de 
atender peticiones a través del protocolo 
HTTP. Las grandes empresas poseen cen-
tros de cómputo que les permiten atender 
las necesidades de toda su corporación en 
un solo lugar. Sin embargo, los costos aso-
ciados de mantenimiento, conectividad y 
desarrollo de estos sitios, hacen imposible 
de mantener un centro de esta naturaleza 
a un negocio mediano o pequeño.
TIPOS DE HOSTING
- HOSTING COMPARTIDO
 Si se requiere colocar un sitio (comer-
cial o no) dentro de la Web. El primer ni-
vel de servicio de un anfitrión Web coloca 
su sitio entre otros muchos en una sola 
máquina, en un dominio virtual que indi-
ca la ubicación de su sitio en la máquina, 
esto se conoce como hosting compartido y 
tiene las siguientes características:
Descripción: El sitio reside en el mismo 
servidor que otros sitios.
Pros: Bajo costo, poco mantenimiento, 
quizás una mejor conexión.
Contras: Menos control, posibles proble-
mas de desempeño y de seguridad. 
 - HOSTING DEDICADO:
 A medida que un sitio crece, es probable 
que pase a una máquina con más recursos 
y menos sitios que compitan por esos re-
cursos. El siguiente paso, es una máquina 
dedicada en el sitio del anfitrión. El anfi-
trión es propietario del servidor, lo man-
tiene y lo respalda, además de proporcio-
nar toda la seguridad física del sitio, es 
decir, administra todos los aspectos de un 
centro de datos.
Descripción: El anfitrión Web proporciona 
un servidor solo para su sitio.
Pros: Mayor control, más opciones de 
software, más opciones de configuración, 
buena conexión.
Contras: Costos más altos de software y 
mantenimiento, menos opciones de hard-
ware.
- HOSTING DE COLOCACIÓN:
 El servicio más elevado que se ofrece 
en el Web hosting es la colocación de un 
servidor. En este caso, usted es propietario 
de la caja de hardware, pero físicamente 
se localiza en la instalación del anfitrión 
para aprovechar la planta física. Se elige 
el ancho de banda que necesita. 
Descripción: Un servidor de su propiedad 
reside en el sitio del anfitrión Web.
1.1.7 HOSTING, MANTENIMIENTO Y ADMINISTRACIÓN DE UN SITIO
11
Pros: Control total, que puede incluir la 
seguridad; acceso sin obstáculos a la co-
nexión con Internet, control y respaldo de 
energía.
Contras: Aumento en los costos de mante-
nimiento, que quizá incluyen experiencia 
en seguridad; incrementos en los costos 
del servidor y el software.
- HÁGALO USTED MISMO:
 Antes de considerar esta opción debe 
considerarse cuál es el negocio, cuál es el 
propósito de mantener un sitio Web, cuán-
to tiempo, recursos financieros y técnicos 
se tiene y se puede invertir en el mante-
nimiento del sitio, si a esto se le suma la 
seguridad y respaldo de información que 
el tener este tipo de hosting implica un 
costo muy alto.
 Descripción: Servidor propio y la conexión 
con Internet en su planta física.
Pros: Control total, acceso instantáneo al 
hardware y al sitio; flexibilidad en el soft-
ware y la configuración.
Contras: Mucho trabajo, requiere de ex-
periencia técnica; altos costos del equipo, 
la conexión directa con Internet, y más.
ESPACIO PARA EL SITIO
Existe una buena regla para tontos: 4Mb. de 
tamaño es un buen comienzo para una pagi-
na regular, pero probablemente crezca hasta 
los 8Mb. La renovación es común y necesaria 
para perfeccionar la estética del sitio y 
sus contenidos, esto genera como conse-
cuencia un aumento en el peso. La can-
tidad de megas disponibles depende del 
tipo de hosting y servidor que se contrate 
para el servicio.
ADMINISTRACIÓN Y MANTENIMIENTO
El encargado de administrar el sitio Web de-
berá mantener en condiciones óptimas su 
funcionamiento. Si un sitio contiene la for-
ma de permitir al usuario sugerir o comentar 
algo, o bien, si se ofrece peticiones de in-
formación vía mail, el encargado deberá ser 
responsable de contestarlas lo más rápido 
posible y archivar los mensajes importantes 
para analizar objetivamente cambios perti-
nentes de acuerdo a las necesidades de los 
usuarios.
 Algunos tipos de hosting muestran re-
sultados de la actividad del sitio en la red, 
por ejemplo el número de visitantes por 
día, si se añadió el sitio como favorito, 
etc. datos útiles para observar la acepta-
ción e interés del público, como pueden 
ser informes sobre:
- Estadísticas Web
- FTP estadísticas
- Historial de tráfico
-Informe de dominio
- Preferencias
- Límites del hospedaje.
12 13 KETTEL Jennifer, Dreamweaver4, p. 148
14 LYNCH Patrick, Principios básicos para la creación de sitios Web, p.1-4
Un sitio Web es un conjunto de archivos 
electrónicos y páginas Web referentes a 
un tema en específico, que incluye una 
página inicial de bienvenida, generalmen-
te denominada home page, con un nombre 
de dominio y una dirección en Internet es-
pecíficos y páginas de contenido que man-
tienen una estructura de acceso con la 
inicial. Por lo tanto la página es la unidad 
fundamental de un sitio.
 Literalmente existen millones de sitios 
y cada uno de ellos comunica un mensa-
je diferente lo cual provoca una emoción; 
algunos sitios pueden causar frustración, 
incluso el usuario puede resultar intimida-
do ante el diseño o la manera de mostrar 
los contenidos. 
 Un sitio efectivo es aquel que presenta 
el diseño y los contenidos con el mismo fin 
de provocar la respuesta emocional que 
se pretende.
 De acuerdo a Jennifer A. Kettel13 y 
a Patrick Linch14 estas son las claves para 
determinar la planificación de un sitio:
- DETERMINAR EL PROPÓSITO DEL SITIO para 
encontrarse en la Web y para ser visitado, 
en base a ello saber de que modo la cons-
trucción de este sitio apoyará el propósito 
de la empresa.
Los sitios Web son usados por las institu-
ciones ya sean públicas y privadas, organi-
zaciones o personas con un fin especifico. 
En el caso de las empresas la finalidad es 
ofrecer sus productos o servicios con un 
fin lucrativo.
- IDEAR UN TONO O ARGUMENTO DE COMUNICA-
CIÓN para dicho mensaje dependiendo, 
claro esta, del tipo de público al que se 
dirige el sitio.
- DESCOMPONER EL MENSAJE EN FRAGMENTOS 
DE INFORMACIÓN, que posteriormente se 
convertirán en páginas individuales.
- CREAR UNA ESTRUCTURA DE NAVEGACIÓN para 
permitir a los usuarios desplazarse por el 
sitio de una manera lógica. Cuando una 
persona llega por primera vez a un sitio, 
ocurre un proceso muy rápido en que la 
persona aprende a navegar por él, y es 
importante que este aprendizaje sea lo 
más fácil posible. Es por ello que convie-
ne apegarse al estándar, por lo menos en 
cuanto a la estructura de los contenidos, 
sin descuidar el diseño y tratar de producir 
un sitio Web que responda a las caracte-
rísticas que el usuario promedio espera.
- DISEÑAR UNA APARIENCIA VISUAL, incluyendo 
la estructura del menú, la tipografía y las 
imágenes.
1.2 SITIOS WEB
13
1.2.1 CLASIFICACION DE SITIOS WEB
Actualmente, la gran mayoría de los conte-
nidos en la Web buscan el respaldo econó-
mico que la publicidad ofrece, lo cual fun-
ciona siempre y cuando las herramientas 
publicitarias sean usadas correctamente. 
De este modo, los ingresos de ventas pro-
ducidos por esta publicidad se convierten 
en el pago del público por el contenido.
 Definir el propósito de un sitio Web es 
tan importante como la definición misma 
del objetivo de una empresa. En la ac-
tualidad los sitios se pueden clasificar de 
acuerdo a su propósito en la Web de la 
siguiente manera:
 • SITIOS CORPORATIVOS: Son sitios orien-
tados a la mercadotecnia de su empresa 
para promover sus productos y servicios y 
generar nuevas oportunidades de negocio. 
Sus características básicas son publicar in-
formación relevante acerca de la empre-
sa, el catálogo de productos, programas 
de calidad, asociaciones y certificaciones, 
información técnica y formas de contac-
to, entre otros. 
 • SITIOS DE COMERCIO ELECTRÓNICO: 
Este tipo de sitios fungen como tiendas 
virtuales que tienen como principal obje-
tivo la venta de mercancías a través de 
Internet. Se da poca relevancia a la infor-
mación acerca de la empresa, centrándo-
se mas bien en los propios productos. 
 • SITIOS INFORMATIVOS: El propósito de 
este tipo de sitios es difundir información, 
misma que varia de acuerdo con el enfo-
que de la organización y con los intereses, 
deseos y necesidades de los posibles visi-
tantes del sitio.
 • SITIOS DE ENTRETENIMIENTO: Exis-
ten una infinidad de sitios para char-
lar, convivir virtualmente, escuchar 
música, exhibición de films, juegos, en 
fin, básicamente lo que pretenden es 
entretener. 
 • SITIOS DE NAVEGACIÓN O PORTALES: 
son sitios guía de búsqueda dentro de la 
red.
 • SITIOS DE COMUNIDAD: el objetivo de 
estos sitios es lograr un punto de encuen-
tro entre varias personas, el contenido 
varía dependiendo al grupo de personas al 
que se dirige. Una comunidad se constru-
ye sobre la base de una interacción regu-
lar entre los visitantes con necesidades de 
información afines.
 • SITIOS PERSONALES O PÁGINA PERSONAL: 
la finalidad de estos sitios es lograr un fin 
personal en la Web, por ejemplo un sitio 
que contenga un resumen de conocimien-
tos con la esperanza de contactar con al-
guien interesado en sus servicios profesio-
nales. 
14
1.2.2 COMPONENTES BÁSICOS DE UN SITIO WEB
Todo sitio Web debe tener un propósito 
para estar en la red internet, además de 
poseer un estilo, una estructura y conteni-
dos variados según sus objetivos. Aquellos 
sitio cuyo propósito es informar coinciden 
en algunas características A continuación 
se mencionan las más importantes.
- PÁGINA PRINCIPAL O HOME
La página principal funciona como pági-
na de entrada hacía un conjunto de pági-
nas internas, su dirección URL será la que 
conduzca al usuario hacia el sitio.
 Esta página tiene la función de mos-
trar al visitante un panorama amplio del 
tema y los contenidos generales del sitio, 
por lo tanto debe ser atractiva e intere-
sante visualmente, capaz de sugerir infor-
mación rápida del tipo de navegación con 
que funciona el sitio. 
 Además debe ser aprovechada positiva-
mente ya que es la página más visitada del 
sitio, por esta razón funciona bien para 
publicar noticias e información reciente, 
lo cual puede propiciar que el usuario re-
pita su visita, pero por otro lado, debe 
cuidarse no perder de vista el objetivo 
y la estructura general ya que el usuario 
puede confundirse si esta página cambia 
con demasiada frecuencia.
 Puede darse el caso de que en sitios 
muy grandes esta página principal funcio-
ne para dividir a los usuarios dependiendo 
sus intereses, este tipo de páginas se les 
denomina página principal orientada.
 
 “El área visible de un sitio Web esta 
representada en los ochenta centímetros 
superiores de toda página principal”15. 
Esta medida es segura incluso para su vi-
sualización en monitores de trece a quince 
pulgadas. Por esta razón la parte superior 
de esta página debe contener datos de 
mayor importancia que la inferior, como 
se muestra en el siguiente esquema.
 
Área visible 
del sitio 
incluso en 
monitores 
pequeños
Para 
visualizar esta 
área el usua-
rio deberá 
usar la barra 
de desplaza-
www.diseñodigital.com
15 LYNCH Patrick, Principios básicos para la creación de sitios Web p.36 
15
 En ocasiones las páginas principales se 
acompañan de una página de bienvenida 
que sugiere una animación como preám-
bulo a la descarga general del sitio. Es-
tas también son conocidas como splash 
screens. Algunos usuario solo ven a este 
tipo de página como una demora en la vi-
sualización de un sitio, por ello debe con-
siderarse dependiendo el tipo de conteni-
dos y por ende del tipo de usuario al que 
se enfocan
- PÁGINAS INTERNAS O SUBPÁGINAS
Son aquellas páginas que se abren al se-
leccionar un vínculo del menú, por lo que 
su función es mostrar los contenidos del 
sitio. Estas páginas a su vez son un nodo 
para llegar a otro grupo de páginas. Es-
tas deben mantener el mismo formato y 
la misma línea de diseño con la principal, 
de lo contrario causarían confusión en la 
navegación.
 Estas páginas deben ser autónomas 
en caso de que el usuario no llegue al 
sitio por medio de la página principal 
sino por medio de un enlace desde otro 
sitio o buscador. En este caso el usuario 
debe tener posibilidades de ir al home 
o visualizar un listado que le informe en 
que lugar del sitiose encuentra y hacía 
donde puede ir.
 Las páginas internas de acuerdo a su 
contenido pueden considerarse de la si-
guiente manera:
 • PÁGINA DE PREGUNTAS FRECUENTES (FAQ)
 (Frecuent Asked Questions)
La red y otros medios basados en Internet 
han fomentado una característica exclu-
siva: las FAQ (preguntas más frecuentes); 
una página donde se enlistan las pregun-
tas más comunes de los usuarios, junto a 
sus respectivas respuestas. Muchas de las 
preguntas que se hace un nuevo usuario 
ya han sido respondidas con anterioridad. 
Una página FAQ bien diseñada puede me-
jorar la comprensión de la información y 
de los servicios que se ofrecen.
 
 
 • MAPA DE SITIO O LISTA DE CONTENIDOS
Son una forma especial de comunicación 
visual. Sus funciones dentro del sitio:
- Dar una visión global del contenido del 
sitio Web.
- Ayudar al usuario a encontrar informa-
ción que navegando de enlace en enlace 
tardaría más en localizar.
- Puede ayudar al usuario que se ha perdido.
16
 El acceso a este enlace se debe co-
locar en una zona visual de nivel jerár-
quico alto, y de ser posible este enlace 
debe mantenerse en todas las páginas. 
La lógica visual: tiene un papel vital en la 
capacidad de percibir el significado de un 
diagrama. De hecho, un sitio Web es una 
abstracción multidimensional invisible, 
pero podemos entenderla como una serie 
de tarjetas o recuadros conectados.
 La creación del mapa de un sitio Web 
requiere de varios pasos: En primer lugar 
debe definirse el tipo de información que 
se va a presentar. Se pueden ilustrar mu-
chas dimensiones posibles; profundidad del 
click, tipo de página, agrupación lógica, 
principal trayecto de navegación, vínculos 
de la página o con otras, etc. A continua-
ción hay que clasificar el contenido del si-
tio de acuerdo con el tipo de información. 
Por último se debe de organizar la infor-
mación en un esquema visual, eligiendo 
lo que se va a utilizar para representar las 
relaciones de vínculo. Pero lo más difícil es 
decidir lo que el mapa debe revelar sobre 
el sitio Web. ¿Qué se intenta mostrar? 
Para crear un mapa de sitio se deben con-
siderar diversas variables:
 a) El destinatario del mapa
 b) La naturaleza del sitio
 c) Medio en que se visualizará 
 • PÁGINA DE CONTACTO
En esta página se puede concentrar infor-
mación sobre los teléfonos, dirección, co-
rreo electrónico e-mail, fax, e incluso un 
formulario bidireccional para responder a 
peticiones del público y conocer su opinión 
del sitio. Además de facilitar la información 
del Webmaster o desarrollador del sitio.
Ejemplo de mapa de sitio
Ejemplo de página de contacto
17
- SPLASH SCREENS:
 El Splash o página de bienvenida tiene 
la finalidad de mostrar al visitante el nom-
bre del sitio, proporcionando información 
sobre las características y requerimientos 
del sitio para que el usuario pueda perci-
birlo de manera correcta. 
 
 Para lograr que la visualización de está 
página no se torne tediosa, debe estar jus-
tificada en función del tipo de ususario co-
mún que accederá a ella. 
 Dentro de estás páginas es común encon-
trar un vinculo textual para ver o saltar la 
presentación inicial o --, ya que para el visi-
tante constante sería tedioso tener que ver 
la animación cada vez que ingresa al sitio.
Ejemplo de splash screen
18
- MENÚS
Son las listas de opciones que enlazan las 
páginas internas. La mayoría de los sitios 
Web utilizan menús, dentro de ellos pode-
mos encontrar dos variantes:
 - Menús sencillos: conjunto de opcio-
nes que sirven de enlace directo hacia el 
contenido.
 - Menús desplegables: donde muestran 
opciones de las que el usuario debe elegir 
la que le interese desde un mismo lugar 
sin necesidad de navegar cada uno de los 
contenidos desde otra página.
19
Se refiere al estudio de agrupar, definir, 
catalogar y diseñar la información, con el 
objetivo de guiar al usuario en la navega-
ción del sitio.
 “El contenido de Arquitectura de in-
formación no solo engloba la actividad de 
organizar información, sino también el re-
sultado de dicha actividad”16. 
 Según Saul Wurman, plantea que “el 
arquitecto de Información es la persona 
que organiza los patrones inherentes a 
la información, haciendo entendible lo 
complejo” o también, que es “una perso-
na que crea un mapa de información que 
permite a otros encontrar su vía personal 
hacia el conocimiento”17.
 Un sitio se construye a partir de una 
estructura básica, que será la que con-
ducirá la navegación de la interface y la 
que moldeará los esquemas mentales del 
usuario de cómo esta organizada la infor-
mación dentro del sitio Web.
 Construir una jerarquía de información 
eficiente, significa ordenar los datos en 
ramificaciones cortas, minimizando así el 
número de pasos requeridos para llegar al 
punto de interés.
 
 Para la organización de la información 
se debe dividir el contenido en unidades 
lógicas, facilitando así el acceso a la infor-
mación ya que los usuarios promedio en la 
Web no leen, o por lo menos no lo hacen 
de la misma forma secuencial que cuando 
tienen en sus manos un libro. Lo usuarios 
tienen necesidades y objetivos y la forma 
de alcanzarlos no suele ser dedicando lar-
gos ratos en cada sitio Web que visitan.
 El usuario ante una página elegirá so-
bre el enlace que crea que puede dirigirle 
a lo que busca, necesita o interesa. Ante 
esta situación, no podemos predecir cual 
será el camino que el usuario seguirá du-
rante su exploración en el sitio, pero sí, 
cuales serán las zonas en las que preste 
mayor atención.
 La jerarquía de la información estable-
ce analogías del tipo “esto es más impor-
tante que esto”. Un estudio realizado por 
Yusef Hassan Montero18 demuestra que 
para enfatizar esta jerarquía se utilizan 
diversas técnicas:
• Colocar la información más importante 
en zonas del interface más importantes.
• Enfatizar mediante efectos tipográficos.
• Aumentar el tamaño de textos de mayor 
importancia.
1.2.3 ARQUITECTURA DE LA INFORMACIÓN
16 FERNÁNDEZ, Francisco Jesús Martín, http://www.nosolousabilidad.com/articulos/ai.htm
17 WURMAN, Saul, Information Architects , citado por Juan C. Camus, www.usando.info/main_file.php/usai/8485/
18 YUSEF Hassan Montero, http://www.nosolousabilidad.com/articulos/hipermedia.htm
20
• Utilizar el contraste del color para dis-
tribuir y discriminar objetos informativos
• Agrupar objetos informativos relaciona-
dos entre si.
 Si al diseñar la arquitectura de un sitio 
se defi nen demasiados objetos como “muy 
importantes”, se producirá sobrecarga de 
información en el usuario. Y el objetivo 
de guiarlo en su búsqueda habrá fallado.
 ¿Cómo se defi ne cuál es la información 
importante? Cualquier enlace, párrafo o 
dato que satisfaga las necesidades del 
usuario es importante. La arquitectura 
de la información de un sitio Web se debe 
realizar con el fi n de satisfacer necesida-
des del usuario y mediante un esquema 
que sea entendible. 
 Una vez que se ha defi nido la arqui-
tectura de la información y estructura de 
los contenidos se deben construir peque-
ños prototipos de partes de la Web para 
visualizar como se adaptarán los conteni-
dos del sitio y su navegación. Un conjunto 
bien estructurado de enlaces y elementos 
gráfi cos para la navegación atraerá positi-
vamente la atención del usuario.
Existen cuatro estructuras básicas para un 
sitio Web:
1. Jerárquica: es una manera de organi-
zar cuerpos de contenidos complejos de 
información. Este tipo de esquemas en-
caja perfecto en la organización de sitios 
Web; además la mayoría de los usuarios 
tienen familiaridad con este esquema, 
pues es común en instituciones, compa-
ñías u organizaciones. 
 La página principal se ramifi ca hacia 
las páginas relacionadas, que amplían el 
original de diversas maneras y a su vez es-
tas tienen sus propias ramifi caciones.
Esquema de estructura jerárquica
21
2. Lineal o Secuencial:Es la forma más 
sencilla, puede darse a partir de una cro-
nología, un orden alfabético, o una serie 
lógica que parta de lo general a lo parti-
cular. Es similar la estructura de un libro.
3. Retículas (grids): es una buena for-
ma de organizar una serie de categorías, 
eventos, tecnologías y cultura.
 
 Las unidades individuales de la retícula 
deben compartir una estructura de temas 
y subtemas de manera uniforme. Pero las 
mallas o retículas pueden ser de difícil 
comprensión para un usuario que no co-
nozca esas relaciones entre las categorías 
de información. Por esta razón este tipo 
de estructura es más bien para usuarios 
experimentados en el tema.
4. Telaraña (Web): Este tipo de estructu-
ras permiten al usuario seguir sus propios 
intereses y generar sus propios caminos 
de navegación. Este tipo de estructuras 
pueden crear confusión con facilidad, de-
bido a su gran cantidad de enlaces
Esquema de estructura lineal
Esquema de estructura en retícula
Esquema de estructura de telaraña
22
Diseño es la actividad creativa cuyo 
propósito es proyectar, coordinar, se-
leccionar y organizar un conjunto de 
elementos para crear objetos visuales 
destinados a comunicar mensajes espe-
cificos a grupos determinados.
 
 El diseño actualmente vive una tran-
sición al acoplarse a los nuevos medios 
de interactividad. La red internet abre 
un nuevo campo de aplicación para los 
diseñadores, un campo que aún está en 
formación y presenta retos y nuevas po-
sibilidades. 
 Los diseñadores de sitios Web deben 
ofrecer al usuario sitios accesibles, y 
utilizables, que transmitan de forma vi-
sual una idea o conjunto de ideas de for-
ma sencilla, entretenida, organizada e 
interactiva. De ahí la importancia del tra-
tamiento de la interface que es responsa-
ble de la interacción entre los usuarios y 
el entorno del sitio.
 Una primera regla para diseñar un sitio 
Web es pensar en las necesidades y deseos 
de los clientes potenciales. El éxito del 
sitio como herramienta de mercadotecnia 
se basa en cómo se organizan los conteni-
dos para responder en forma conveniente 
todas las preguntas del cliente.
 El diseño visual del sitio determinará 
el marco de organización y distribución 
de los contenidos y este debe de ir en 
función de los deseos del público al que 
se dirige el sitio y que es lo que se quiere 
decir. Por lo tanto, “el principio básico 
o fundamental de organización en el di-
seño de un sitio Web es conocer bien las 
necesidades del usuario.”19 
 Todos los sitios hacen uso de algunos 
elementos de diseño, como el punto, la 
línea, el color, la tipografía, los gráficos, 
el sonido, etc. que pueden ser manipula-
dos por el diseñador del sitio a favor de un 
concepto o mensaje que se quiera hacer 
llegar al usuario.
 Conocer las variantes y propiedades 
de estos elementos de diseño ayudará al 
diseñador a manipularlos satisfactoria-
mente para obtener un diseño agradable 
y funcional.
 Además de que en internet el cambio y 
la renovación son constantes, también el 
diseño debe evaluarse en cuanto a crite-
rios de comunicación, decisiones gráficas 
y la intensión de como se desea que le 
usuario navegue por la página.
19 LYNCH Patrick, Principios básicos para la creación de sitios Web, p.23 
20 TROCEAR: es dividir la información en fragmentos sintéticos para facilitar la lectura de textos largos o pesados.
1.3 EL DISEÑO Y COMUNICACIÓN VISUAL EN UN SITIO WEB
23
1.3.1 CONCEPTOS DE DISEÑO RELACIONADOS CON EL SITIO WEB
Las decisiones en el diseño incluyen la 
determinación de elementos visuales que 
conforman la esencia de lo que se percibe 
y proporcionan opciones fundamentales 
para comunicar ideas y conceptos de una 
forma clara y directa, por medio de los 
elementos gráficos.
ELEMENTOS BÁSICOS: 
 
Los elementos visuales conforman la 
esencia básica de lo que se puede perci-
bir, formando un todo que enrriquece la 
experiencia visual.
 Las imágenes pueden descomponerse 
en unidades de significación más peque-
ñas en función de algunos de sus compo-
nentes.
- EL PUNTO:
El punto es la unidad mínima de informa-
ción visual, y está caracterizado por su 
forma (generalmente circular, pero tam-
bién puede ser rectangular, como ocurre 
en los monitores, triangular o una mancha 
sin forma definida), por su tamaño, por su 
color y por la ubicación que tenga dentro 
de la composición gráfica.
Las principales características del punto 
son:
 • Tiene un gran poder de atracción visual, 
creando tensión sin dirección. 
 • Cuando se sitúan próximos dos puntos 
pueden producir sensaciones de tensión 
o de dirección, creando en la mente del 
espectador una línea recta imaginaria 
que los une. 
 • Si se sitúan diferentes puntos en prolon-
gación sugieren una dirección, un camino, 
más acentuada cuanto más próximos es-
tén los puntos entre sí. 
- LA LÍNEA:
La línea es el elemento básico de todo 
gráfico. Sirve para conectar dos puntos 
en el espacio, por lo que puede definirse 
también como un punto en movimiento 
o como la historia del movimiento de un 
punto.
Las principales propiedades de la línea son:
 • Contiene gran expresividad gráfica y 
mucha energía. 
. ......
Atracción del punto Puntos y dirección
24
 • Casi siempre expresa dinamismo, movi-
miento y dirección. 
 • Crea tensión en el espacio gráfico en 
que se encuentra. 
 • Crea separación de espacios en el gra-
fismo. 
 • La repetición de líneas próximas genera 
planos y texturas. 
Las propiedades de una línea estan defini-
das por su grosor, su longitud, su orien-
tación (dirección) respecto a la página, 
su ubicación (posición), su forma (recta 
o curva) y su color. Estas propiedades se 
verán afectadas también por el número de 
líneas que haya en la composición, su proxi-
midad y la orientación relativa entre ellas.
- PLANOS EN EL DISEÑO:
Un plano de diseño es un espacio definido 
por bordes que establecen el área donde 
se agrupan los elementos visuales de una 
composición. En el caso de un sitio Web, 
el plano equivale a la pantalla de un mo-
nitor, que tiene forma rectangular. La dis-
tribución de los elementos en cada página 
es muy importante. Y para ello, es indis-
pensable elegir el tamaño ideal de la pá-
gina dependiendo del giro de la empresa 
y la variedad de información y productos 
o servicios que deseen anunciar.
 
PERCEPCIÓN DE LO VISUAL:
En la comunicación visual el diseñador 
debe conocer cuales son las leyes que 
guían la percepción de las cosas y las sig-
nificaciones culturales que pueden tener 
ciertos elementos. Es decir, cómo es el 
proceso de la percepción física y psicoló-
gica de los objetos, para poder influir en 
el receptor del trabajo de diseño. 
 La forma de distribuir los elementos 
debe estar basada en una estructura in-
terna que tenga una relación con el men-
saje que se desea transmitir. En el caso de 
un sitio Web la elección del color, de las 
imágenes o de la disposición de la infor-
mación debe mantener una relación cohe-
rente con la estructura.
Factores psicológicos que intervienen en 
la percepción: 
25
COMPOSICIÓN:
La composición de un diseño implica la 
adecuación de distintos elementos gráficos 
dentro de un espacio visual, combinándolos 
de tal forma que todos ellos sean capaces 
de poder aportar un significado para trans-
mitir un mensaje claro a los receptores del 
mensaje. 
 El diseñador debe tener siempre presen-
te, que cada elemento de la composición, 
en función de la ubicación, dimensión o 
importancia que se le asigna, experimenta 
pequeñas variaciones en su significado. Por 
tanto, es importante la posición que se le 
da a cada uno de los elementos y encon-
trar el equilibrio formal entre todos ellos.
- EQUILIBRIO: 
Lo más importante de toda composición 
es el mensaje que pretende comunicar, no 
obstante sin una disposición adecuada de 
las formas, colores y agrupaciones no se 
obtiene el equilibrio global de la compo-
sición y el mensaje no llegará de forma 
adecuada al espectador.La existencia de equilibrio en una 
composición, no quiere decir que todas 
las líneas o formas sean iguales en tama-
ño, color u otra dimensión. No existe un 
método formal que consiga una composi-
ción exitosa, pero si existen reglas bási-
cas de diseño que facilitan la transmisión 
efectiva de un mensaje a través de la 
composición gráfica.
 Según sus características el equili-
brio puede clasificarse como: simétrico, 
asimétrico, formal e informal.
 
 Dividiendo la composición en dos ex-
tremos, el equilibrio simétrico se pro-
duce cuando se encuentra igualdad de 
peso y tono en ambos lados de nuestra 
composición, y el equilibrio asimétrico 
se produce cuando no existen las mismas 
dimensiones (ya sea de tamaño, color...) 
en ambos lados, pero aún así existe equi-
librio entre los elementos.
 El equilibrio formal se basa en la bisi-
metría. Se busca un centro óptico dentro 
del diseño, que no tiene por qué coincidir 
con el centro geométrico de la composi-
ción. El equilibrio informal, por el con-
trario, está altamente cargado de fuerza 
gráfica y dinamismo. En este caso el equi-
librio se consigue en base a contraponer 
y contrastar los pesos visuales de los ele-
mentos y las diferentes densidades de co-
lor, que consigan armonizar visualmente 
dentro de una asimetría intencionada.
Ejemplo gráfico de composición simética 
26
- PROPORCIÓN: 
Para obtener la proporción adecuada en 
un diseño debe tenerse en cuenta la fun-
ción de cada elemento visual dentro de la 
composición.
 Los elementos aportan información 
visual según las propiedades del mismo, 
por ejemplo su tamaño, forma o color, 
pero sobre todo su proporción, el peso 
visual que tenga en el total de la com-
posición.
 La forma más directa de marcar proporcio-
nes es mediante el tamaño relativo de los ele-
mentos. Los elementos más grandes,altos o 
anchos tienen una carga visual superior a 
los más pequeños, cortos o finos, creando 
zonas de atracción más intensas.
También se pueden delimitar proporciones 
mediante el color, (en este sentido, los 
colores puros y saturados tienen un mayor 
peso visual que los secundarios), la forma 
y el uso de agrupaciones.
- CONTRASTE: 
El contraste es una herramienta esen-
cial para producir y controlar diferentes 
efectos visuales y, por tanto, una for-
ma de poder transmitir diversos signi-
ficados. Por el contrario a la armonía, 
permite atraer la atención del receptor, 
dramatizar mediante la utilización de 
diferentes contrastes (de color, textura, 
tamaño, etc.), dar un mayor significa-
do a la comunicación que se articula e 
incluso dar un aspecto más dinámico al 
diseño.
 El contraste puede conseguirse a través 
de múltiples articulaciones:
• CONTRASTE DE TONO: La utilización de 
tonos muy contrastados, claridad-oscu-
ridad establecen el contraste tonal. 
• CONTRASTE DE COLORES: El tono tie-
ne mayor fuerza que el propio color en 
el establecimiento del contraste. Dentro 
de las dimensiones del color (el matiz, el 
27
tono y el croma) el tono domina. Después 
de la cualidad tonal, el contraste de color 
más interesante se establece en cuanto a 
cálidos-fríos. Este contraste se refiere a 
la sensación óptica de temperatura en los 
colores y el efecto psicologio que crean, 
se puede ofrecer una gran variedad de 
efectos y reacciones. 
• CONTRASTE DE CONTORNOS: Una forma 
abstracta atrae mucho más la atención 
que una forma geométrica conocida. De 
la misma forma la creación de texturas o 
trazos diferentes se intensifican cuando 
se yuxtaponen.
• CONTRATE DE ESCALA: El contraste tam-
bién puede ser conseguido mediante la 
contraposición de elementos a diferentes 
escalas de las normales, o la utilización 
de proporciones irreales. 
28
El diseño de un sitio Web implica el dise-
ño de una interface gráfica que abarca la 
imagen gráfica del entorno y una progra-
mación accesible, se basa en el hecho de 
lograr que ésta sea intuitiva en su manejo 
y que el usuario pueda accesar eficiente-
mente a la información. 
 Se denomina interface al conjunto 
de elementos que constituyen el puen-
te de comunicación entre el usuario y la 
máquina. La interface ofrece la venta-
ja de representar de alguna manera las 
herramientas y opciones que faciliten la 
interacción, con el objetivo de satisfacer 
las necesidades del usuario.
 Ante el diseño de productos multimedia 
para la Web, se plantea una metodología 
como objeto de este proyecto, adecuada 
para cubrir la necesidad de crear la interface 
óptima para los usuarios de la red Internet.
 La metodología que se propone aplica 
tres niveles: Diseño centrado en el usua-
rio, navegación y evaluación.
A) DISEÑO CENTRADO EN EL USUARIO: 
¿QUÉ INFORMACIÓN SITUAR EN PANTALLA?
Una estrategia para mejorar la accesibi-
lidad de los sitios Web, es el diseño de 
entornos que sean usables por el máximo 
de personas posible.
 Es importante investigar cuales son 
las necesidades del público potencial 
(target), ya que resulta más eficaz la 
adaptación de la interface dinámica para 
el usuario según sus propias necesidades y 
características. 
- PLANIFICACIÓN: DEFINICIÓN DE REQUERIMIENTOS
 Todo proyecto comienza con una pla-
nificación, por lo tanto, en esta etapa se 
deben identificar los objetivos y necesi-
dades; también de usuarios discapacita-
dos, personas mayores o usuarios limita-
dos por el contexto de uso, que aunque 
comparten objetivos con el usuario me-
dio, tendrán necesidades de acceso di-
ferentes.
 Esta información se obtiene median-
te encuestas, observaciones, entrevistas, 
etc. Y se deberá confrontar con los obje-
tivos del proyecto, para poder especificar 
los requerimientos principales.
 
B) NAVEGACIÓN Y ORIENTACIÓN DEL 
USUARIO: ¿CÓMO SITUAR LA INFORMACIÓN?
Los elementos de navegación y orientación 
tienen la función de informar al usuario el 
contexto en el que se encuentra respecto 
al resto de la arquitectura del sitio, donde 
ha estado y hacia donde puede ir. El obje-
tivo es no perder al usuario.
1.3.2 EL DISEÑO DE LA INTERFACE
29
 Las dos formas básicas para no perder 
al usuario son: que no se aburra y que no 
se pierda en la navegación del sitio. Lo 
ideal, es crear una interface que sea ágil 
en su descarga y que aún si no le intere-
san los contenidos al usuario, permanezca 
atento al sitio.
 Que el usuario se pierda, es decir que 
no sepa en que zona del sitio se encuentra, 
es resultado de una incorrecta arquitec-
tura de información y como consecuencia 
un mal diseño en las estructuras de conte-
nido. La primera regla para que el usuario 
sepa que sigue estando en nuestro sitio, 
es manteniendo una uniformidad de dise-
ño en la totalidad de las páginas o nodos 
que conforman el sitio. Los colores y las 
formas visuales ayudan en gran medida a 
lograr ese equilibrio en la estructura. 
- JERARQUIA VISUAL
Es la herramienta visual usada para que el 
usuario distinga claramente los elementos 
de exploración más importantes del sitio.
 
 Usar la jerarquía visual para acentuar 
elementos importantes es una solución 
para que el usuario sepa exactamente en 
que zona del sitio Web se encuentra. Esto 
se puede lograr utilizando diferentes ta-
maños o situarlos en distintos lugares en 
la pantalla. Los usuarios leen de izquierda 
a derecha y de arriba hacia abajo. Por lo 
tanto aquellos elementos colocados cerca 
de la esquina superior izquierda de la in-
terface, tendrán mayor nivel jerárquico y 
por ende los que se encuentran en la par-
te inferior derecha son menos importan-
tes. Notese en el siguiente ejemplo donde 
el logótipo, las imágenes y el menú se en-
cuentran en el lado superior izquierdo:
 Un error común en la estructuración 
de los elementos en la interface, es colo-
car dos menús de navegación en la misma 
jerarquía visual, este caso provoca que el 
usuario se sienta confundido sobre cual es 
submenú de cual y no sabrá cual es la na-
vegación correcta.
Incorrecta Correcta
Ejemplo de Jerárquica visual30
 El posicionamiento y el tamaño de los 
elementos en una página también remi-
ten la importancia de ciertas partes en la 
estructura de la interface. En el siguien-
te ejemplo puede notarse que los boto-
nes de la franja azul pesan por encima de 
cualquier otro dentro de la inteface.
 
 A lo que el usuario este más acos-
tumbrado es un factor muy importante 
dentro del diseño de sitios Web usables. 
Como señala Jacob Nielsen, “Los usuarios 
pasan la mayor parte del tiempo visitando 
otras Webs, lo que quiere decir que les 
será más fácil navegar el sitio Web cuanto 
más se parezca al resto”21.
- ADELANTE, ATRAS E INICIO
Estos enlaces dependen del tipo de na-
vegación que se utilice. Para moverse a 
través de un sub-elemento que tenga una 
estructura secuencial es necesario una 
barra de navegación para facilitar la ex-
ploración del contenido.
 El botón de inicio es un buena ayuda 
para el usuario que se encuentra perdi-
do, con el podrá deshacer su navegación 
y volver al principio. En el caso de que 
el usuario no ha entrado por la puerta 
principal de la Web (homepage), este 
enlace es una vía rápida para averiguar 
si en el sitio en el que se encuentra hay 
más información que le interesa.
- BREADCRUMBS 
Los breadcrumbs o “migas de pan” se re-
fi eren a un listado de enlaces que permite 
indicar el camino seguido por un usuario 
desde la página de inicio o home page, 
hasta la página que se esté revisando. 
Gracias a ello, se le ofrece una ubicación 
espacial que le apoye en su navegación. 
Su importancia radica en que no siempre 
el usuario llega por medio de la navega-
ción del sitio, sino porque fue redirigido 
desde otro sitio Web.
 
21 http://www.nosolousabilidad.com/articulos/como leen usuarios/htm
portada / sección A / sub sección A1
31
El usuario recuerda las páginas que ha vi-
sitado, pero no tienen porqué recordar el 
nombre de los enlaces que lo llevan ha-
cia ellas. De hecho, quizás ni siquiera ha 
utilizado esos enlaces para llegar a esas 
páginas.
 
C) EVALUACIÓN:
 ¿LA NAVEGACIÓN ES FUNCIONAL?
Finalmente, es necesario revisar la co-
herencia general en cuanto a la interfa-
ce del sitio, detectar posibles defectos 
en el diseño, que no hayan links “rotos” 
que no conduzcan a ninguna parte. Ade-
más de estas revisiones, debe ser probado 
mediante ejecuciones controladas; estas 
ejecuciones o ensayos de funcionamiento, 
se denominan comúnmente pruebas.
 Probar los diseños y observar las reac-
ciones de usuarios concretos, es la mejor 
manera de comprobar si los elementos de 
diseño que se han utilizado, realmente 
proporcionan lo esperado en su desempe-
ño en la Web. 
 Es convente revisar como se ve la in-
terface en pantallas pequeñas (640 x 480 
píxeles) y en pantallas con paletas de 256 
colores (monitores de 8 bits), para no dis-
criminar a los usuarios que no tengan las 
características básicas para visualizar el 
sitio en su equipo.
 Para esta etapa, lo mejor es tratar de 
buscar usuarios que vayan a utilizar el sitio, 
y si eso no es posible, ponerse en su lugar, y 
seguir los pasos se supone ellos seguirán.
32
El color es una sensación visual, provoca-
da por la luz que registra el ojo. Según 
James Clerk Maxwell a finales del siglo XIX 
descubrió que esa luz visible solo forma 
una pequeña parte del espectro electro-
magnético. Por lo tanto, los colores pue-
den definirse de forma precisa a partir de 
su longitud de onda y esta puede prove-
nir de diversas ondas electromagnéticas 
como las que emiten: la radio, la televi-
sión, el monitor, los rayos X y gamma, por 
mencionar solo algunas. La cantidad de 
radiación que emite un cuerpo depende 
de su temperatura.
 Los cuerpos sólidos reflejan prácti-
camente todo tipo de radiaciones. Al au-
mentar la temperatura el máximo de la 
intensidad radiada se produce a menores 
longitudes de onda.
 La luz del sol está formada en reali-
dad por un amplio espectro de radiacio-
nes electromagnéticas, contiene todas las 
longitudes de onda de la luz y cada lon-
gitud de onda define un color diferente, 
este efecto se denomina espectro de la 
luz blanca o espectro visual. Por lo tanto, 
“el color es el producto de las longitudes 
de onda que son reflejadas o absorbidas 
por la superficie de un objeto”22. 
 El mecanismo de mezcla y producción 
de colores producido por la reflexión de la 
luz sobre un cuerpo es diferente al de la 
obtención de colores por mezcla directa 
de rayos de luz, como ocurre con el del 
monitor de un ordenador.
 Otro punto importante en el estudio 
del color es el entorno visual en el que 
se realiza la visión. Porque de la misma 
manera en que el ojo se adapta a la luz 
que recibe, también se adapta a los co-
lores que hay a su alrededor. De esta ma-
nera, un mismo color puesto en entornos 
diferentes se percibirá de distinta mane-
ra. Este fenómeno de visión se denomina 
contraste simultáneo. Tal efecto se pue-
de observar en el siguiente ejemplo:
El color de un cuerpo depende de:
- la naturaleza de su superficie 
- del tipo de luz que lo ilumina
 Los colores forman parte de toda expe-
riencia cotidiana, aunque muchas veces 
no se esta consciente de que el color pro-
voca en los receptores emociones, reac-
ciones o sensaciones. 
1.3.2.1 COLOR
22 http://www.desarrolloweb.com/articulos/1445.php?manual=47
33
COLORES SUSTRACTIVOS Y ADITIVOS
Existen dos modelos de síntesis cromática 
del color: La sustractiva o colores pigmen-
to y la aditiva o colores luz:
 El sistema sustractivo combina los co-
lores primarios: cian, magenta y amarillo, 
junto con el negro para reforzar el con-
traste, este modelo se conoce como CMYK 
(acrónimo ingles de los primarios) y son la 
sustancia de toda impresión convencional 
en papel.
 
 En el sistema aditivo los monitores de 
los ordenadores generan luz y el resultado 
es conocido como color aditivo. En este 
sistema la luz blanca se produce en la 
combinación de todos los colores del es-
pectro y que pueden descomponerse en 
tres primarios: rojo, verde y azul (RGB, 
acrónimo de sus siglas en ingles). Donde 
el negro, por lo tanto, es la ausencia de 
luz.
 
CÍRCULO CROMÁTICO
En la mezcla de los colores primarios se 
obtienen los colores secundarios y por la 
mezcla de éstos los colores terciarios, si 
se continúa mezclando colores vecinos 
se obtienen nuevos colores, consiguiendo 
una representación de éstos muy impor-
tante en diseño, denominada círculo cro-
mático, representativa de la descomposi-
ción en colores de la luz solar, que ayuda 
a clasificar éstos y a obtener sus combina-
ciones idóneas. 
Sistema de color CMYK
Sistema de color RGB
YELLOW
CYAN
MAGENTA
BLUE GREEN
RED
Círculo cromático
GREEN
RED
MAGENTA YELLOW
CYANBLUE
34
2. Valor: Es el brillo u oscuridad de un matiz. Para aclarar u oscurecer un color se logra 
mezclando cada color con blanco o negro. La escala varia de 0% (negro puro) a 100% 
(blanco puro).
 
3. Saturación o intensidad: Representa la pureza o intensidad de un color en particu-
lar, “se refiere a la fuerza de un color, su grado de energía o tristeza” , por lo tanto, 
los colores de baja intensidad son llamados débiles y los de máxima se denominan 
saturados o fuertes.
 
PROPIEDADES DEL COLOR
Las paletas del color derivan millones de 
colores aparte de los primarios, secunda-
rios y terciarios. Estos son el resultado de 
una combinación de las tres propiedades 
del color:
1. Matiz: Es el resultado de la mezcla de 
colores para obtener una variación conti-
nua de un color a otro. Por ejemplo, mez-
clando el azul y el amarillo en proporcio-
nes distintas de uno y otro, se obtienen 
diversos matices de verde.
Matices en el círculo cromático
Brillos del color rojo
Saturaciones del color rojo
(-60%) C30001 (-30%) E50001 (0%) FF0000 (30%) FF1E1F (60%) FE3C3A 
 #8A0202 #C60000